Merge pull request #734 from wanhose/v7.1.0

7.1.0

.commitlintrc

@@ -17,7 +17,7 @@
       [
         "api",
         "browser-extension",
-        "data",
+        "database",
         "docs",
         "packages",
         "web"

data/common-words.json

@@ -1,15 +0,0 @@
-[
-  "banner",
-  "cc",
-  "cmp",
-  "compliance",
-  "consent",
-  "cookie",
-  "dialog",
-  "disclaimer",
-  "gdpr",
-  "law",
-  "policy",
-  "popup",
-  "privacy"
-]

data/fixes.txt

@@ -1,59 +0,0 @@
-action.com###CybotCookiebotDialogBodyLevelButtonLevelOptinDeclineAll##click
-amazon.de###sp-cc-rejectall-link##click
-automobielmanagement.nl##body > *##resetAll##filter
-bilbaomuseoa.eus##.alert_message .btn-confirm##click
-breitbart.com##.twitter-tweet##resetAll##display
-breitbart.com##.twitter-tweet##resetAll##visibility
-buscotelefonosgratis.es###cookie_action_close_header_reject##click
-chollometro.com##[data-t="continueWithoutAccepting"]##click
-classicube.net###acceptcookies##click
-compact-online.de##[id*="bnnr-body-rightSide-"] div + div > span##click
-consent.google##[aria-label="Reject all"]##click
-consent.yahoo##.reject-all##click
-consent.youtube##[aria-label="Reject all"]##click
-dailymotion.com##[class*="TCF2Popup__containerButtons"] > button:nth-child(2)##click
-dealabs.com##[data-t="continueWithoutAccepting"]##click
-fiberplane.dev##button[aria-label="Close Banner"]##click
-foto-erhardt.de##[class="modal show"]##click
-gamestar.de###content##reset##filter
-gettr.com##button.bold##click
-gmx.com###onetrust-accept-btn-handler##click
-gmx.net##[data-section="accept"]##click
-golem.de##[title="Zustimmen und weiter"]##click
-google##[aria-label*="Google"][role="dialog"] button:not([aria-label]):not([tabindex]):first-child##click
-google##[aria-label="Alle ablehnen"]##click
-google##[aria-label="Odrzuć wszystko"]##click
-google##[aria-label="Rechazar todo"]##click
-google##[aria-label="Recusar tudo"]##click
-google##[aria-label="Reject all"]##click
-google##[aria-label="Rejeitar tudo"]##click
-google##[aria-label="Respinge tot"]##click
-google##[aria-label="Rifiuta tutto"]##click
-google##[aria-label="Tout refuser"]##click
-google##[aria-label="Отклонить все"]##click
-hagglezon.com##[data-test="cookie-submit"]##click
-instagram.com##[role="dialog"] > [style="display: flex; flex-direction: column; height: 100%; max-width: 100%;"] > button##click
-motorolasound.com###cookie-btn-denied##click
-mydealz.de##[data-t="continueWithoutAccepting"]##click
-myprivacy.dpgmedia##.pg-accept-button##click
-play.google##body > div##reset##z-index
-popeyes.es##.cookie-buttons > .cookie-buttons-column > div:last-child##click
-producthunt.com##[data-test="dismiss-CookiePopup"] button##click
-resonanz-labor.de###wrapwrap##reset##overflow
-staylibere.com##[class*="LayoutCookieBanner_buttons"] > button:last-child##click
-twitch.tv##[data-a-target="consent-banner-accept"]##click
-usnews.com###gdpr-modal-agree##click
-web.de###reminder##click
-web.dev##a[href*="cookies"] + button##click
-youtube##[aria-label="Alle ablehnen"]##click
-youtube##[aria-label="Odrzuć wszystko"]##click
-youtube##[aria-label="Rechazar todo"]##click
-youtube##[aria-label="Recusar tudo"]##click
-youtube##[aria-label="Reject all"]##click
-youtube##[aria-label="Rejeitar tudo"]##click
-youtube##[aria-label="Respinge tot"]##click
-youtube##[aria-label="Rifiuta tutto"]##click
-youtube##[aria-label="Tout refuser"]##click
-youtube##[aria-label="Отклонить все"]##click
-zdf.de###aria-dialog-cmp-error-dialog > .dialog-close##click
-zeit.de##[title="ACCEPT AND CONTINUE"]##click

data/skips.json

@@ -1,255 +0,0 @@
-{
-  "domains": [
-    "app.diagrams.net",
-    "blog.sapegin.me",
-    "buyagift.co.uk",
-    "canvasjs.com",
-    "chessmadra.com",
-    "correos.es",
-    "diariodeunlondinense.com",
-    "flickr.com",
-    "godotforums.org",
-    "godotvr.github.io",
-    "google.*",
-    "gudog.com",
-    "iea.org",
-    "jobs.lever.co",
-    "key-shortcut.com",
-    "login.microsoftonline.com",
-    "mantisbt.org",
-    "mossgreen.github.io",
-    "musicmeter.nl",
-    "personio.com",
-    "restaurantguru.com",
-    "retroachievements.org",
-    "seeklogo.com",
-    "shuttledirect.com",
-    "stackage.org",
-    "steamcommunity.com",
-    "substack.com",
-    "sucuri.net",
-    "tesla.com",
-    "visualstudio.com",
-    "xkcd.com",
-    "yandex.ru",
-    "youtube.com"
-  ],
-  "tags": [
-    "A",
-    "ABBR",
-    "ADDRESS",
-    "AREA",
-    "AUDIO",
-    "B",
-    "BADGE-SHAPE",
-    "BASE",
-    "BDI",
-    "BDO",
-    "BLOCKQUOTE",
-    "BODY",
-    "BR",
-    "BUTTON",
-    "CANVAS",
-    "CAPTION",
-    "CIRCLE",
-    "CITE",
-    "CLIPPATH",
-    "CODE",
-    "COL",
-    "COLGROUP",
-    "DATA",
-    "DATALIST",
-    "DD",
-    "DEFS",
-    "DEL",
-    "DETAILS-MENU",
-    "DETAILS",
-    "DEVELOPMENT-MENU",
-    "DFN",
-    "DL",
-    "DOM-IF",
-    "DOM-REPEAT",
-    "DT",
-    "EM",
-    "EMBED",
-    "FIELDSET",
-    "FIGCAPTION",
-    "FIGURE",
-    "G-EMOJI",
-    "G",
-    "H1",
-    "H2",
-    "H3",
-    "H4",
-    "H5",
-    "H6",
-    "HEAD",
-    "HEADER",
-    "HGROUP",
-    "HR",
-    "HTML",
-    "I",
-    "ICON-SHAPE",
-    "IFRAME",
-    "IMG",
-    "INCLUDE-FRAGMENT",
-    "INPUT",
-    "INS",
-    "IRON-A11Y-ANNOUNCER",
-    "IRON-ICONSET-SVG",
-    "IRON-MEDIA-QUERY",
-    "KBD",
-    "LABEL",
-    "LEGEND",
-    "LINEARGRADIENT",
-    "LINK",
-    "MAIN",
-    "MAP",
-    "MARK",
-    "MASK",
-    "MENU",
-    "META",
-    "METER",
-    "NAV",
-    "NOSCRIPT",
-    "OBJECT",
-    "OL",
-    "OPTGROUP",
-    "OPTION",
-    "OUTPUT",
-    "P",
-    "PATH",
-    "PICTURE",
-    "POLYGON",
-    "PRE",
-    "PROGRESS",
-    "Q",
-    "RADIALGRADIENT",
-    "RECT",
-    "RELATIVE-TIME",
-    "RP",
-    "RT",
-    "RUBY",
-    "S",
-    "SAMP",
-    "SCRIPT",
-    "SEARCH",
-    "SELECT",
-    "SLOT",
-    "SMALL",
-    "SOURCE",
-    "SPAN",
-    "STOP",
-    "STRONG",
-    "STYLE",
-    "SUB",
-    "SUMMARY",
-    "SUP",
-    "SVG",
-    "TASK-LISTS",
-    "TBODY",
-    "TD",
-    "TEMPLATE",
-    "TEXT",
-    "TEXTAREA",
-    "TFOOT",
-    "TH",
-    "THEAD",
-    "TIME",
-    "TITLE",
-    "TOOL-TIP",
-    "TP-YT-APP-DRAWER",
-    "TP-YT-PAPER-BUTTON",
-    "TP-YT-PAPER-SPINNER-LITE",
-    "TP-YT-PAPER-SPINNER",
-    "TP-YT-PAPER-TOOLTIP",
-    "TR",
-    "TRACK",
-    "U",
-    "UL",
-    "USE",
-    "VAR",
-    "VIDEO",
-    "WBR",
-    "YT-ANIMATED-ROLLING-NUMBER",
-    "YT-ATTRIBUTED-STRING",
-    "YT-BUTTON-SHAPE",
-    "YT-COLLECTIONS-STACK",
-    "YT-FORMATTED-STRING",
-    "YT-GUIDE-MANAGER",
-    "YT-HOTKEY-MANAGER",
-    "YT-ICON-BADGE-SHAPE",
-    "YT-ICON-BUTTON",
-    "YT-ICON-SHAPE",
-    "YT-ICON",
-    "YT-IMAGE",
-    "YT-IMG-SHADOW",
-    "YT-INLINE-PLAYER-CONTROLS",
-    "YT-INTERACTION",
-    "YT-MDX-MANAGER",
-    "YT-PAGE-NAVIGATION-PROGRESS",
-    "YT-PLAYABILITY-ERROR-SUPPORTED-RENDERERS",
-    "YT-PLAYLIST-MANAGER",
-    "YT-TOUCH-FEEDBACK-SHAPE",
-    "YTD-APP",
-    "YTD-BADGE-SUPPORTED-RENDERER",
-    "YTD-BROWSE",
-    "YTD-BUTTON-RENDERER",
-    "YTD-CHANNEL-LEGAL-INFO-RENDERER",
-    "YTD-CHANNEL-NAME",
-    "YTD-COMMENTS",
-    "YTD-CONTINUATION-ITEM-RENDERER",
-    "YTD-GHOST-GRID-RENDERER",
-    "YTD-LOGO",
-    "YTD-LOTTIE-PLAYER",
-    "YTD-MASTHEAD",
-    "YTD-MENU-RENDERER",
-    "YTD-METADATA-ROW-CONTAINER-RENDERER",
-    "YTD-MINI-GUIDE-ENTRY-RENDERER",
-    "YTD-MINI-GUIDE-RENDERER",
-    "YTD-MINIPLAYER-TOAST",
-    "YTD-MINIPLAYER",
-    "YTD-NOTIFICATION-TOPBAR-BUTTON-RENDERER",
-    "YTD-PAGE-MANAGER",
-    "YTD-PERMISSION-ROLE-BOTTOM-BAR-RENDERER",
-    "YTD-PLAYER",
-    "YTD-PLAYLIST-HEADER-RENDERER",
-    "YTD-PLAYLIST-PANEL-RENDERER",
-    "YTD-PLAYLIST-SIDEBAR-RENDERER",
-    "YTD-PLAYLIST-THUMBNAIL",
-    "YTD-POPUP-CONTAINER",
-    "YTD-REFRESH",
-    "YTD-RICH-GRID-MEDIA",
-    "YTD-RICH-GRID-RENDERER",
-    "YTD-RICH-GRID-ROW",
-    "YTD-RICH-GRID-SLIM-MEDIA",
-    "YTD-RICH-ITEM-RENDERER",
-    "YTD-RICH-SECTION-RENDERER",
-    "YTD-RICH-SHELF-RENDERER",
-    "YTD-SEARCHBOX",
-    "YTD-SENTIMENT-BAR-RENDERER",
-    "YTD-SETTINGS-SIDEBAR-RENDERER",
-    "YTD-SHELF-RENDERER",
-    "YTD-STRUCTURED-DESCRIPTION-CONTENT-RENDERER",
-    "YTD-TEXT-INLINE-EXPANDER",
-    "YTD-THIRD-PARTY-MANAGER",
-    "YTD-THUMBNAIL-OVERLAY-EQUALIZER",
-    "YTD-THUMBNAIL-OVERLAY-NOW-PLAYING-RENDERER",
-    "YTD-THUMBNAIL-OVERLAY-TIME-STATUS-RENDERER",
-    "YTD-THUMBNAIL",
-    "YTD-TOPBAR-LOGO-RENDERER",
-    "YTD-TOPBAR-MENU-BUTTON-RENDERER",
-    "YTD-TWO-COLUMN-BROWSE-RESULTS-RENDERER",
-    "YTD-VIDEO-META-BLOCK",
-    "YTD-VIDEO-OWNER-RENDERER",
-    "YTD-VIDEO-PREVIEW",
-    "YTD-VIDEO-PRIMARY-INFO-RENDERER",
-    "YTD-VIDEO-QUALITY-PROMO-RENDERER",
-    "YTD-WATCH-ENGAGEMENT-PANELS",
-    "YTD-WATCH-FLEXY",
-    "YTD-WATCH-INFO-TEXT",
-    "YTD-WATCH-METADATA",
-    "YTD-WATCH-NEXT-SECONDARY-RESULTS-RENDERER",
-    "YTD-YOODLE-RENDERER"
-  ]
-}

packages/api/src/index.ts

@@ -7,6 +7,8 @@ import v2DataRoutes from 'routes/v2/data';
 import v2ReportRoutes from 'routes/v2/report';
 import v3DataRoutes from 'routes/v3/data';
 import v3ReportRoutes from 'routes/v3/report';
+import v4DataRoutes from 'routes/v4/data';
+import v4ReportRoutes from 'routes/v4/report';
 import environment from 'services/environment';
 
 const server = fastify({ logger: true });
@@ -31,6 +33,8 @@ server.register(v2DataRoutes, { prefix: '/rest/v2' });
 server.register(v2ReportRoutes, { prefix: '/rest/v2' });
 server.register(v3DataRoutes, { prefix: '/rest/v3' });
 server.register(v3ReportRoutes, { prefix: '/rest/v3' });
+server.register(v4DataRoutes, { prefix: '/rest/v4' });
+server.register(v4ReportRoutes, { prefix: '/rest/v4' });
 
 server.listen({ host: '0.0.0.0', port: environment.port }, (error, address) => {
   if (error) {

packages/api/src/routes/v1/entries.ts

@@ -1,17 +1,14 @@
 import { FastifyInstance, RouteShorthandOptions } from 'fastify';
-import fetch from 'node-fetch';
 
+/**
+ * @deprecated This API route is no longer supported. Please use a newer version
+ */
 export default (server: FastifyInstance, options: RouteShorthandOptions, done: () => void) => {
   server.get('/entries/', async (request, reply) => {
-    try {
+    reply.send({
-      const repositoryUrl = 'https://raw.githubusercontent.com/wanhose/cookie-dialog-monster/main';
+      success: false,
-      const dataUrl = `${repositoryUrl}/data/elements.txt`;
+      errors: ['This API route is no longer supported. Please use a newer version'],
-      const entriesLength = (await (await fetch(dataUrl)).text()).split('\n').length;
+    });
-
-      reply.send({ entries: entriesLength, success: true });
-    } catch {
-      reply.send({ success: false });
-    }
   });
 
   done();

packages/api/src/routes/v1/report.ts

@@ -1,31 +1,15 @@
 import { FastifyInstance, RouteShorthandOptions } from 'fastify';
 
-type PostReportBody = {
+/**
-  html?: string;
+ * @deprecated This API route is no longer supported. Please use a newer version
-  subject: string;
+ */
-  text?: string;
-  to: string;
-};
-
 export default (server: FastifyInstance, options: RouteShorthandOptions, done: () => void) => {
-  server.post<{ Body: PostReportBody }>(
+  server.post('/report/', {}, async (_request, reply) => {
-    '/report/',
+    reply.send({
-    {
-      schema: {
-        body: {
-          properties: {},
-          required: [],
-          type: 'object',
-        },
-      },
-    },
-    async (_request, reply) => {
-      reply.status(500).send({
       success: false,
-        errors: ['This API route is no longer supported. Please upgrade to the latest version'],
+      errors: ['This API route is no longer supported. Please use a newer version'],
+    });
   });
-    }
-  );
 
   done();
 };

packages/api/src/routes/v2/data.ts

@@ -1,32 +1,22 @@
 import { FastifyInstance, RouteShorthandOptions } from 'fastify';
 import fetch from 'node-fetch';
+import { parseNewFix } from 'services/compatibility';
 
 export default (server: FastifyInstance, options: RouteShorthandOptions, done: () => void) => {
   server.get('/data/', async (request, reply) => {
     try {
-      const dataUrl = 'https://raw.githubusercontent.com/wanhose/cookie-dialog-monster/main/data';
+      const databaseUrl =
-      const commonWordsUrl = `${dataUrl}/common-words.json`;
+        'https://raw.githubusercontent.com/wanhose/cookie-dialog-monster/main/database.json';
-      const fixesUrl = `${dataUrl}/fixes.txt`;
+      const result = await (await fetch(databaseUrl)).json();
-      const skipsUrl = `${dataUrl}/skips.json`;
-      const tokensUrl = `${dataUrl}/tokens.json`;
-
-      const results = await Promise.all([
-        fetch(commonWordsUrl),
-        fetch(fixesUrl),
-        fetch(skipsUrl),
-        fetch(tokensUrl),
-      ]);
-      const skips = await results[2].json();
-      const tokens = await results[3].json();
 
       reply.send({
         data: {
-          classes: tokens.classes,
+          classes: result.tokens.classes,
-          commonWords: await results[0].json(),
+          commonWords: result.commonWords,
-          elements: tokens.selectors,
+          elements: result.tokens.selectors,
-          fixes: (await results[1].text()).split('\n').filter((x) => !!x),
+          fixes: result.fixes.map(parseNewFix),
-          skips: skips.domains,
+          skips: result.skips.domains,
-          tags: skips.tags,
+          tags: result.skips.tags,
         },
         success: true,
       });

packages/api/src/routes/v3/data.ts

@@ -1,33 +1,26 @@
 import { FastifyInstance, RouteShorthandOptions } from 'fastify';
 import fetch from 'node-fetch';
+import { parseNewFix } from 'services/compatibility';
 
 export default (server: FastifyInstance, _options: RouteShorthandOptions, done: () => void) => {
   server.get('/data/', async (_request, reply) => {
     try {
-      const dataUrl = 'https://raw.githubusercontent.com/wanhose/cookie-dialog-monster/main/data';
+      const databaseUrl =
-      const commonWordsUrl = `${dataUrl}/common-words.json`;
+        'https://raw.githubusercontent.com/wanhose/cookie-dialog-monster/main/database.json';
-      const fixesUrl = `${dataUrl}/fixes.txt`;
+      const result = await (await fetch(databaseUrl)).json();
-      const skipsUrl = `${dataUrl}/skips.json`;
-      const tokensUrl = `${dataUrl}/tokens.json`;
-
-      const results = await Promise.all([
-        fetch(commonWordsUrl),
-        fetch(fixesUrl),
-        fetch(skipsUrl),
-        fetch(tokensUrl),
-      ]);
 
       reply.send({
         data: {
-          commonWords: await results[0].json(),
+          ...result,
-          fixes: (await results[1].text()).split('\n').filter((x) => !!x),
+          fixes: result.fixes.map(parseNewFix),
-          skips: await results[2].json(),
-          tokens: await results[3].json(),
         },
         success: true,
       });
     } catch (error) {
-      reply.send({ success: false });
+      reply.send({
+        errors: [error.message],
+        success: false,
+      });
     }
   });
 

packages/api/src/routes/v3/report.ts

@@ -39,6 +39,7 @@ export default (server: FastifyInstance, _options: RouteShorthandOptions, done:
       const issues = await octokit.request('GET /repos/{owner}/{repo}/issues', {
         owner: environment.github.owner,
         repo: environment.github.repo,
+        state: 'all',
       });
       const ua = new UAParser(request.body.userAgent ?? '').getResult();
       const url = new URL(request.body.url).hostname
@@ -49,8 +50,19 @@ export default (server: FastifyInstance, _options: RouteShorthandOptions, done:
       const existingIssue = issues.data.find((issue) => issue.title.includes(url));
 
       try {
-        if (existingIssue) {
+        if (existingIssue?.state === 'closed') {
-          throw new Error('Issue already exists');
+          await octokit.request('PATCH /repos/{owner}/{repo}/issues/{issue_number}', {
+            owner: environment.github.owner,
+            repo: environment.github.repo,
+            issue_number: existingIssue.number,
+            state: 'open',
+          });
+
+          reply.send({
+            data: existingIssue.html_url,
+            success: true,
+          });
+          return;
         }
 
         const response = await octokit.request('POST /repos/{owner}/{repo}/issues', {
@@ -84,7 +96,6 @@ export default (server: FastifyInstance, _options: RouteShorthandOptions, done:
         reply.send({
           errors: [error.message],
           success: false,
-          data: existingIssue?.html_url,
         });
       }
     }

packages/api/src/routes/v4/data.ts

@@ -0,0 +1,24 @@
+import { FastifyInstance, RouteShorthandOptions } from 'fastify';
+import fetch from 'node-fetch';
+
+export default (server: FastifyInstance, _options: RouteShorthandOptions, done: () => void) => {
+  server.get('/data/', async (_request, reply) => {
+    try {
+      const databaseUrl =
+        'https://raw.githubusercontent.com/wanhose/cookie-dialog-monster/main/database.json';
+      const fetchOptions = {
+        headers: { 'Cache-Control': 'no-cache' },
+      };
+      const result = await (await fetch(databaseUrl, fetchOptions)).json();
+
+      reply.send({ data: result, success: true });
+    } catch (error) {
+      reply.send({
+        errors: [error.message],
+        success: false,
+      });
+    }
+  });
+
+  done();
+};

packages/api/src/routes/v4/report.ts

@@ -0,0 +1 @@
+export { default as default } from '../v3/report';

packages/api/src/services/compatibility.ts

@@ -0,0 +1,13 @@
+/**
+ * Parse the new fix object into the old string format used by older versions of the extension
+ */
+export function parseNewFix(fix: Fix): string {
+  return `${fix.domain}##${fix.selector}##${fix.action}${fix.property ? `##${fix.property}` : ''}`;
+}
+
+export interface Fix {
+  readonly action: string;
+  readonly domain: string;
+  readonly property?: string;
+  readonly selector: string;
+}

packages/browser-extension/src/_locales/de/messages.json

@@ -35,6 +35,12 @@
   "popup_contributeOption": {
     "message": "Tragen Sie zu diesem Projekt bei"
   },
+  "popup_databaseVersion": {
+    "message": "Datenbankversion"
+  },
+  "popup_extensionVersion": {
+    "message": "Erweiterungsversion"
+  },
   "popup_helpOption": {
     "message": "Hilfe oder Probleme?"
   },

packages/browser-extension/src/_locales/en/messages.json

@@ -35,6 +35,12 @@
   "popup_contributeOption": {
     "message": "Contribute to this project"
   },
+  "popup_databaseVersion": {
+    "message": "Database version"
+  },
+  "popup_extensionVersion": {
+    "message": "Extension version"
+  },
   "popup_helpOption": {
     "message": "Help or issues?"
   },

packages/browser-extension/src/_locales/es/messages.json

@@ -35,6 +35,12 @@
   "popup_contributeOption": {
     "message": "Contribuye a este proyecto"
   },
+  "popup_databaseVersion": {
+    "message": "Versión de la base de datos"
+  },
+  "popup_extensionVersion": {
+    "message": "Versión de la extensión"
+  },
   "popup_helpOption": {
     "message": "¿Ayuda o problemas?"
   },

packages/browser-extension/src/_locales/fr/messages.json

@@ -35,6 +35,12 @@
   "popup_contributeOption": {
     "message": "Contribuez à ce projet"
   },
+  "popup_databaseVersion": {
+    "message": "Version de la base de données"
+  },
+  "popup_extensionVersion": {
+    "message": "Version de l'extension"
+  },
   "popup_helpOption": {
     "message": "Aide ou problèmes?"
   },

packages/browser-extension/src/_locales/it/messages.json

@@ -35,6 +35,12 @@
   "popup_contributeOption": {
     "message": "Contribuisci a questo progetto"
   },
+  "popup_databaseVersion": {
+    "message": "Versione del database"
+  },
+  "popup_extensionVersion": {
+    "message": "Versione dell'estensione"
+  },
   "popup_helpOption": {
     "message": "Aiuto o problemi?"
   },

packages/browser-extension/src/_locales/pl/messages.json

@@ -35,6 +35,12 @@
   "popup_contributeOption": {
     "message": "Weź udział w rozwoju projektu"
   },
+  "popup_databaseVersion": {
+    "message": "Wersja bazy danych"
+  },
+  "popup_extensionVersion": {
+    "message": "Wersja rozszerzenia"
+  },
   "popup_helpOption": {
     "message": "Potrzebujesz pomocy lub masz problem?"
   },

packages/browser-extension/src/_locales/pt_BR/messages.json

@@ -35,6 +35,12 @@
   "popup_contributeOption": {
     "message": "Contribua para este projeto"
   },
+  "popup_databaseVersion": {
+    "message": "Versão do banco de dados"
+  },
+  "popup_extensionVersion": {
+    "message": "Versão da extensão"
+  },
   "popup_helpOption": {
     "message": "Ajuda ou problemas?"
   },

packages/browser-extension/src/_locales/pt_PT/messages.json

@@ -35,6 +35,12 @@
   "popup_contributeOption": {
     "message": "Contribua para este projeto"
   },
+  "popup_databaseVersion": {
+    "message": "Versão do banco de dados"
+  },
+  "popup_extensionVersion": {
+    "message": "Versão da extensão"
+  },
   "popup_helpOption": {
     "message": "Ajuda ou problemas?"
   },

packages/browser-extension/src/_locales/ro/messages.json

@@ -35,6 +35,12 @@
   "popup_contributeOption": {
     "message": "Contribuie la acest proiect"
   },
+  "popup_databaseVersion": {
+    "message": "Versiunea bazei de date"
+  },
+  "popup_extensionVersion": {
+    "message": "Versiunea extensiei"
+  },
   "popup_helpOption": {
     "message": "Ajutor sau probleme?"
   },

packages/browser-extension/src/_locales/ru/messages.json

@@ -35,6 +35,12 @@
   "popup_contributeOption": {
     "message": "Внести свой вклад в этот проект"
   },
+  "popup_databaseVersion": {
+    "message": "Версия базы данных"
+  },
+  "popup_extensionVersion": {
+    "message": "Версия расширения"
+  },
   "popup_helpOption": {
     "message": "Помощь или проблемы?"
   },

packages/browser-extension/src/manifest.json

@@ -1,7 +1,7 @@
 {
   "manifest_version": 3,
   "name": "Cookie Dialog Monster",
-  "version": "7.0.4",
+  "version": "7.1.0",
   "default_locale": "en",
   "description": "__MSG_appDesc__",
   "icons": {

packages/browser-extension/src/popup.html

@@ -105,6 +105,53 @@
         </svg>
         <span data-i18n="popup_rateOption"></span>
       </popup-button>
+      <popup-data-container>
+        <popup-data>
+          <strong data-i18n="popup_databaseVersion"></strong>
+          <span id="database-version"></span>
+          <popup-data-button
+            data-animation="flip"
+            id="refresh-database-button"
+            role="button"
+            tabindex="0"
+          >
+            <svg
+              aria-hidden="true"
+              fill="none"
+              height="12"
+              id="refresh-database-spinner"
+              stroke-linecap="round"
+              stroke-linejoin="round"
+              stroke-width="2"
+              stroke="currentColor"
+              viewBox="0 0 24 24"
+              width="12"
+            >
+              <polyline points="1 4 1 10 7 10"></polyline>
+              <polyline points="23 20 23 14 17 14"></polyline>
+              <path d="M20.49 9A9 9 0 0 0 5.64 5.64L1 10m22 4l-4.64 4.36A9 9 0 0 1 3.51 15"></path>
+            </svg>
+            <svg
+              aria-hidden="true"
+              fill="none"
+              height="12"
+              id="refresh-database-check"
+              stroke-linecap="round"
+              stroke-linejoin="round"
+              stroke-width="2"
+              stroke="var(--color-success)"
+              viewBox="0 0 24 24"
+              width="12"
+            >
+              <polyline points="20 6 9 17 4 12"></polyline>
+            </svg>
+          </popup-data-button>
+        </popup-data>
+        <popup-data>
+          <strong data-i18n="popup_extensionVersion"></strong>
+          <span id="extension-version"></span>
+        </popup-data>
+      </popup-data-container>
     </main>
     <footer></footer>
   </body>

packages/browser-extension/src/scripts/background.js

@@ -6,7 +6,7 @@ if (typeof browser === 'undefined') {
  * @description API URL
  * @type {string}
  */
-const apiUrl = 'https://api.cookie-dialog-monster.com/rest/v3';
+const apiUrl = 'https://api.cookie-dialog-monster.com/rest/v4';
 
 /**
  * @description Context menu identifier
@@ -68,7 +68,7 @@ const report = async (message, tab, callback) => {
     const userAgent = message.userAgent;
     const version = browser.runtime.getManifest().version;
     const body = JSON.stringify({ reason, url: tab.url, userAgent, version });
-    const headers = { 'Content-type': 'application/json' };
+    const headers = { 'Cache-Control': 'no-cache', 'Content-type': 'application/json' };
     const url = `${apiUrl}/report/`;
 
     const response = await fetch(url, { body, headers, method: 'POST' });
@@ -91,7 +91,9 @@ browser.contextMenus.onClicked.addListener((info, tab) => {
 
   switch (info.menuItemId) {
     case reportMenuItemId:
-      if (tabId) browser.tabs.sendMessage(tabId, { type: 'SHOW_REPORT_DIALOG' }, suppressLastError);
+      if (tabId !== undefined) {
+        browser.tabs.sendMessage(tabId, { type: 'SHOW_REPORT_DIALOG' }, suppressLastError);
+      }
       break;
     case settingsMenuItemId:
       browser.runtime.openOptionsPage();
@@ -111,18 +113,18 @@ browser.runtime.onMessage.addListener((message, sender, callback) => {
 
   switch (message.type) {
     case 'DISABLE_ICON':
-      if (isPage && tabId) {
+      if (isPage && tabId !== undefined) {
         browser.action.setIcon({ path: '/assets/icons/disabled.png', tabId }, suppressLastError);
         browser.action.setBadgeText({ tabId, text: '' });
       }
       break;
     case 'ENABLE_ICON':
-      if (isPage && tabId) {
+      if (isPage && tabId !== undefined) {
         browser.action.setIcon({ path: '/assets/icons/enabled.png', tabId }, suppressLastError);
       }
       break;
     case 'ENABLE_POPUP':
-      if (isPage && tabId) {
+      if (isPage && tabId !== undefined) {
         browser.action.setPopup({ popup: '/popup.html', tabId }, suppressLastError);
       }
       break;
@@ -137,8 +139,8 @@ browser.runtime.onMessage.addListener((message, sender, callback) => {
       return true;
     case 'GET_EXCLUSION_LIST':
       storage.get(null, (exclusions) => {
-        const exclusionList = Object.entries(exclusions || {}).flatMap((x) =>
+        const exclusionList = Object.entries(exclusions || {}).flatMap((exclusion) =>
-          x[0] !== 'data' && !x[1]?.enabled ? [x[0]] : []
+          exclusion[0] !== 'data' && !exclusion[1]?.enabled ? [exclusion[0]] : []
         );
         callback(exclusionList);
       });
@@ -157,28 +159,33 @@ browser.runtime.onMessage.addListener((message, sender, callback) => {
       });
       return true;
     case 'INSERT_DIALOG_CSS':
-      if (isPage && tabId) {
+      if (isPage && tabId !== undefined) {
         script.insertCSS({ files: ['styles/dialog.css'], target: { tabId } });
       }
       break;
+    case 'REFRESH_DATA':
+      refreshData(callback);
+      return true;
     case 'REPORT':
-      if (tabId) {
+      if (tabId !== undefined) {
         report(message, sender.tab, callback);
         return true;
       }
       break;
     case 'SET_BADGE':
-      if (tabId) {
+      if (tabId !== undefined) {
         browser.action.setBadgeBackgroundColor({ color: '#6b7280' });
         browser.action.setBadgeText({ tabId, text: message.value });
       }
       break;
     case 'SET_HOSTNAME_STATE':
-      if (hostname && message.state.enabled === false) {
+      if (hostname) {
+        if (message.state.enabled === false) {
           storage.set({ [hostname]: message.state });
-      } else if (hostname) {
+        } else {
           storage.remove(hostname);
         }
+      }
       break;
     default:
       break;

packages/browser-extension/src/scripts/content.js

@@ -1,20 +1,28 @@
+/**
+ * @typedef {Object} ExtensionData
+ * @property {string[] | undefined} commonWords
+ * @property {Fix[] | undefined} fixes
+ * @property {{ domains: string[] | undefined, tags: string[] | undefined } | undefined} skips
+ * @property {{ classes: string[] | undefined, selectors: string[] | undefined } | undefined} tokens
+ */
+
+/**
+ * @typedef {Object} Fix
+ * @property {string} action
+ * @property {string} domain
+ * @property {string | undefined} property
+ * @property {string} selector
+ */
+
+/**
+ * @typedef {Object} RunParams
+ * @property {boolean | undefined} skipTriggerEvent
+ */
+
 if (typeof browser === 'undefined') {
   browser = chrome;
 }
 
-/**
- * @typedef {Object} ExtensionData
- * @property {string[]} commonWords
- * @property {string[]} fixes
- * @property {{ domains: string[], tags: string[] }} skips
- * @property {{ classes: string[], selectors: string[] }} tokens
- */
-
-/**
- * @description Attribute name
- */
-const dataAttributeName = 'data-cookie-dialog-monster';
-
 /**
  * @description Matched elements count
  * @type {number}
@@ -27,16 +35,16 @@ let count = 0;
  */
 let { commonWords, fixes = [], skips, tokens } = {};
 
+/**
+ * @description Attribute name
+ */
+const dataAttributeName = 'data-cookie-dialog-monster';
+
 /**
  * @description Shortcut to send messages to background script
  */
 const dispatch = browser.runtime.sendMessage;
 
-/**
- * @description Event name
- */
-const setupEventName = 'cookie-dialog-monster';
-
 /**
  * @description Current hostname
  * @type {string}
@@ -44,10 +52,10 @@ const setupEventName = 'cookie-dialog-monster';
 const hostname = getHostname();
 
 /**
- * @description Elements that were already matched and are removable
+ * @description Initial visibility state
- * @type {HTMLElement[]}
+ * @type {boolean}
  */
-const removables = [];
+let initiallyVisible = document.visibilityState === 'visible';
 
 /**
  * @description Options provided to observer
@@ -60,6 +68,12 @@ const options = { childList: true, subtree: true };
  */
 const preview = hostname.startsWith('consent.') || hostname.startsWith('myprivacy.');
 
+/**
+ * @description Elements that were already matched and are removable
+ * @type {HTMLElement[]}
+ */
+const removables = [];
+
 /**
  * @description Elements that were already seen
  * @type {HTMLElement[]}
@@ -72,6 +86,11 @@ const seen = [];
  */
 let state = { enabled: true };
 
+/**
+ * @description Event name to trigger the cleaning process
+ */
+const triggerEventName = 'cookie-dialog-monster';
+
 /**
  * @description Clean DOM
  * @param {Element[]} elements
@@ -79,14 +98,25 @@ let state = { enabled: true };
  * @returns {void}
  */
 function clean(elements, skipMatch) {
-  for (const element of elements) {
+  let index = 0;
+  const size = 50;
+
+  function chunk() {
+    const end = Math.min(index + size, elements.length);
+
+    for (; index < end; index++) {
+      const element = elements[index];
+
       if (match(element, skipMatch)) {
         const observer = new MutationObserver(forceElementStyles);
-      const options = { attributes: true, attributeFilter: [dataAttributeName, 'class', 'style'] };
 
         element.setAttribute(dataAttributeName, 'true');
         element.style.setProperty('display', 'none', 'important');
-      observer.observe(element, options);
+
+        observer.observe(element, {
+          attributes: true,
+          attributeFilter: [dataAttributeName, 'class', 'style'],
+        });
 
         count += 1;
         dispatch({ type: 'SET_BADGE', value: `${count}` });
@@ -98,6 +128,13 @@ function clean(elements, skipMatch) {
 
       seen.push(element);
     }
+
+    if (index < elements.length) {
+      requestAnimationFrame(chunk);
+    }
+  }
+
+  requestAnimationFrame(chunk);
 }
 
 /**
@@ -108,8 +145,10 @@ function clean(elements, skipMatch) {
 function forceClean(element) {
   const elements = [...element.querySelectorAll(tokens.selectors)];
 
+  if (elements.length) {
     fix();
-  if (elements.length && !preview) clean(elements, true);
+    clean(elements, true);
+  }
 }
 
 /**
@@ -169,7 +208,12 @@ function isInViewport(element) {
  * @returns {boolean}
  */
 function match(element, skipMatch) {
-  if (!tokens?.classes.length || !tokens?.selectors.length) {
+  if (
+    !commonWords.length ||
+    !tokens?.classes?.length ||
+    !tokens?.selectors?.length ||
+    !skips?.tags?.length
+  ) {
     return false;
   }
 
@@ -192,11 +236,16 @@ function match(element, skipMatch) {
   }
 
   if (element.hasAttributes()) {
-    // 2023-06-10: twitch.tv temporary fix
+    // 2023-06-10: fix #113 temporarily
     if (element.classList.contains('chat-line__message')) {
       return false;
     }
 
+    // 2024-08-03: fix #701 temporarily
+    if (element.classList.contains('sellos')) {
+      return false;
+    }
+
     const isDialog = tagName === 'DIALOG' && element.getAttribute('open') === 'true';
     const isFakeDialog = tagName === 'DIV' && element.className.includes('cmp');
 
@@ -215,7 +264,7 @@ function match(element, skipMatch) {
 }
 
 /**
- * @description Fix data, consent page and scroll issues
+ * @description Fix data, middle consent page and scroll issues
  * @returns {void}
  */
 function fix() {
@@ -230,10 +279,13 @@ function fix() {
     }
   }
 
-  for (const fix of fixes) {
+  // 2024-08-02: fix #644 temporarily
-    const [match, selector, action, property] = fix.split('##');
+  document.getElementsByTagName('ion-router-outlet')[0]?.removeAttribute('inert');
 
-    if (hostname.includes(match)) {
+  for (const fix of fixes) {
+    const { action, domain, property, selector } = fix;
+
+    if (hostname.includes(domain)) {
       switch (action) {
         case 'click': {
           const element = document.querySelector(selector);
@@ -309,10 +361,10 @@ function restoreDOM() {
 
 /**
  * @async
- * @description Set up everything
+ * @description Run the extension
- * @param {boolean} skipReadyStateHack
+ * @param {RunParams | undefined} params
  */
-async function setup(skipReadyStateHack) {
+async function run(params) {
   state = (await dispatch({ hostname, type: 'GET_HOSTNAME_STATE' })) ?? state;
   dispatch({ type: 'ENABLE_POPUP' });
 
@@ -328,13 +380,12 @@ async function setup(skipReadyStateHack) {
       dispatch({ type: 'SET_BADGE', value: `${count}` });
     }
 
-    // 2023-06-13: hack to force clean when data request takes too long and there are no changes later
-    if (document.readyState === 'complete' && !skipReadyStateHack) {
-      window.dispatchEvent(new Event(setupEventName));
-    }
-
     dispatch({ type: 'ENABLE_ICON' });
     observer.observe(document.body ?? document.documentElement, options);
+
+    if (!params?.skipTriggerEvent) {
+      window.dispatchEvent(new CustomEvent(triggerEventName));
+    }
   } else {
     dispatch({ type: 'DISABLE_ICON' });
     observer.disconnect();
@@ -352,50 +403,44 @@ const observer = new MutationObserver((mutations) => {
 
   const elements = mutations.flatMap((mutation) => Array.from(mutation.addedNodes));
 
-  fix();
+  window.dispatchEvent(new CustomEvent(triggerEventName, { detail: { elements } }));
-  clean(elements);
 });
 
 /**
  * @description Listen to messages from any other scripts
  * @listens browser.runtime#onMessage
  */
-browser.runtime.onMessage.addListener((message) => {
+browser.runtime.onMessage.addListener(async (message) => {
   switch (message.type) {
     case 'RESTORE': {
       restoreDOM();
       break;
     }
     case 'RUN': {
-      if (removables.length) clean(removables, true);
+      if (removables.length) {
+        window.dispatchEvent(new CustomEvent(triggerEventName), {
+          detail: {
+            elements: removables,
+            skipMatch: true,
+          },
+        });
+      }
       break;
     }
   }
 
-  setup();
+  await run({ skipTriggerEvent: message.type === 'RESTORE' });
 });
 
 /**
  * @async
- * @description Run setup if the page wasn't visible yet
+ * @description Fix still existing elements when page loads
- * @listens window#visibilitychange
+ * @listens window#DOMContentLoaded
  * @returns {void}
  */
-window.addEventListener('visibilitychange', async () => {
+window.addEventListener('DOMContentLoaded', async () => {
-  if (document.body?.children.length && !tokens) {
-    await setup(true);
-    clean([...document.body.children]);
-  }
-});
-
-/**
- * @description Fix still existing elements when page fully load
- * @listens window#load
- * @returns {void}
- */
-window.addEventListener('load', () => {
   if (document.visibilityState === 'visible') {
-    window.dispatchEvent(new Event(setupEventName));
+    await run();
   }
 });
 
@@ -404,10 +449,10 @@ window.addEventListener('load', () => {
  * @listens window#pageshow
  * @returns {void}
  */
-window.addEventListener('pageshow', (event) => {
+window.addEventListener('pageshow', async (event) => {
   if (document.visibilityState === 'visible' && event.persisted) {
-    setup(true);
+    await run();
-    window.dispatchEvent(new Event(setupEventName));
+    window.dispatchEvent(new CustomEvent(triggerEventName));
   }
 });
 
@@ -416,8 +461,13 @@ window.addEventListener('pageshow', (event) => {
  * @listens window#cookie-dialog-monster
  * @returns {void}
  */
-window.addEventListener(setupEventName, () => {
+window.addEventListener(triggerEventName, (event) => {
-  if (document.body?.children.length && state.enabled && tokens?.selectors.length && !preview) {
+  if (document.body?.children.length && !preview && state.enabled && tokens?.selectors?.length) {
+    fix();
+
+    if (event.detail?.elements) {
+      clean(event.detail.elements, event.detail.skipMatch);
+    } else {
       if (readingTime() < 4) {
         forceClean(document.body);
       } else {
@@ -425,8 +475,19 @@ window.addEventListener(setupEventName, () => {
         clean([...document.body.children]);
       }
     }
+  }
 });
 
-if (document.visibilityState === 'visible') {
+/**
-  setup();
+ * @async
+ * @description Run run if the page wasn't visible yet
+ * @listens window#visibilitychange
+ * @returns {void}
+ */
+window.addEventListener('visibilitychange', async () => {
+  if (document.visibilityState === 'visible' && !initiallyVisible) {
+    initiallyVisible = true;
+    await run();
+    window.dispatchEvent(new CustomEvent(triggerEventName));
   }
+});

packages/browser-extension/src/scripts/dialog.js

@@ -195,7 +195,14 @@ function showReportDialog() {
  * @param {MouseEvent} event
  */
 async function submitButtonClickHandler(event) {
+  const target = event.currentTarget;
+
+  if (target.getAttribute('aria-disabled') === 'true') {
+    return;
+  }
+
   event.preventDefault();
+  target.setAttribute('aria-disabled', 'true');
 
   const dialog = document.getElementById(reportDialogId);
   const formView = dialog?.getElementsByTagName('report-dialog-form-view')[0];

packages/browser-extension/src/scripts/popup.js

@@ -72,6 +72,12 @@ async function handleContentLoaded() {
   const contributeButtonElement = document.getElementById('contribute-option');
   contributeButtonElement?.addEventListener('click', handleLinkRedirect);
 
+  const databaseRefreshButtonElement = document.getElementById('refresh-database-button');
+  databaseRefreshButtonElement?.addEventListener('click', handleDatabaseRefresh);
+
+  const extensionVersionElement = document.getElementById('extension-version');
+  extensionVersionElement.innerText = browser.runtime.getManifest().version;
+
   const helpButtonElement = document.getElementById('help-option');
   helpButtonElement?.addEventListener('click', handleLinkRedirect);
 
@@ -90,6 +96,39 @@ async function handleContentLoaded() {
   settingsButtonElement.addEventListener('click', handleSettingsClick);
 
   translate();
+  updateDatabaseVersion();
+}
+
+/**
+ * @async
+ * @description Refresh the database
+ * @param {MouseEvent} event
+ */
+async function handleDatabaseRefresh(event) {
+  const target = event.currentTarget;
+
+  if (target.getAttribute('aria-disabled') === 'true') {
+    return;
+  }
+
+  const checkIcon = target.querySelector('#refresh-database-check');
+  const spinnerIcon = target.querySelector('#refresh-database-spinner');
+
+  target.setAttribute('data-refreshing', 'true');
+  target.setAttribute('aria-disabled', 'true');
+  await browser.runtime.sendMessage({ type: 'REFRESH_DATA' });
+  checkIcon.style.setProperty('display', 'block');
+  spinnerIcon.style.setProperty('display', 'none');
+  target.removeAttribute('data-animation');
+  target.removeAttribute('data-refreshing');
+  updateDatabaseVersion();
+
+  window.setTimeout(() => {
+    checkIcon.style.setProperty('display', 'none');
+    spinnerIcon.style.setProperty('display', 'block');
+    target.removeAttribute('aria-disabled');
+    target.setAttribute('data-animation', 'flip');
+  }, 5000);
 }
 
 /**
@@ -113,13 +152,13 @@ async function handleLinkRedirect(event) {
  * @returns {Promise<void>}
  */
 async function handlePowerToggle(event) {
-  const element = event.currentTarget;
+  const target = event.currentTarget;
   const next = { enabled: !state.enabled };
 
   browser.runtime.sendMessage({ hostname, state: next, type: 'SET_HOSTNAME_STATE' });
   browser.tabs.sendMessage(state.tabId, { type: next.enabled ? 'RUN' : 'RESTORE' });
-  element.setAttribute('disabled', 'true');
+  target.setAttribute('aria-disabled', 'true');
-  element.setAttribute('data-value', next.enabled ? 'on' : 'off');
+  target.setAttribute('data-value', next.enabled ? 'on' : 'off');
   window.close();
 }
 
@@ -152,6 +191,19 @@ function translate() {
   }
 }
 
+/**
+ * @async
+ * @description Update the database version element
+ * @returns {Promise<void>}
+ */
+async function updateDatabaseVersion() {
+  const data = await browser.runtime.sendMessage({ hostname, type: 'GET_DATA' });
+  const databaseVersionElement = document.getElementById('database-version');
+
+  if (data.version) databaseVersionElement.innerText = data.version;
+  else databaseVersionElement.style.setProperty('display', 'none');
+}
+
 /**
  * @description Listen to document ready
  * @listens document#DOMContentLoaded

packages/browser-extension/src/styles/popup.css

@@ -85,7 +85,9 @@ popup-button {
 
 popup-button:focus,
 popup-button:hover {
-  box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;
+  box-shadow:
+    rgba(50, 50, 93, 0.25) 0px 2px 5px -1px,
+    rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;
 }
 
 popup-button > span {
@@ -96,10 +98,58 @@ popup-button > svg {
   align-self: flex-end;
 }
 
+popup-data {
+  align-items: center;
+  display: flex;
+  gap: 4px;
+  justify-content: center;
+  outline: none;
+}
+
+popup-data:not(:first-child) {
+  margin-top: 4px;
+}
+
+popup-data-button {
+  cursor: pointer;
+  outline: none;
+  transition: 0.4s;
+}
+
+popup-data-button[aria-disabled='true'] {
+  cursor: not-allowed;
+}
+
+popup-data-button[data-animation='flip']:focus,
+popup-data-button[data-animation='flip']:hover {
+  transform: rotate(-180deg);
+}
+
+popup-data-button[data-refreshing='true'] {
+  animation: spin 1s linear infinite;
+}
+
+@keyframes spin {
+  to {
+    transform: rotate(-360deg);
+  }
+}
+
+popup-data-container {
+  font-size: 12px;
+  grid-column: 1 / -1;
+  justify-self: center;
+  text-align: center;
+}
+
 strong {
   font-weight: bold;
 }
 
+#refresh-database-check {
+  display: none;
+}
+
 #power-option {
   color: var(--color-white);
   word-break: break-all;