wanhose/cookie-dialog-monster
wanhose/cookie-dialog-monster
2
5
Fork 0
Code Issues 304 Pull Requests Releases 18 Wiki Activity

Merge pull request #244 from wanhose/v6.3.3

Browse Source 
6.3.3
This commit is contained in:
wanhose 2023-06-11 12:55:47 +02:00 committed by GitHub
commit d1c623604d
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 123 additions and 66 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
packages/browser-extension/src/manifest.json
View File

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

186
packages/browser-extension/src/scripts/content.js
View File

@ -1,6 +1,6 @@
/** /**
* @description Data properties * @description Data properties
* @type {{ classes: string[], fixes: string[], elements: string[], skips: string[], tags: string[] }?} * @type {{ classes: string[], commonWords?: string[], fixes: string[], elements: string[], skips: string[], tags: string[] }?}
*/ */
let data = null; let data = null;
@ -40,81 +40,125 @@ let state = { enabled: true };
/** /**
* @description Cleans DOM * @description Cleans DOM
* @param {Element[]} nodes * @param {Element[]} elements
* @param {boolean?} skipMatch * @param {boolean?} skipMatch
* @returns {void}
*/ */
const clean = (nodes, skipMatch) => { function clean(elements, skipMatch) {
for (let i = 0; i < nodes.length; i++) { for (const element of elements) {
const node = nodes[i]; if (match(element, skipMatch)) {
const observer = new MutationObserver(() => forceElementStyles(element));
if (match(node, skipMatch)) { element.setAttribute('data-cookie-dialog-monster', 'true');
const observer = new MutationObserver(() => { element.style.setProperty('display', 'none', 'important');
node.style.setProperty('display', 'none', 'important'); observer.observe(element, { attributes: true, attributeFilter: ['class', 'style'] });
});
if (!node.hasAttribute('data-cookie-dialog-monster')) {
node.setAttribute('data-cookie-dialog-monster', 'true');
node.style.setProperty('display', 'none', 'important');
observer.observe(node, { attributes: true, attributeFilter: ['style'] });
}
} }
} }
}; }
/** /**
* @description Forces a DOM clean * @description Flat child nodes for a given element
* @returns {void} * @param {HTMLElement} element
* @returns {number[]}
*/ */
const forceClean = () => { function flatElement(element) {
if (data?.elements.length && state.enabled && !preview) { return [...element.childNodes].flatMap((childNode) =>
const nodes = [...document.querySelectorAll(data.elements)]; childNode.nodeType === Node.TEXT_NODE
? [childNode.nodeType]
: [...[...childNode.childNodes].map((x) => x.nodeType)]
);
}
if (nodes.length) { /**
* @description Forces a DOM clean in the specific element
* @param {HTMLElement} element
*/
function forceClean(element) {
if (data?.elements.length && state.enabled && !preview) {
const elements = [...element.querySelectorAll(data.elements)];
if (elements.length) {
fix(); fix();
clean(nodes, true); clean(elements, true);
} }
} }
}; }
/**
* @description Forces element to have these styles
* @param {HTMLElement} element
*/
function forceElementStyles(element) {
element.style.setProperty('display', 'none', 'important');
}
/** /**
* @description Checks if an element is visible in the viewport * @description Checks if an element is visible in the viewport
* @param {HTMLElement} node * @param {HTMLElement} element
* @returns {boolean} * @returns {boolean}
*/ */
const isInViewport = (node) => { function isInViewport(element) {
const height = window.innerHeight || document.documentElement.clientHeight; const height = window.innerHeight || document.documentElement.clientHeight;
const position = node.getBoundingClientRect(); const position = element.getBoundingClientRect();
const scroll = window.scrollY || window.pageYOffset; const scroll = window.scrollY;
return ( return (
position.bottom === position.top || position.bottom === position.top ||
(scroll + position.top <= scroll + height && scroll + position.bottom >= scroll) (scroll + position.top <= scroll + height && scroll + position.bottom >= scroll)
); );
}; }
/** /**
* @description Checks if node element is removable * @description Checks if element element is removable
* @param {Element} node * @param {Element} element
* @param {boolean?} skipMatch * @param {boolean?} skipMatch
* @returns {boolean} * @returns {boolean}
*/ */
const match = (node, skipMatch) => function match(element, skipMatch) {
node instanceof HTMLElement && if (!element instanceof HTMLElement || !element.tagName) {
!node.getAttribute('data-cookie-dialog-monster') && return false;
!data?.tags.includes(node.tagName?.toUpperCase?.()) && }
isInViewport(node) &&
(skipMatch || node.matches(data?.elements ?? [])); if (element.getAttribute('data-cookie-dialog-monster')) {
return false;
}
if (data?.tags.includes(element.tagName?.toUpperCase?.())) {
return false;
}
if (element.childNodes.length && flatElement(element).every((x) => x === Node.TEXT_NODE)) {
return false;
}
if (element.hasAttributes()) {
return (
// 2023-06-10: twitch.tv temporary fix
!element.classList.contains('chat-line__message') &&
// ...
isInViewport(element) &&
(skipMatch || element.matches(data?.elements ?? []))
);
} else {
// 2023-06-10: fix edge case force cleaning on children if no attributes
if (data?.commonWords && element.outerHTML.match(new RegExp(data.commonWords.join('|')))) {
forceClean(element);
}
}
return false;
}
/** /**
* @description Fixes scroll issues * @description Fixes scroll issues
*/ */
const fix = () => { function fix() {
const backdrop = document.getElementsByClassName('modal-backdrop')[0]; const backdrop = document.getElementsByClassName('modal-backdrop')[0];
const facebook = document.getElementsByClassName('_31e')[0]; const facebook = document.getElementsByClassName('_31e')[0];
const fixes = data?.fixes ?? []; const fixes = data?.fixes ?? [];
@ -131,26 +175,20 @@ const fix = () => {
if (hostname.includes(match)) { if (hostname.includes(match)) {
switch (action) { switch (action) {
case 'click': { case 'click':
const node = document.querySelector(selector); document.querySelector(selector)?.click();
node?.click();
break; break;
} case 'remove':
case 'remove': { document.querySelector(selector)?.style?.removeProperty(property);
const node = document.querySelector(selector);
node?.style?.removeProperty(property);
break; break;
} case 'reset':
case 'reset': { document.querySelector(selector)?.style?.setProperty(property, 'initial', 'important');
const node = document.querySelector(selector);
node?.style?.setProperty(property, 'initial', 'important');
break; break;
} case 'resetAll':
case 'resetAll': { document.querySelectorAll(selector).forEach((element) => {
const nodes = document.querySelectorAll(selector); element?.style?.setProperty(property, 'initial', 'important');
nodes.forEach((node) => node?.style?.setProperty(property, 'initial', 'important')); });
break; break;
}
default: default:
break; break;
} }
@ -158,13 +196,27 @@ const fix = () => {
} }
if (skips.indexOf(hostname) === -1) { if (skips.indexOf(hostname) === -1) {
for (const item of [document.body, document.documentElement]) { for (const element of [document.body, document.documentElement]) {
item?.classList.remove(...(data?.classes ?? [])); element?.classList.remove(...(data?.classes ?? []));
item?.style.setProperty('position', 'initial', 'important'); element?.style.setProperty('position', 'initial', 'important');
item?.style.setProperty('overflow-y', 'initial', 'important'); element?.style.setProperty('overflow-y', 'initial', 'important');
} }
} }
}; }
/**
* @description Calculates reading time for the current page to avoid lags in large pages
* @returns {number}
*/
function readingTime() {
const text = document.body.innerText;
const wpm = 225;
const words = text.trim().split(/\s+/).length;
const time = Math.ceil(words / wpm);
return time;
}
/** /**
* @description Mutation Observer instance * @description Mutation Observer instance
@ -172,10 +224,12 @@ const fix = () => {
*/ */
const observer = new MutationObserver((mutations) => { const observer = new MutationObserver((mutations) => {
const nodes = mutations.map((mutation) => Array.from(mutation.addedNodes)).flat(); const elements = mutations.map((mutation) => Array.from(mutation.addedNodes)).flat();
fix(); if (data?.elements.length && !preview) {
if (data?.elements.length && !preview) clean(nodes); fix();
clean(elements);
}
}); });
/** /**
@ -184,7 +238,9 @@ const observer = new MutationObserver((mutations) => {
*/ */
window.addEventListener('DOMContentLoaded', () => { window.addEventListener('DOMContentLoaded', () => {
forceClean(); if (readingTime() < 4) {
forceClean(document.body);
}
}); });
/** /**
@ -194,7 +250,7 @@ window.addEventListener('DOMContentLoaded', () => {
window.addEventListener('pageshow', (event) => { window.addEventListener('pageshow', (event) => {
if (event.persisted) { if (event.persisted) {
forceClean(); forceClean(document.body);
} }
}); });

1
packages/browser-extension/src/styles/dialog.css
View File

@ -25,6 +25,7 @@
#report-dialog * { #report-dialog * {
box-sizing: border-box; box-sizing: border-box;
visibility: visible !important;
} }
report-dialog-body { report-dialog-body {