From c84762c259e8df183a6fd13927928d74c9ea2459 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Juan=20Jose=CC=81=20Vi=CC=81lchez?=
 <wanhose.development@gmail.com>
Date: Wed, 27 Jan 2021 21:53:57 +0100
Subject: [PATCH] fix(content): use local storage instead of sync storage and
 performance improvements

---
 src/scripts/content.js | 110 ++++++++++++++++++++++++++---------------
 1 file changed, 70 insertions(+), 40 deletions(-)

diff --git a/src/scripts/content.js b/src/scripts/content.js
index 1975c1f..87f2a2e 100644
--- a/src/scripts/content.js
+++ b/src/scripts/content.js
@@ -1,31 +1,38 @@
 if (!!window.chrome) {
+  let attempts = 0;
+  const filtersUrl = chrome.runtime.getURL("filters/index.txt");
+  const options = {
+    attributes: true,
+    childList: true,
+  };
+
   const fix = () => {
     document.body.style = "overflow-y: unset !important;";
   };
 
-  const observe = () => {
-    observer.observe(document.body, {
-      attributes: true,
-      childList: true,
-    });
+  const retrieveElement = (match) => {
+    if (!match.includes("[") && !match.includes(">")) {
+      if (match[0] === ".") {
+        return document.getElementsByClassName(match.slice(1))[0];
+      }
+
+      if (match[0] === "#") {
+        return document.getElementById(match.slice(1));
+      }
+    } else {
+      return document.querySelector(match);
+    }
+
+    return null;
   };
 
-  const observer = new MutationObserver((mutations, observer) => {
-    mutations.forEach(async () => {
-      observer.disconnect();
-      fix();
-      await remove();
-      observe();
-    });
-  });
-
   const removeFromCache = () => {
-    chrome.storage.sync.get([document.location.hostname], (value) => {
+    chrome.storage.local.get([document.location.hostname], (value) => {
       const matches = value[document.location.hostname];
 
       if (matches && !!matches.length) {
         matches.forEach((match) => {
-          const element = document.querySelector(match);
+          const element = retrieveElement(match);
           const tagName = element ? element.tagName.toUpperCase() : "";
 
           if (element && !["BODY", "HTML"].includes(tagName)) {
@@ -37,33 +44,56 @@ if (!!window.chrome) {
     });
   };
 
-  const saveToCache = (value) => {
-    chrome.storage.sync.set({ [document.location.hostname]: value });
-  };
+  const updateCache = (value) => {
+    chrome.storage.local.get([document.location.hostname], (store) => {
+      const matches = store[document.location.hostname];
 
-  const remove = async () => {
-    const filtersUrl = chrome.runtime.getURL("filters/index.txt");
-    const text = await fetch(filtersUrl).then((res) => res.text());
-    const filters = text.split("\n");
-    const matches = [];
-
-    filters.forEach((match) => {
-      const element = document.querySelector(match);
-      const tagName = element ? element.tagName.toUpperCase() : "";
-
-      if (element && !["BODY", "HTML"].includes(tagName)) {
-        matches.push(match);
-        element.remove();
+      if (matches && !!matches.length && !matches.includes(value)) {
+        chrome.storage.local.set({
+          [document.location.hostname]: [...new Set([...matches, value])],
+        });
+      } else {
+        chrome.storage.local.set({
+          [document.location.hostname]: [value],
+        });
       }
     });
-
-    saveToCache(matches);
   };
 
-  (async () => {
-    fix();
-    removeFromCache();
-    await remove();
-    observe();
-  })();
+  const removeFromFilters = async () => {
+    if (attempts < 3) {
+      const text = await fetch(filtersUrl).then((res) => res.text());
+      const filters = text.split("\n");
+
+      filters.forEach((match) => {
+        const element = retrieveElement(match);
+        const tagName = element ? element.tagName.toUpperCase() : "";
+
+        if (element && !["BODY", "HTML"].includes(tagName)) {
+          updateCache(match);
+          element.remove();
+        }
+      });
+    }
+  };
+
+  const observer = new MutationObserver((mutations, observer) => {
+    mutations.forEach(() => {
+      observer.disconnect();
+      fix();
+      removeFromCache();
+      removeFromFilters();
+      attempts += 1;
+      observer.observe(document.body, options);
+    });
+  });
+
+  const observe = () => {
+    observer.observe(document.body, options);
+  };
+
+  fix();
+  removeFromCache();
+  removeFromFilters();
+  observe();
 }