darkreader 4.9.118 → 4.9.119

package/LICENSE

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2025 Dark Reader Ltd.
+Copyright (c) 2026 Dark Reader Ltd.
 
 All rights reserved.
 

package/darkreader.js

@@ -1,5 +1,5 @@
 /**
- * Dark Reader v4.9.118
+ * Dark Reader v4.9.119
  * https://darkreader.org/
  */
 
@@ -2759,14 +2759,59 @@
     async function getImageDetails(url) {
         return new Promise(async (resolve, reject) => {
             try {
-                const dataURL = url.startsWith("data:")
+                let dataURL = url.startsWith("data:")
                     ? url
                     : await getDataURL(url);
                 const blob =
                     tryConvertDataURLToBlobSync(dataURL) ??
                     (await loadAsBlob(url));
                 let image;
+                let useViewBox = false;
                 if (dataURL.startsWith("data:image/svg+xml")) {
+                    const commaIndex = dataURL.indexOf(",");
+                    if (commaIndex >= 0) {
+                        let svgText = dataURL.slice(commaIndex + 1);
+                        const encoding = dataURL
+                            .slice(0, commaIndex)
+                            .split(";")[1];
+                        if (encoding === "base64") {
+                            svgText = atob(svgText);
+                        }
+                        if (svgText.startsWith("<svg ")) {
+                            const closingIndex = svgText.indexOf(">");
+                            const svgOpening = svgText
+                                .slice(0, closingIndex + 1)
+                                .toLocaleLowerCase();
+                            if (
+                                svgOpening.includes("viewbox") &&
+                                !svgOpening.includes("width") &&
+                                !svgOpening.includes("height")
+                            ) {
+                                useViewBox = true;
+                                const viewboxIndex =
+                                    svgOpening.indexOf('viewbox="');
+                                const viewboxCloseIndex = svgOpening.indexOf(
+                                    'viewbox="',
+                                    viewboxIndex + 9
+                                );
+                                const viewBox = svgOpening
+                                    .slice(
+                                        viewboxIndex + 9,
+                                        viewboxCloseIndex - 1
+                                    )
+                                    .split(" ")
+                                    .map((x) => parseFloat(x));
+                                if (
+                                    viewBox.length === 4 &&
+                                    !viewBox.some((x) => isNaN(x))
+                                ) {
+                                    const width = viewBox[2] - viewBox[0];
+                                    const height = viewBox[3] - viewBox[1];
+                                    dataURL = `data:image/svg+xml;base64,${btoa(`<svg width="${width}" height="${height}" ${svgText.slice(5)}`)}`;
+                                }
+                            }
+                        }
+                    }
                     image = await loadImage(dataURL);
                 } else {
                     image =
@@ -2780,6 +2825,7 @@
                         dataURL: analysis.isLarge ? "" : dataURL,
                         width: image.width,
                         height: image.height,
+                        useViewBox,
                         ...analysis
                     });
                 });
@@ -2967,13 +3013,16 @@
     }
     document.addEventListener("securitypolicyviolation", onCSPError);
     const objectURLs = new Set();
