import storage from './storage';
import {SVGRenderer} from 'scratch-svg-renderer';

// Contains 'font-family', but doesn't only contain 'font-family="none"'
const HAS_FONT_REGEXP = 'font-family(?!="none")';

const getCostumeUrl = (function () {
    let cachedAssetId;
    let cachedUrl;

    return function (asset) {

        if (cachedAssetId === asset.assetId) {
            return cachedUrl;
        }

        cachedAssetId = asset.assetId;

        // If the SVG refers to fonts, they must be inlined in order to display correctly in the img tag.
        // Avoid parsing the SVG when possible, since it's expensive.
        if (asset.assetType === storage.AssetType.ImageVector) {
            const svgString = asset.decodeText();
            if (svgString.match(HAS_FONT_REGEXP)) {
                const svgRenderer = new SVGRenderer();
                svgRenderer.loadString(svgString);
                const svgText = svgRenderer.toString(true /* shouldInjectFonts */);
                cachedUrl = `data:image/svg+xml;utf8,${encodeURIComponent(svgText)}`;
            } else {
                cachedUrl = asset.encodeDataURI();
            }
        } else {
            cachedUrl = asset.encodeDataURI();
        }

        return cachedUrl;
    };
}());

export {
    getCostumeUrl as default,
    HAS_FONT_REGEXP
};

@@ -34,27 +34,30 @@
 import %7B
-SVGRenderer
+inlineSvgFonts
 %7D from '
@@ -815,170 +815,39 @@
  svg
-Renderer = new SVGRenderer();%0A                svgRenderer.loadString(svgString);%0A                const svgText = svgRenderer.toString(true /* shouldInjectFonts */
+Text = inlineSvgFonts(svgString
 );%0A 

Use fontInliner instead of entire SVGRenderer for showing costume tiles.