src/javascript/enhancements/fontColor.js

@@ -8,29 +8,44 @@ const BADGE_CLASS = 'label';
 export function init() {
     getGlobalConfiguration().getProperty(SETTINGS_websiteOptimizeFontColors, value => {
         if (value) {
-            core.registerScript(node => {
+            core.runAfterLoad(() => {
-                console.log(node);
+                checkRunColorOptimization(document.documentElement);
-                // run the scripts
+            }, ".*");
-                if (helper.isHtmlElement(node)) {
 
-                    if (node.classList.contains(BADGE_CLASS)) {
+            core.runAfterLocationChange(() => {
-                        optimizeFontColorsBadges(node);
+                checkRunColorOptimization(document.documentElement);
-                    }
+            }, ".*");
-                    else {
+
-                        node.querySelectorAll(`.${BADGE_CLASS}`).forEach(element => {
+            core.registerScript(node => {
-                            optimizeFontColorsBadges(element);
+                checkRunColorOptimization(node);
-                        });
-                    }
-                }
             }, ".*");
         }
     });
 }
 
-function optimizeFontColorsBadges(badge) {
+function checkRunColorOptimization(node) {
-    let color = window.getComputedStyle(badge, null).getPropertyValue('background-color');
+    console.log(node);
-    let c = new Color(color)
+
-    if (c.isLight()) {
+    // run the scripts
-        badge.classList.add('awp-fontColor-dark')
+    if (helper.isHtmlElement(node)) {
+        if (node.classList.contains(BADGE_CLASS)) {
+            optimizeFontColorsBadges(node);
+        }
+        else {
+            node.querySelectorAll(`.${BADGE_CLASS}`).forEach(element => {
+                optimizeFontColorsBadges(element);
+            });
+        }
+    }
+}
+
+function optimizeFontColorsBadges(badge) {
+    let colorStr = window.getComputedStyle(badge, null).getPropertyValue('background-color');
+
+    if (colorStr.length > 0) { // some elements do not have a computed background color
+        let color = new Color(colorStr)
+        if (color.isLight()) {
+            badge.classList.add('awp-fontColor-dark')
+        }
     }
 }