@duckduckgo/autoconsent 1.0.5 → 1.0.6

package/lib/web/content.ts

@@ -1,9 +1,8 @@
 import { matches, executeAction } from "./consentomatic/index";
 import { ContentScriptMessage } from "../messages";
+import { hideElementsUtil, getStyleElementUtil } from "./content-utils";
 
 let actionQueue = Promise.resolve(null);
-const styleOverrideElementId = "autoconsent-css-rules";
-const styleSelector = `style#${styleOverrideElementId}`;
 
 export default function handleMessage(message: ContentScriptMessage, debug = false) {
   if (message.type === "click") {
@@ -25,8 +24,9 @@ export default function handleMessage(message: ContentScriptMessage, debug = fal
     const elem = document.querySelectorAll<HTMLElement>(message.selector);
     const results = new Array(elem.length);
     elem.forEach((e, i) => {
-      results[i] = e.offsetParent !== null || window.getComputedStyle(e).display !== "none" || e.style?.display !== "none";
+      results[i] = e.offsetParent !== null || window.getComputedStyle(e).display !== "none"; // TODO: handle visibility and z-index?
     });
+    debug && console.log("[visible?]", message.selector, elem, results);
     if (results.length === 0) {
       return false;
     } else if (message.check === "any") {
@@ -38,35 +38,21 @@ export default function handleMessage(message: ContentScriptMessage, debug = fal
     return results.every(r => r);
   } else if (message.type === "getAttribute") {
     const elem = document.querySelector(message.selector);
+    debug && console.log("[getAttribute]", message.selector, elem);
     if (!elem) {
       return false;
     }
     return elem.getAttribute(message.attribute);
   } else if (message.type === "eval") {
     // TODO: chrome support
+    debug && console.log("about to [eval]", message.script); // this will not show in Webkit console
     const result = window.eval(message.script); // eslint-disable-line no-eval
-    debug && console.log("[eval]", message.script, result);
     return result;
   } else if (message.type === "hide") {
-    const parent =
-      document.head ||
-      document.getElementsByTagName("head")[0] ||
-      document.documentElement;
-    const rule = `${message.selectors.join(",")} { display: none !important; z-index: -1 !important; } `;
-    const existingElement = document.querySelector(styleSelector);
-    debug && console.log("[hide]", message.selectors, !!existingElement);
-    if (existingElement && existingElement instanceof HTMLStyleElement) {
-      existingElement.innerText += rule;
-    } else {
-      const css = document.createElement("style");
-      css.type = "text/css";
-      css.id = styleOverrideElementId;
-      css.appendChild(document.createTextNode(rule));
-      parent.appendChild(css);
-    }
-    return message.selectors.length > 0;
+    debug && console.log("[hide]", message.selectors);
+    return hideElementsUtil(message.selectors, message.method);
   } else if (message.type === "undohide") {
-    const existingElement = document.querySelector(styleSelector);
+    const existingElement = getStyleElementUtil();
     debug && console.log("[unhide]", !!existingElement);
     if (existingElement) {
       existingElement.remove();
@@ -74,8 +60,10 @@ export default function handleMessage(message: ContentScriptMessage, debug = fal
     return !!existingElement
   } else if (message.type === "matches") {
     const matched = matches(message.config);
+    debug && console.log("[matches?]", message.config.type, JSON.stringify(message.config), matched);
     return matched;
   } else if (message.type === "executeAction") {
+    debug && console.log("[executeAction]", message);
     actionQueue = actionQueue.then(() => executeAction(message.config, message.param));
     return true;
   }

package/lib/web/tab.js

@@ -1,4 +1,5 @@
 import { waitFor } from "../cmps/base";
+import { enableLogs } from "../config";
 export default class TabActions {
     constructor(tabId, frame, sendContentMessage, browser) {
         this.frame = frame;
@@ -7,7 +8,6 @@ export default class TabActions {
         this.id = tabId;
     }
     async elementExists(selector, frameId = 0) {
-        console.log(`check for  ${selector} in tab ${this.id}, frame ${frameId}`);
         return this.sendContentMessage(this.id, {
             type: "elemExists",
             selector
@@ -16,7 +16,7 @@ export default class TabActions {
         });
     }
     async clickElement(selector, frameId = 0) {
-        console.log(`click element ${selector} in tab ${this.id}`);
+        enableLogs && console.log(`click element ${selector} in tab ${this.id}`);
         return this.sendContentMessage(this.id, {
             type: "click",
             selector
@@ -25,7 +25,7 @@ export default class TabActions {
         });
     }
     async clickElements(selector, frameId = 0) {
-        console.log(`click elements ${selector} in tab ${this.id}`);
+        enableLogs && console.log(`click elements ${selector} in tab ${this.id}`);
         return this.sendContentMessage(this.id, {
             type: "click",
             all: true,
@@ -68,10 +68,12 @@ export default class TabActions {
         }
         return false;
     }
-    async hideElements(selectors, frameId = 0) {
+    async hideElements(selectors, frameId = 0, method = 'display') {
+        enableLogs && console.log('Sending hide elements to', this.id, selectors);
         return this.sendContentMessage(this.id, {
             type: "hide",
-            selectors
+            selectors,
+            method,
         }, { frameId });
     }
     async undoHideElements(frameId = 0) {
@@ -86,8 +88,12 @@ export default class TabActions {
         return this.browser.tabs.update(this.id, { url });
     }
     wait(ms) {
+        enableLogs && console.log(`waiting for ${ms}ms in tab ${this.id}`);
         return new Promise(resolve => {
-            setTimeout(() => resolve(true), ms);
+            setTimeout(() => {
+                enableLogs && console.log(`done waiting in tab ${this.id}`);
+                resolve(true);
+            }, ms);
         });
     }
     matches(matcherConfig) {

package/lib/web/tab.ts

@@ -1,4 +1,6 @@
 import { waitFor } from "../cmps/base";
+import { enableLogs } from "../config";
+import { HideMethod } from "../messages";
 import { TabActor, MessageSender, Browser } from "../types";
 
 export default class TabActions implements TabActor {
@@ -14,7 +16,6 @@ export default class TabActions implements TabActor {
   }
 
   async elementExists(selector: string, frameId = 0) {
-    console.log(`check for  ${selector} in tab ${this.id}, frame ${frameId}`);
     return this.sendContentMessage(
       this.id,
       {
@@ -28,7 +29,7 @@ export default class TabActions implements TabActor {
   }
 
   async clickElement(selector: string, frameId = 0) {
-    console.log(`click element ${selector} in tab ${this.id}`);
+    enableLogs && console.log(`click element ${selector} in tab ${this.id}`);
     return this.sendContentMessage(
       this.id,
       {
@@ -42,7 +43,7 @@ export default class TabActions implements TabActor {
   }
 
   async clickElements(selector: string, frameId = 0) {
-    console.log(`click elements ${selector} in tab ${this.id}`);
+    enableLogs && console.log(`click elements ${selector} in tab ${this.id}`);
     return this.sendContentMessage(
       this.id,
       {
@@ -111,12 +112,14 @@ export default class TabActions implements TabActor {
     return false;
   }
 
-  async hideElements(selectors: string[], frameId = 0) {
+  async hideElements(selectors: string[], frameId = 0, method: HideMethod = 'display') {
+    enableLogs && console.log('Sending hide elements to', this.id, selectors);
     return this.sendContentMessage(
       this.id,
       {
         type: "hide",
-        selectors
+        selectors,
+        method,
       },
       { frameId }
     );
@@ -141,8 +144,12 @@ export default class TabActions implements TabActor {
   }
 
   wait(ms: number): Promise<true> {
+    enableLogs && console.log(`waiting for ${ms}ms in tab ${this.id}`);
     return new Promise(resolve => {
-      setTimeout(() => resolve(true), ms);
+      setTimeout(() => {
+        enableLogs && console.log(`done waiting in tab ${this.id}`);
+        resolve(true);
+      }, ms);
     });
   }
 

package/lib/web.js

@@ -5,6 +5,7 @@ import detectDialog from './detector';
 import { rules, createAutoCMP } from './index';
 import { ConsentOMaticCMP } from './consentomatic/index';
 import prehideElements from './hider';
+import { enableLogs } from './config';
 export * from './index';
 export { Tab, handleContentMessage, };
 export default class AutoConsent {
@@ -29,6 +30,7 @@ export default class AutoConsent {
         return new Tab(tabId, this.consentFrames.get(tabId), this.sendContentMessage, this.browser);
     }
     async checkTab(tabId, prehide = true) {
+        enableLogs && console.log('checking tab', tabId, this.consentFrames, this.tabCmps);
         const tab = this.createTab(tabId);
         if (prehide) {
             this.prehideElements(tab);
@@ -39,12 +41,15 @@ export default class AutoConsent {
         consent.checked.then((rule) => {
             if (this.consentFrames.has(tabId) && rule) {
                 const frame = this.consentFrames.get(tabId);
+                enableLogs && console.log(`Found ${rule.name} in a nested iframe ${frame.id} inside tab ${tabId}`);
                 if (frame.type === rule.name) {
                     consent.tab.frame = frame;
                 }
             }
+            enableLogs && console.log('finished checking tab', tabId, this.consentFrames, this.tabCmps);
             // no CMP detected, undo hiding
             if (!rule && prehide) {
+                enableLogs && console.log('no CMP detected, undo hiding');
                 tab.undoHideElements();
             }
         });

package/lib/web.ts

@@ -7,6 +7,7 @@ import { Browser, MessageSender, AutoCMP, TabActor } from './types';
 import { ConsentOMaticCMP, ConsentOMaticConfig } from './consentomatic/index';
 import { AutoConsentCMPRule } from './rules';
 import prehideElements from './hider';
+import { enableLogs } from './config';
 
 export * from './index';
 export {
@@ -44,6 +45,7 @@ export default class AutoConsent {
   }
 
   async checkTab(tabId: number, prehide = true) {
+    enableLogs && console.log('checking tab', tabId, this.consentFrames, this.tabCmps);
     const tab = this.createTab(tabId);
     if (prehide) {
       this.prehideElements(tab);
@@ -54,12 +56,15 @@ export default class AutoConsent {
     consent.checked.then((rule) => {
       if (this.consentFrames.has(tabId) && rule) {
         const frame = this.consentFrames.get(tabId);
+        enableLogs && console.log(`Found ${rule.name} in a nested iframe ${frame.id} inside tab ${tabId}`);
         if (frame.type === rule.name) {
           consent.tab.frame = frame;
         }
       }
+      enableLogs && console.log('finished checking tab', tabId, this.consentFrames, this.tabCmps);
       // no CMP detected, undo hiding
       if (!rule && prehide) {
+        enableLogs && console.log('no CMP detected, undo hiding');
         tab.undoHideElements();
       }
     });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@duckduckgo/autoconsent",
-  "version": "1.0.5",
+  "version": "1.0.6",
   "description": "",
   "main": "dist/autoconsent.cjs.js",
   "module": "dist/autoconsent.esm.js",

package/readme.md

@@ -84,7 +84,7 @@ Returns true if an element returned from `document.querySelect(selector)` is cur
   "eval": "code"
 }
 ```
-Evaluates `code` in the context of the page and returns the truthiness of the result.
+Evaluates `code` in the context of the page. NB: the result of this action depends on the truthiness of the evaluated expression, make sure it returns `true` in case of success.
 
 #### Wait for element
 

package/rules/autoconsent/etsy.json

@@ -0,0 +1,13 @@
+{
+    "name": "etsy",
+    "detectCmp": [{ "exists": "#gdpr-single-choice-overlay" }],
+    "detectPopup": [{ "visible": "#gdpr-single-choice-overlay" }],
+    "optOut": [
+        {"hide": ["#gdpr-single-choice-overlay", "#gdpr-privacy-settings"]},
+        {"click": "button[data-gdpr-open-full-settings]"},
+        {"wait": 500},
+        {"eval": "document.querySelectorAll('.gdpr-overlay-body input').forEach(toggle => { toggle.checked = false; }) || true"},
+        {"eval": "document.querySelector('.gdpr-overlay-view button[data-wt-overlay-close]').click() || true"}
+    ],
+    "optIn": [{"click": "button[data-gdpr-single-choice-accept]"}]
+}

package/rules/rules.json

@@ -392,6 +392,44 @@
         }
       ]
     },
+    {
+      "name": "etsy",
+      "detectCmp": [
+        {
+          "exists": "#gdpr-single-choice-overlay"
+        }
+      ],
+      "detectPopup": [
+        {
+          "visible": "#gdpr-single-choice-overlay"
+        }
+      ],
+      "optOut": [
+        {
+          "hide": [
+            "#gdpr-single-choice-overlay",
+            "#gdpr-privacy-settings"
+          ]
+        },
+        {
+          "click": "button[data-gdpr-open-full-settings]"
+        },
+        {
+          "wait": 500
+        },
+        {
+          "eval": "document.querySelectorAll('.gdpr-overlay-body input').forEach(toggle => { toggle.checked = false; }) || true"
+        },
+        {
+          "eval": "document.querySelector('.gdpr-overlay-view button[data-wt-overlay-close]').click() || true"
+        }
+      ],
+      "optIn": [
+        {
+          "click": "button[data-gdpr-single-choice-accept]"
+        }
+      ]
+    },
     {
       "name": "eu-cookie-compliance-banner",
       "isHidingRule": true,
@@ -909,54 +947,6 @@
         }
       ]
     },
-    {
-      "name": "Onetrust",
-      "prehideSelectors": [
-        "#onetrust-banner-sdk,#onetrust-consent-sdk,.optanon-alert-box-wrapper,.onetrust-pc-dark-filter,.js-consent-banner"
-      ],
-      "isHidingRule": true,
-      "detectCmp": [
-        {
-          "exists": "#onetrust-banner-sdk,.optanon-alert-box-wrapper"
-        }
-      ],
-      "detectPopup": [
-        {
-          "visible": "#onetrust-banner-sdk,.optanon-alert-box-wrapper"
-        }
-      ],
-      "optOut": [
-        {
-          "click": "#onetrust-pc-btn-handler,.ot-sdk-show-settings,button.js-cookie-settings"
-        },
-        {
-          "waitFor": "#onetrust-consent-sdk",
-          "timeout": 2000
-        },
-        {
-          "wait": 1000
-        },
-        {
-          "click": "#onetrust-consent-sdk input.category-switch-handler:checked,.js-editor-toggle-state:checked",
-          "all": true,
-          "optional": true
-        },
-        {
-          "waitForThenClick": ".save-preference-btn-handler,.js-consent-save",
-          "timeout": 1000
-        }
-      ],
-      "optIn": [
-        {
-          "click": "onetrust-accept-btn-handler,js-accept-cookies"
-        }
-      ],
-      "test": [
-        {
-          "eval": "window.OnetrustActiveGroups.split(',').filter(s => s.length > 0).length <= 1"
-        }
-      ]
-    },
     {
       "name": "osano",
       "prehideSelectors": [

package/tests/etsy.spec.ts

@@ -0,0 +1,7 @@
+import generateCMPTests from "./runner";
+
+generateCMPTests('etsy', [
+    'https://www.etsy.com/',
+], {
+    skipRegions: ["US"],
+});

package/tests/onetrust.spec.ts

@@ -12,3 +12,9 @@ generateCMPTests('Onetrust', [
 ], {
     skipRegions: ['US', 'GB']
 });
+
+generateCMPTests('Onetrust', [
+    "https://www.newyorker.com/",
+], {
+    skipRegions: ['US']
+});

package/tests/runner.ts

@@ -39,7 +39,7 @@ export function generateTest(url: string, expectedCmp: string, options: TestOpti
         }
         await page.goto(url, { waitUntil: 'commit' });
 
-        const tab = autoconsent.attachToPage(page, url, rules, 20);
+        const tab = autoconsent.attachToPage(page, url, rules, 20, true);
         await tab.checked;
         expect(tab.getCMPName()).toBe(expectedCmp);
         expect(await tab.isPopupOpen(50, 100)).toBeTruthy();

package/rules/autoconsent/onetrust.json

@@ -1,24 +0,0 @@
-{
-  "name": "Onetrust",
-  "prehideSelectors": ["#onetrust-banner-sdk,#onetrust-consent-sdk,.optanon-alert-box-wrapper,.onetrust-pc-dark-filter,.js-consent-banner"],
-  "isHidingRule": true,
-  "detectCmp": [{ "exists": "#onetrust-banner-sdk,.optanon-alert-box-wrapper" }],
-  "detectPopup": [{ "visible": "#onetrust-banner-sdk,.optanon-alert-box-wrapper" }],
-  "optOut": [
-    { "click": "#onetrust-pc-btn-handler,.ot-sdk-show-settings,button.js-cookie-settings" },
-    { "waitFor": "#onetrust-consent-sdk", "timeout": 2000 },
-    { "wait": 1000 },
-    {
-      "click": "#onetrust-consent-sdk input.category-switch-handler:checked,.js-editor-toggle-state:checked",
-      "all": true,
-      "optional": true
-    },
-    { "waitForThenClick": ".save-preference-btn-handler,.js-consent-save", "timeout": 1000 }
-  ],
-  "optIn": [{ "click": "onetrust-accept-btn-handler,js-accept-cookies" }],
-  "test": [
-    {
-      "eval": "window.OnetrustActiveGroups.split(',').filter(s => s.length > 0).length <= 1"
-    }
-  ]
-}