Update util.ts

Author: mon-jai

src/util.ts

@@ -92,6 +92,13 @@ export async function archiveConversation(browser: Browser, id: string) {
       // Script tags
       const scriptTags = document.getElementsByTagName("script")
       while (scriptTags.length > 0) scriptTags[0]!.remove()
+
+      // Remove inline CSS variables to make the later step of removing unused CSS variables easier
+      // <div style="--a: 0px"> ...
+      // <div style='--a: 0px'> ...
+      for (const elWithStyleAttribute of document.querySelectorAll("[style]")) {
+        if (elWithStyleAttribute.getAttribute("style")!.includes("--")) elWithStyleAttribute.removeAttribute("style")
+      }
     })
 
     // https://github.com/gildas-lormeau/single-file-cli/blob/v2.0.75/single-file-cli-api.js#L258
@@ -115,24 +122,21 @@ export async function archiveConversation(browser: Browser, id: string) {
     )
 
     const fileContent = pageData.content
-      // Remove Google Sans family and Google Symbol font face
+      // Remove fonts
       .replaceAll(/@font-face\s*{[^}]*}/g, (fontFaceRule: string) => {
         const fontFamilyMatch = fontFaceRule.match(/font-family:\s*(?<quote>['"]?)(?<fontFamily>[^'"]+)\k<quote>/)
         const fontFamily = fontFamilyMatch?.groups?.["fontFamily"]?.trim() ?? ""
 
         if (includesKatex && fontFamily.startsWith("KaTeX")) return fontFaceRule
         else return ""
       })
+      // Remove unused CSS variables
       .replaceAll(
         // --a: 0px; } .class { ...
-        // <div style="--a: 0px"> ...
-        // <div style='--a: 0px'> ...
-        /(?<variableName>--[a-zA-Z0-9\-]+)\s*:\s*(?<value>[^;\n\}]+)\s*[;\n]?(?<curlyBrace>\})?(?<quote>["'])?/gm,
-        (_match, variableName: string, value: string, curlyBrace: string | undefined, quote: string | undefined) => {
-          const suffix = `${curlyBrace ?? ""}${quote ?? ""}`
-               console.log(_match, suffix)
-     if (variablesUsedInDocument.has(variableName)) return `${variableName}:${value};${suffix}`
-          return suffix
+        /(?<variableName>--[a-zA-Z0-9\-]+)\s*:\s*(?<value>[^;\n\}]+)\s*[;\n]?(?<curlyBrace>\})?/gm,
+        (_match, variableName: string, value: string, curlyBrace: string | undefined = "") => {
+          if (variablesUsedInDocument.has(variableName)) return `${variableName}:${value};${curlyBrace}`
+          return curlyBrace
         }
       )