From 62650559900d7b62b9e15931b54a1b27158627e2 Mon Sep 17 00:00:00 2001
From: Benjamin Franzke <bfr@qbus.de>
Date: Mon, 27 Apr 2020 21:00:50 +0200
Subject: [PATCH] [BUGFIX] Fix inline icon rendering of bitmap icons
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The existing "inline" rendering for icons causes bitmaps to be
rendered for SVG-inline usage using the <image> tag. This tag
can not be rendered in HTML context.

The backend module menu uses inlined SVGs. Rendering bitmap icons with
SVG-syntax, without an SVG root element, does not work in this context.
(Note: It works in SVG trees because the optional svg container is
removed by SvgTree.js and the image-tag is wrapped into a new <g> element)

We do now wrap "inline" bitmap icons into an svg tag, which will fix
the bitmap module case while the bitmap icons will still
be embeddable into svg groups (<g>) for svg trees.

Resolves: #89558
Related: #89206
Releases: master, 9.5
Change-Id: Ifaec3e697a45ba37b1ee23c0369414ce431cf4e8
Reviewed-on: https://review.typo3.org/c/Packages/TYPO3.CMS/+/64325
Tested-by: Markus Klein <markus.klein@typo3.org>
Tested-by: TYPO3com <noreply@typo3.com>
Tested-by: Benni Mack <benni@typo3.org>
Reviewed-by: Markus Klein <markus.klein@typo3.org>
Reviewed-by: Frank Nägler <frank.naegler@typo3.org>
Reviewed-by: Benni Mack <benni@typo3.org>
---
 .../sysext/backend/Resources/Public/JavaScript/SvgTree.js | 5 -----
 .../Classes/Imaging/IconProvider/BitmapIconProvider.php   | 8 ++++++--
 2 files changed, 6 insertions(+), 7 deletions(-)

diff --git a/typo3/sysext/backend/Resources/Public/JavaScript/SvgTree.js b/typo3/sysext/backend/Resources/Public/JavaScript/SvgTree.js
index 22425bd22534..bc8bd7cbffa0 100644
--- a/typo3/sysext/backend/Resources/Public/JavaScript/SvgTree.js
+++ b/typo3/sysext/backend/Resources/Public/JavaScript/SvgTree.js
@@ -608,11 +608,6 @@ define(
           Icons.getIcon(iconName, Icons.sizes.small, null, null, 'inline').then(function(icon) {
             var result = icon.match(/<svg[\s\S]*<\/svg>/i);
 
-            // Check if the icon is from the Bitmap Icon Provider (see PHP class for the inline rendering)
-            if (!result) {
-              result = icon.match(/<image[\s\S]*\/>/i);
-            }
-
             if (result) {
               _this.data.icons[iconName].icon = result[0];
             }
diff --git a/typo3/sysext/core/Classes/Imaging/IconProvider/BitmapIconProvider.php b/typo3/sysext/core/Classes/Imaging/IconProvider/BitmapIconProvider.php
index e018ba229575..8600ead6e0bb 100644
--- a/typo3/sysext/core/Classes/Imaging/IconProvider/BitmapIconProvider.php
+++ b/typo3/sysext/core/Classes/Imaging/IconProvider/BitmapIconProvider.php
@@ -81,7 +81,11 @@ class BitmapIconProvider implements IconProviderInterface
             return '';
         }
 
-        return '<image width="' . $icon->getDimension()->getWidth() . '" height="'
-            . $icon->getDimension()->getHeight() . '" xlink:href="' . PathUtility::getAbsoluteWebPath($source) . '"/>';
+        return sprintf(
+            '<svg version="1.1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 %1$d %2$d" width="%1$d" height="%2$d"><image width="%1$d" height="%1$d" xlink:href="%3$s"/></svg>',
+            $icon->getDimension()->getWidth(),
+            $icon->getDimension()->getHeight(),
+            PathUtility::getAbsoluteWebPath($source)
+        );
     }
 }
-- 
GitLab