generate whole browser url from server side

Signed-off-by: lstocchi <lstocchi@redhat.com>
containers · Jul 5, 2023 · 366dfed · 366dfed
1 parent 56c29ce
commit 366dfed
Show file tree

Hide file tree

Showing 3 changed files with 5 additions and 8 deletions.
diff --git a/packages/main/src/plugin/icon-registry.spec.ts b/packages/main/src/plugin/icon-registry.spec.ts
@@ -81,7 +81,7 @@ test('should register icon contribution', async () => {
     {
       format: 'woff2',
       location: `${extensionPath}/${fontPath}`,
-      browserURL: `${extensionPath}/${fontPath}`,
+      browserURL: `url('file://${extensionPath}/${fontPath}')`,
     },
   ]);
   expect(icon.definition.font?.fontId).toBe(`${extensionId}-${fontPath}`);

diff --git a/packages/main/src/plugin/icon-registry.ts b/packages/main/src/plugin/icon-registry.ts
@@ -96,10 +96,11 @@ export class IconRegistry {
       // fontId is based on the extension id and the font path
       const fontId = `${extension.id}-${defaultAttributes.fontPath}`;
 
-      let browserURL = iconFontLocation;
+      let cleanedIconFontLocation = iconFontLocation.replace(/'/g, '%27');
       if (isWindows()) {
-        browserURL = browserURL.replace(/\\/g, '/');
+        cleanedIconFontLocation = cleanedIconFontLocation.replace(/\\/g, '/');
       }
+      const browserURL = `url('file://${cleanedIconFontLocation}')`;
 
       // font definition
       const fontDefinition: FontDefinition = {

diff --git a/packages/renderer/src/lib/style/IconsStyle.svelte b/packages/renderer/src/lib/style/IconsStyle.svelte
@@ -18,10 +18,6 @@ function createStyleSheet(): HTMLStyleElement {
   return style;
 }
 
-export function toUrl(location: string) {
-  return `url('file://${location.replace(/'/g, '%27')}')`;
-}
-
 onMount(() => {
   createStyleSheet();
 
@@ -46,7 +42,7 @@ onMount(() => {
     });
 
     fontsToAdd.forEach(font => {
-      const src = font.src.map(l => `${toUrl(l.browserURL)} format('${l.format}')`).join(', ');
+      const src = font.src.map(l => `${l.browserURL} format('${l.format}')`).join(', ');
       styles.push(
         `@font-face { src: ${src}; font-family: '${font.fontId.replace(/'/g, '%27')}'; font-display: block; }`,
       );