Apply DNR rules

chrmod · chrmod · commit cdca9741f0b4 · 2024-03-20T18:12:34.000+01:00
diff --git a/extension-manifest-v3/src/background/dnr.js b/extension-manifest-v3/src/background/dnr.js
@@ -10,6 +10,28 @@
  */
 
 import { observe, ENGINES } from '/store/options.js';
+import { setDNRRules } from '/utils/custom-filters.js';
+
+async function updateDNRRules(dnrRules) {
+  const dynamicRules = await chrome.declarativeNetRequest.getDynamicRules();
+
+  await chrome.declarativeNetRequest.updateDynamicRules({
+    removeRuleIds: dynamicRules
+      // ids between 1 and 2 million are reserved for dynamic rules
+      .filter(({ id }) => id >= 1000000 && id < 2000000)
+      .map(({ id }) => id),
+  });
+
+  const addRules = dnrRules.map((rule, index) => ({
+    ...rule,
+    id: 1000000 + index,
+  }));
+  await chrome.declarativeNetRequest.updateDynamicRules({ addRules });
+
+  await setDNRRules(dnrRules);
+
+  return dnrRules;
+}
 
 if (__PLATFORM__ !== 'firefox') {
   const DNR_RESOURCES = chrome.runtime
@@ -110,8 +132,15 @@ if (__PLATFORM__ !== 'firefox') {
       });
     } else if (dynamicRules.length) {
       chrome.declarativeNetRequest.updateDynamicRules({
-        removeRuleIds: dynamicRules.map(({ id }) => id),
+        removeRuleIds: __PLATFORM__ === 'safari' ? [1] : [1, 2],
       });
     }
   });
+
+  chrome.runtime.onMessage.addListener((msg, _, sendResponse) => {
+    if (msg.action === 'custom-filters:update-dnr') {
+      updateDNRRules(msg.dnrRules).then(sendResponse);
+      return true;
+    }
+  });
 }
diff --git a/extension-manifest-v3/src/pages/settings/components/custom-filters.js b/extension-manifest-v3/src/pages/settings/components/custom-filters.js
@@ -12,15 +12,39 @@
 import { html, store } from 'hybrids';
 import { detectFilterType } from '@cliqz/adblocker';
 import convert from '../dnr-converter.js';
+import { getDNRRules } from '/utils/custom-filters.js';
 import CustomFiltersInput from '../store/custom-filters-input.js';
 
