Fixed bugs with hiding body before blur processing.

src/background.ts

@@ -1,7 +1,11 @@
 import { MODES } from "./constants"
 
+const cssToInject = "body { visibility: hidden; }"
+
 let currentModeIndex = 1
 
+console.debug("OpenBlur service worker script loaded")
+
 function startUp() {
     chrome.storage.sync.get("mode", (data) => {
         if (data.mode) {
@@ -15,3 +19,40 @@ function startUp() {
 // Ensure the background script always runs.
 chrome.runtime.onStartup.addListener(startUp)
 chrome.runtime.onInstalled.addListener(startUp)
+
+// Hide the body content until OpenBlur processes the content and blurs the secrets.
+chrome.webNavigation.onCommitted.addListener(
+    function(details) {
+        if (MODES[currentModeIndex].id === "on") {
+            let target: chrome.scripting.InjectionTarget = {
+                tabId: details.tabId,
+                frameIds: [details.frameId],
+            }
+            void chrome.scripting.insertCSS({
+                css: cssToInject,
+                target: target,
+            })
+        }
+    }
+)
+
+// Unhide the body content.
+chrome.runtime.onMessage.addListener(
+    function(request, sender, _sendResponse) {
+        if (sender.tab && request.action === "unhideBody") {
+            let target: chrome.scripting.InjectionTarget = {
+                tabId: sender.tab.id!,
+            }
+            if (sender.frameId !== undefined) {
+                target.frameIds = [sender.frameId]
+            }
+            void chrome.scripting.removeCSS({
+                css: cssToInject,
+                target: target,
+            })
+        }
+        if (request.mode) {
+            currentModeIndex = request.mode.index
+        }
+    }
+)

src/content.ts

@@ -1,15 +1,19 @@
 import { NUMBER_OF_ITEMS} from "./constants"
 
 const blurFilter = "blur(0.343em)" // This unique filter value identifies the OpenBlur filter.
-const tagsNotToBlur = ["SCRIPT", "STYLE"]
+const tagsNotToBlur = ["SCRIPT", "STYLE", "loc"]
 
 let contentToBlur: string[] = []
 let enabled = true
+let bodyHidden = true
 
 console.debug("OpenBlur content script loaded")
 
 function unhideBody() {
-    document.body.style.visibility = "visible"
+    if (bodyHidden) {
+        void chrome.runtime.sendMessage({action: "unhideBody"})
+        bodyHidden = false
+    }
 }
 
 function processNode(node: Node) {
@@ -18,7 +22,7 @@ function processNode(node: Node) {
     }
     if (node.nodeType === Node.TEXT_NODE && node.textContent !== null && node.textContent.trim().length > 0) {
         const parent = node.parentElement
-        if (parent !== null) {
+        if (parent !== null && parent.style) {
             if (tagsNotToBlur.includes(parent.tagName)) {
                 return
             } else if (parent.style.filter.includes(blurFilter)) {
@@ -29,16 +33,16 @@ function processNode(node: Node) {
                 }
                 return
             }
-        }
-        const text = node.textContent!
-        if (enabled) {
-            contentToBlur.some((content) => {
-                if (text.includes(content)) {
-                    blurElement(parent!)
-                    return true
-                }
-                return false
-            })
+            const text = node.textContent!
+            if (enabled) {
+                contentToBlur.some((content) => {
+                    if (text.includes(content)) {
+                        blurElement(parent!)
+                        return true
+                    }
+                    return false
+                })
+            }
         }
     }
 }

static/manifest.json

@@ -7,16 +7,12 @@
     "default_popup": "popup.html"
   },
   "permissions": [
-    "storage"
+    "scripting",
+    "storage",
+    "webNavigation"
   ],
+  "host_permissions": ["<all_urls>"],
   "content_scripts": [
-    {
-      "matches": ["<all_urls>"],
-      "all_frames": true,
-      "match_origin_as_fallback": true,
-      "css": ["content-start.css"],
-      "run_at": "document_start"
-    },
     {
       "matches": ["<all_urls>"],
       "all_frames": true,