-    function getFilteredImageURL({dataURL, width, height}, theme) {
+    function getFilteredImageURL({dataURL, width, height, useViewBox}, theme) {
         if (dataURL.startsWith("data:image/svg+xml")) {
             dataURL = escapeXML(dataURL);
         }
         const matrix = getSVGFilterMatrixValue(theme);
+        const size = useViewBox
+            ? `viewBox="0 0 ${width} ${height}"`
+            : `width="${width}" height="${height}"`;
         const svg = [
-            `<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="${width}" height="${height}">`,
+            `<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" ${size}>`,
             "<defs>",
             '<filter id="darkreader-image-filter">',
             `<feColorMatrix type="matrix" values="${matrix}" />`,
@@ -4235,8 +4284,8 @@
             this.definedVars.add(varName);
             const isColor = Boolean(
                 value.match(rawRGBSpaceRegex) ||
-                    value.match(rawRGBCommaRegex) ||
-                    parseColorWithCache(value)
+                value.match(rawRGBCommaRegex) ||
+                parseColorWithCache(value)
             );
             if (isColor) {
                 this.unknownColorVars.add(varName);
@@ -5629,8 +5678,8 @@
         }
         const shouldAnalyze = Boolean(
             svg &&
-                (svg.getAttribute("class")?.includes("logo") ||
-                    svg.parentElement?.getAttribute("class")?.includes("logo"))
+            (svg.getAttribute("class")?.includes("logo") ||
+                svg.parentElement?.getAttribute("class")?.includes("logo"))
         );
         svgAnalysisConditionCache.set(svg, shouldAnalyze);
         return shouldAnalyze;
@@ -5673,6 +5722,7 @@
         svgNodesRoots.set(svgElement, root);
         return root;
     }
+    const inlineStringValueCache = new Map();
     function overrideInlineStyle(
         element,
         theme,
@@ -5700,6 +5750,13 @@
         }
         const unsetProps = new Set(Object.keys(overrides));
         function setCustomProp(targetCSSProp, modifierCSSProp, cssVal) {
+            const cachedStringValue = inlineStringValueCache
+                .get(modifierCSSProp)
+                ?.get(cssVal);
+            if (cachedStringValue) {
+                setStaticValue(cachedStringValue);
+                return;
+            }
             const mod = getModifiableCSSDeclaration(
                 modifierCSSProp,
                 cssVal,
@@ -5766,6 +5823,10 @@
                 typeof mod.value === "function" ? mod.value(theme) : mod.value;
             if (typeof value === "string") {
                 setStaticValue(value);
+                if (!inlineStringValueCache.has(modifierCSSProp)) {
+                    inlineStringValueCache.set(modifierCSSProp, new Map());
+                }
+                inlineStringValueCache.get(modifierCSSProp).set(cssVal, value);
             } else if (value instanceof Promise) {
                 setAsyncValue(value, cssVal);
             } else if (typeof value === "object") {
@@ -5852,13 +5913,16 @@
                 value.match(/^[0-9a-f]{6}$/i)
             ) {
                 value = `#${value}`;
+            } else if (value.match(/^#?[0-9a-f]{4}$/i)) {
+                const hex = value.startsWith("#") ? value.substring(1) : value;
+                value = `#${hex}00`;
             }
             setCustomProp("color", "color", value);
         }
         if (isSVGElement) {
             if (element.hasAttribute("fill")) {
                 const value = element.getAttribute("fill");
-                if (value !== "none") {
+                if (value !== "none" && value !== "currentColor") {
                     if (!(element instanceof SVGTextElement)) {
                         const handleSVGElement = () => {
                             let isSVGSmall = false;
@@ -6190,7 +6254,7 @@
             forEach(node.querySelectorAll(STYLE_SELECTOR), (style) =>
                 getManageableStyles(style, results, false)
             );
-            if (deep) {
+            if (deep && (node.children?.length > 0 || node.shadowRoot)) {
                 iterateShadowHosts(node, (host) =>
                     getManageableStyles(host.shadowRoot, results, false)
                 );
@@ -7358,10 +7422,23 @@
                 removedStyles,
                 movedStyles
             });
+            const potentialHosts = new Set();
             additions.forEach((n) => {
+                if (n.parentElement) {
+                    potentialHosts.add(n.parentElement);
+                }
+                if (n.previousElementSibling) {
+                    potentialHosts.add(n.previousElementSibling);
+                }
                 deepObserve(n);
                 collectUndefinedElements(n);
             });
+            potentialHosts.forEach((el) => {
+                if (el.shadowRoot && !observedRoots.has(el)) {
+                    subscribeForShadowRootChanges(el);
+                    deepObserve(el.shadowRoot);
+                }
+            });
             additions.forEach(
                 (node) => isCustomElement(node) && recordUndefinedElement(node)
             );
@@ -7475,6 +7552,14 @@
         });
         document.addEventListener("__darkreader__isDefined", handleIsDefined);
         collectUndefinedElements(document);
+        addDOMReadyListener(() => {
+            forEach(document.body.children, (el) => {
+                if (el.shadowRoot && !observedRoots.has(el)) {
+                    subscribeForShadowRootChanges(el);
+                    deepObserve(el.shadowRoot);
+                }
+            });
+        });
     }
     function resetObservers() {
         observers.forEach((o) => o.disconnect());

package/darkreader.mjs

@@ -1,5 +1,5 @@
 /**
- * Dark Reader v4.9.118
+ * Dark Reader v4.9.119
  * https://darkreader.org/
  */
 
@@ -2671,13 +2671,51 @@ const imageManager = new AsyncQueue();
 async function getImageDetails(url) {
     return new Promise(async (resolve, reject) => {
         try {
-            const dataURL = url.startsWith("data:")
-                ? url
-                : await getDataURL(url);
+            let dataURL = url.startsWith("data:") ? url : await getDataURL(url);
             const blob =
                 tryConvertDataURLToBlobSync(dataURL) ?? (await loadAsBlob(url));
             let image;
+            let useViewBox = false;
             if (dataURL.startsWith("data:image/svg+xml")) {
+                const commaIndex = dataURL.indexOf(",");
+                if (commaIndex >= 0) {
+                    let svgText = dataURL.slice(commaIndex + 1);
+                    const encoding = dataURL.slice(0, commaIndex).split(";")[1];
+                    if (encoding === "base64") {
+                        svgText = atob(svgText);
+                    }
+                    if (svgText.startsWith("<svg ")) {
+                        const closingIndex = svgText.indexOf(">");
+                        const svgOpening = svgText
+                            .slice(0, closingIndex + 1)
+                            .toLocaleLowerCase();
+                        if (
+                            svgOpening.includes("viewbox") &&
+                            !svgOpening.includes("width") &&
+                            !svgOpening.includes("height")
+                        ) {
+                            useViewBox = true;
+                            const viewboxIndex =
+                                svgOpening.indexOf('viewbox="');
+                            const viewboxCloseIndex = svgOpening.indexOf(
+                                'viewbox="',
+                                viewboxIndex + 9
+                            );
+                            const viewBox = svgOpening
+                                .slice(viewboxIndex + 9, viewboxCloseIndex - 1)
+                                .split(" ")
+                                .map((x) => parseFloat(x));
+                            if (
+                                viewBox.length === 4 &&
+                                !viewBox.some((x) => isNaN(x))
+                            ) {
+                                const width = viewBox[2] - viewBox[0];
+                                const height = viewBox[3] - viewBox[1];
+                                dataURL = `data:image/svg+xml;base64,${btoa(`<svg width="${width}" height="${height}" ${svgText.slice(5)}`)}`;
+                            }
+                        }
+                    }
+                }
                 image = await loadImage(dataURL);
             } else {
                 image =
@@ -2691,6 +2729,7 @@ async function getImageDetails(url) {
                     dataURL: analysis.isLarge ? "" : dataURL,
                     width: image.width,
                     height: image.height,
+                    useViewBox,
                     ...analysis
                 });
             });
@@ -2877,13 +2916,16 @@ function onCSPError(err) {
 }
 document.addEventListener("securitypolicyviolation", onCSPError);
 const objectURLs = new Set();
-function getFilteredImageURL({dataURL, width, height}, theme) {
+function getFilteredImageURL({dataURL, width, height, useViewBox}, theme) {
     if (dataURL.startsWith("data:image/svg+xml")) {
         dataURL = escapeXML(dataURL);
     }
     const matrix = getSVGFilterMatrixValue(theme);
+    const size = useViewBox
+        ? `viewBox="0 0 ${width} ${height}"`
+        : `width="${width}" height="${height}"`;
     const svg = [
-        `<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="${width}" height="${height}">`,
+        `<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" ${size}>`,
         "<defs>",
         '<filter id="darkreader-image-filter">',
         `<feColorMatrix type="matrix" values="${matrix}" />`,
@@ -4094,8 +4136,8 @@ class VariablesStore {
         this.definedVars.add(varName);
         const isColor = Boolean(
             value.match(rawRGBSpaceRegex) ||
-                value.match(rawRGBCommaRegex) ||
-                parseColorWithCache(value)
+            value.match(rawRGBCommaRegex) ||
+            parseColorWithCache(value)
         );
         if (isColor) {
             this.unknownColorVars.add(varName);
@@ -5466,8 +5508,8 @@ function shouldAnalyzeSVGAsImage(svg) {
     }
     const shouldAnalyze = Boolean(
         svg &&
-            (svg.getAttribute("class")?.includes("logo") ||
-                svg.parentElement?.getAttribute("class")?.includes("logo"))
+        (svg.getAttribute("class")?.includes("logo") ||
+            svg.parentElement?.getAttribute("class")?.includes("logo"))
     );
     svgAnalysisConditionCache.set(svg, shouldAnalyze);
     return shouldAnalyze;
@@ -5510,6 +5552,7 @@ function getSVGElementRoot(svgElement) {
     svgNodesRoots.set(svgElement, root);
     return root;
 }
+const inlineStringValueCache = new Map();
 function overrideInlineStyle(
     element,
     theme,
@@ -5537,6 +5580,13 @@ function overrideInlineStyle(
     }
     const unsetProps = new Set(Object.keys(overrides));
     function setCustomProp(targetCSSProp, modifierCSSProp, cssVal) {
+        const cachedStringValue = inlineStringValueCache
+            .get(modifierCSSProp)
+            ?.get(cssVal);
+        if (cachedStringValue) {
+            setStaticValue(cachedStringValue);
+            return;
+        }
         const mod = getModifiableCSSDeclaration(
             modifierCSSProp,
             cssVal,
@@ -5602,6 +5652,10 @@ function overrideInlineStyle(
             typeof mod.value === "function" ? mod.value(theme) : mod.value;
         if (typeof value === "string") {
             setStaticValue(value);
+            if (!inlineStringValueCache.has(modifierCSSProp)) {
+                inlineStringValueCache.set(modifierCSSProp, new Map());
+            }
+            inlineStringValueCache.get(modifierCSSProp).set(cssVal, value);
         } else if (value instanceof Promise) {
             setAsyncValue(value, cssVal);
         } else if (typeof value === "object") {
@@ -5676,13 +5730,16 @@ function overrideInlineStyle(
         let value = element.getAttribute("color");
         if (value.match(/^[0-9a-f]{3}$/i) || value.match(/^[0-9a-f]{6}$/i)) {
             value = `#${value}`;
+        } else if (value.match(/^#?[0-9a-f]{4}$/i)) {
+            const hex = value.startsWith("#") ? value.substring(1) : value;
+            value = `#${hex}00`;
         }
         setCustomProp("color", "color", value);
     }
     if (isSVGElement) {
         if (element.hasAttribute("fill")) {
             const value = element.getAttribute("fill");
-            if (value !== "none") {
+            if (value !== "none" && value !== "currentColor") {
                 if (!(element instanceof SVGTextElement)) {
                     const handleSVGElement = () => {
                         let isSVGSmall = false;
@@ -5994,7 +6051,7 @@ function getManageableStyles(node, results = [], deep = true) {
         forEach(node.querySelectorAll(STYLE_SELECTOR), (style) =>
             getManageableStyles(style, results, false)
         );
-        if (deep) {
+        if (deep && (node.children?.length > 0 || node.shadowRoot)) {
             iterateShadowHosts(node, (host) =>
                 getManageableStyles(host.shadowRoot, results, false)
             );
@@ -7120,10 +7177,23 @@ function watchForStylePositions(currentStyles, update, shadowRootDiscovered) {
             removedStyles,
             movedStyles
         });
+        const potentialHosts = new Set();
         additions.forEach((n) => {
+            if (n.parentElement) {
+                potentialHosts.add(n.parentElement);
+            }
+            if (n.previousElementSibling) {
+                potentialHosts.add(n.previousElementSibling);
+            }
             deepObserve(n);
             collectUndefinedElements(n);
         });
+        potentialHosts.forEach((el) => {
+            if (el.shadowRoot && !observedRoots.has(el)) {
+                subscribeForShadowRootChanges(el);
+                deepObserve(el.shadowRoot);
+            }
+        });
         additions.forEach(
             (node) => isCustomElement(node) && recordUndefinedElement(node)
         );
@@ -7237,6 +7307,14 @@ function watchForStylePositions(currentStyles, update, shadowRootDiscovered) {
     });
     document.addEventListener("__darkreader__isDefined", handleIsDefined);
     collectUndefinedElements(document);
+    addDOMReadyListener(() => {
+        forEach(document.body.children, (el) => {
+            if (el.shadowRoot && !observedRoots.has(el)) {
+                subscribeForShadowRootChanges(el);
+                deepObserve(el.shadowRoot);
+            }
+        });
+    });
 }
 function resetObservers() {
     observers.forEach((o) => o.disconnect());

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "darkreader",
-  "version": "4.9.118",
+  "version": "4.9.119",
   "description": "Dark mode for every website",
   "scripts": {
     "api": "node --max-old-space-size=3072 tasks/cli.js build --api",
@@ -41,7 +41,7 @@
   "type": "module",
   "repository": {
     "type": "git",
-    "url": "https://github.com/darkreader/darkreader.git"
+    "url": "git+https://github.com/darkreader/darkreader.git"
   },
   "author": "Alexander Shutau <darkreaderapp@gmail.com> (https://darkreader.org/)",
   "license": "MIT",
@@ -67,26 +67,26 @@
   },
   "devDependencies": {
     "@eslint/compat": "2.0.0",
-    "@eslint/eslintrc": "3.3.1",
-    "@eslint/js": "9.39.1",
+    "@eslint/eslintrc": "3.3.3",
+    "@eslint/js": "9.39.2",
     "@rollup/plugin-node-resolve": "16.0.3",
     "@rollup/plugin-replace": "6.0.3",
     "@rollup/plugin-typescript": "12.3.0",
     "@stylistic/eslint-plugin": "5.6.1",
-    "@types/chrome": "0.1.31",
+    "@types/chrome": "0.1.32",
     "@types/eslint": "9.6.1",
     "@types/jasmine": "5.1.13",
     "@types/jest": "30.0.0",
     "@types/karma": "6.3.9",
     "@types/karma-coverage": "2.0.3",
-    "@types/node": "24.10.1",
+    "@types/node": "25.0.3",
     "@types/ws": "8.18.1",
-    "chokidar": "4.0.3",
+    "chokidar": "5.0.0",
     "eslint-plugin-compat": "6.0.2",
     "eslint-plugin-import": "2.32.0",
-    "globals": "16.5.0",
-    "globby": "16.0.0",
-    "jasmine-core": "5.12.1",
+    "globals": "17.0.0",
+    "globby": "16.1.0",
+    "jasmine-core": "5.13.0",
     "jest": "30.2.0",
     "jest-extended": "7.0.0",
     "karma": "6.4.4",
@@ -97,20 +97,20 @@
     "karma-rollup-preprocessor": "7.0.8",
     "karma-safari-launcher": "1.0.0",
     "karma-spec-reporter": "0.0.36",
-    "less": "4.4.2",
-    "prettier": "3.6.2",
-    "puppeteer-core": "24.30.0",
-    "rollup": "4.53.3",
+    "less": "4.5.1",
+    "prettier": "3.7.4",
+    "puppeteer-core": "24.34.0",
+    "rollup": "4.55.1",
     "rollup-plugin-istanbul": "5.0.0",
-    "ts-jest": "29.4.5",
+    "ts-jest": "29.4.6",
     "tslib": "2.8.1",
     "typescript": "5.9.3",
-    "typescript-eslint": "8.47.0",
+    "typescript-eslint": "8.51.0",
     "ws": "8.18.3",
     "yazl": "3.3.1"
   },
   "optionalDependencies": {
-    "@rollup/rollup-linux-x64-gnu": "4.53.3",
-    "@rollup/rollup-win32-x64-msvc": "4.53.3"
+    "@rollup/rollup-linux-x64-gnu": "4.55.1",
+    "@rollup/rollup-win32-x64-msvc": "4.55.1"
   }
 }