+function parseFilters(text = '') {
+  return text
+    .split('\n')
+    .map((f) => f.trim())
+    .filter(Boolean)
+    .reduce(
+      (filters, filter) => {
+        const filterType = detectFilterType(filter);
+        if (filterType === 1) {
+          // NETWORK
+          filters.networkFilters.push(filter);
+        } else if (filterType === 2) {
+          // COSMETIC
+          filters.cosmeticFilters.push(filter);
+        } else {
+          filters.errors.push(`Filter not supported: '${filter}'`);
+        }
+        return filters;
+      },
+      {
+        networkFilters: [],
+        cosmeticFilters: [],
+        errors: [],
+      },
+    );
+}
+
 async function onSave(host) {
   const { networkFilters, cosmeticFilters } = host.filters;
-  const output = {
-    networkFilters,
-    cosmeticFilters,
-    dnrRules: [],
-  };
+  const dnrRules = [];
   const dnrErrors = [];
 
   const results = await Promise.allSettled(
@@ -29,92 +53,34 @@ async function onSave(host) {
 
   for (const result of results) {
     dnrErrors.push(...result.value.errors);
-    output.dnrRules.push(...result.value.rules);
+    dnrRules.push(...result.value.rules);
   }
 
   host.dnrErrors = dnrErrors;
 
   if (!dnrErrors.length) {
     store.submit(host.input);
-    host.output = output;
+    host.dnrRules = await chrome.runtime.sendMessage({
+      action: 'custom-filters:update-dnr',
+      dnrRules,
+    });
   }
 }
 
 export default {
   input: store(CustomFiltersInput, { draft: true }),
-  output: {
-    get: async () => {
-      const {
-        networkFilters = [],
-        cosmeticFilters = [],
-        dnrRules = [],
-      } = (await chrome.storage.local.get(['custom-filters-output']))[
-        'custom-filters-output'
-      ] || {};
-
-      return {
-        networkFilters,
-        cosmeticFilters,
-        dnrRules,
-      };
+  dnrRules: {
+    value: undefined,
+    connect: (host, key) => {
+      getDNRRules().then((dnrRules) => {
+        host[key] = dnrRules;
+      });
     },
-    set: async (
-      _,
-      { networkFilters = [], cosmeticFilters = [], dnrRules = [] } = {},
-      lastValue,
-    ) => {
-      if (lastValue) {
-        await chrome.storage.local.set({
-          'custom-filters-output': {
-            networkFilters,
-            cosmeticFilters,
-            dnrRules,
-          },
-        });
-      }
-      return {
-        networkFilters,
-        cosmeticFilters,
-        dnrRules,
-      };
-    },
-  },
-  dnrErrors: { set: (_, values = []) => values },
-  filters: (host) => {
-    const networkFilters = [];
-    const cosmeticFilters = [];
-    const errors = [];
-
-    let filters = [];
-
-    if (store.ready(host.input)) {
-      filters = host.input.text
-        .split('\n')
-        .map((f) => f.trim())
-        .filter(Boolean);
-    }
-
-    for (const filter of filters) {
-      const filterType = detectFilterType(filter);
-      switch (filterType) {
-        case 1: // NETWORK
-          networkFilters.push(filter);
-          break;
-        case 2: // COSMETIC
-          cosmeticFilters.push(filter);
-          break;
-        default:
-          errors.push(`Filter not supported: '${filter}'`);
-      }
-    }
-
-    return {
-      networkFilters,
-      cosmeticFilters,
-      errors,
-    };
   },
-  content: ({ input, filters, output, dnrErrors }) => html`
+  filters: ({ input }) => parseFilters(store.ready(input) ? input.text : ''),
+  dnrErrors: undefined,
+  errors: ({ filters, dnrErrors = [] }) => [...filters.errors, ...dnrErrors],
+  content: ({ input, filters, dnrRules, errors }) => html`
     <template layout="column gap:3">
       ${store.ready(input) &&
       html`
@@ -125,8 +91,8 @@ ${input.text}</textarea
       <div layout="row gap items:center">
         <ui-button
           size="small"
-          type=${filters.errors.length > 0 ? 'outline-error' : 'outline'}
-          disabled=${filters.errors.length > 0 || dnrErrors.length > 0}
+          type=${errors.length > 0 ? 'outline-error' : 'outline'}
+          disabled=${errors.length > 0}
           onclick="${onSave}"
           layout="shrink:0"
         >
@@ -136,7 +102,7 @@ ${input.text}</textarea
       <section layout="gap items:center">
         <h4>Errors</h4>
         <ul>
-          ${[...filters.errors, ...dnrErrors].map(
+          ${errors.map(
             (error) =>
               html`<li>
                 <ui-text color="danger-500">${error}</ui-text>
@@ -147,22 +113,16 @@ ${input.text}</textarea
         <div>Network filters: ${filters.networkFilters.length}</div>
         <div>Cosmetic filters: ${filters.cosmeticFilters.length}</div>
         <div>Filter errors: ${filters.errors.length}</div>
-        ${html.resolve(
-          output.then(
-            ({ networkFilters, cosmeticFilters, dnrRules }) =>
-              html`
-                <h4>Output</h4>
-                <div>Network filters: ${networkFilters.length}</div>
-                <div>Cosmetic filters: ${cosmeticFilters.length}</div>
-                <div>DNR rules: ${dnrRules.length}</div>
-                <ul>
-                  ${dnrRules.map(
-                    (rule) => html`<li>${JSON.stringify(rule, null, 2)}</li>`,
-                  )}
-                </ul>
-              `,
-          ),
-        )}
+        ${dnrRules &&
+        html`
+          <h4>Output</h4>
+          <div>DNR rules: ${dnrRules.length}</div>
+          <ul>
+            ${dnrRules.map(
+              (rule) => html`<li>${JSON.stringify(rule, null, 2)}</li>`,
+            )}
+          </ul>
+        `},
       </section>
     </template>
   `,
diff --git a/extension-manifest-v3/src/utils/custom-filters.js b/extension-manifest-v3/src/utils/custom-filters.js
@@ -0,0 +1,52 @@
+/**
+ * Ghostery Browser Extension
+ * https://www.ghostery.com/
+ *
+ * Copyright 2017-present Ghostery GmbH. All rights reserved.
+ *
+ * This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0
+ */
+
+const KEY_DNR_RULES = 'custom-filters-dnr';
+const KEY_NETWORK_FILTERS = 'custom-filters-network';
+const KEY_COSMETIC_FILTERS = 'custom-filters-cosmetic';
+
+export async function getDNRRules() {
+  return (await chrome.storage.local.get([KEY_DNR_RULES]))[KEY_DNR_RULES] || [];
+}
+
+export async function setDNRRules(filters = []) {
+  await chrome.storage.local.set({
+    [KEY_DNR_RULES]: filters,
+  });
+}
+
+export async function getNetworkFilters() {
+  return (
+    (await chrome.storage.local.get([KEY_NETWORK_FILTERS]))[
+      KEY_NETWORK_FILTERS
+    ] || []
+  );
+}
+
+export async function setNetworkFilters(filters = []) {
+  await chrome.storage.local.set({
+    [KEY_NETWORK_FILTERS]: filters,
+  });
+}
+
+export async function getCosmeticFilters() {
+  return (
+    (await chrome.storage.local.get([KEY_COSMETIC_FILTERS]))[
+      KEY_COSMETIC_FILTERS
+    ] || []
+  );
+}
+
+export async function setCosmeticFilters(filters = []) {
+  await chrome.storage.local.set({
+    [KEY_COSMETIC_FILTERS]: filters,
+  });
+}
