* @return string New SVG file data
*/
protected function variantize( $variantConf, ResourceLoaderContext $context ) {
- $dom = new DomDocument;
+ $dom = new DOMDocument;
$dom->loadXML( file_get_contents( $this->getPath( $context ) ) );
$root = $dom->documentElement;
- $wrapper = $dom->createElement( 'g' );
+ $titleNode = null;
+ $wrapper = $dom->createElementNS( 'http://www.w3.org/2000/svg', 'g' );
+ // Reattach all direct children of the `<svg>` root node to the `<g>` wrapper
while ( $root->firstChild ) {
- $wrapper->appendChild( $root->firstChild );
+ $node = $root->firstChild;
+ if ( !$titleNode && $node->nodeType === XML_ELEMENT_NODE && $node->tagName === 'title' ) {
+ // Remember the first encountered `<title>` node
+ $titleNode = $node;
+ }
+ $wrapper->appendChild( $node );
+ }
+ if ( $titleNode ) {
+ // Reattach the `<title>` node to the `<svg>` root node rather than the `<g>` wrapper
+ $root->appendChild( $titleNode );
}
$root->appendChild( $wrapper );
$wrapper->setAttribute( 'fill', $variantConf['color'] );
* @return string Massaged SVG image data
*/
protected function massageSvgPathdata( $svg ) {
- $dom = new DomDocument;
+ $dom = new DOMDocument;
$dom->loadXML( $svg );
foreach ( $dom->getElementsByTagName( 'path' ) as $node ) {
$pathData = $node->getAttribute( 'd' );