diff --git a/data/classes.txt b/data/classes.txt index 3e22e1c..1960eea 100644 --- a/data/classes.txt +++ b/data/classes.txt @@ -8,6 +8,7 @@ consent-modal-overflow cookies cu_k_cookie_consent_modal_open gcdc-locked +gdpr-infobar-visible gdprbanner_consent_gdpr_consent gdprCookieBanner-acceptedAll hasCookieBanner diff --git a/data/elements.txt b/data/elements.txt index 35155b0..4eb94ea 100644 --- a/data/elements.txt +++ b/data/elements.txt @@ -12668,4 +12668,6 @@ amp-consent .flatsome-cookies .popover-cover.zIndex--modal [style="position: fixed; left: 0px; top: 0px; width: 100%; height: 100%; z-index: 999; background-color: rgba(0, 0, 0, 0.3);"] -cmm-cookie-banner \ No newline at end of file +cmm-cookie-banner +.td-menu-background +[class*="sd-cmp-"] \ No newline at end of file diff --git a/packages/browser-extension/src/manifest.json b/packages/browser-extension/src/manifest.json index 272d9ac..0bd68c4 100644 --- a/packages/browser-extension/src/manifest.json +++ b/packages/browser-extension/src/manifest.json @@ -1,7 +1,7 @@ { "manifest_version": 3, "name": "Cookie Dialog Monster", - "version": "6.2.0", + "version": "6.2.1", "default_locale": "en", "description": "__MSG_appDesc__", "icons": { @@ -19,7 +19,7 @@ }, "content_scripts": [ { - "css": ["styles/dialog.css"], + "all_frames": true, "exclude_matches": [ "*://*.gfycat.com/*", "*://*.mediathekviewweb.de/*", @@ -32,7 +32,7 @@ } ], "host_permissions": ["http://*/*", "https://*/*"], - "permissions": ["contextMenus", "storage", "tabs"], + "permissions": ["contextMenus", "scripting", "storage", "tabs"], "web_accessible_resources": [ { "matches": ["http://*/*", "https://*/*"], diff --git a/packages/browser-extension/src/scripts/background.js b/packages/browser-extension/src/scripts/background.js index 4dc929a..d24daef 100644 --- a/packages/browser-extension/src/scripts/background.js +++ b/packages/browser-extension/src/scripts/background.js @@ -19,6 +19,20 @@ const initial = { enabled: true }; const reportMenuItemId = 'REPORT'; +/** + * @description A shortcut for chrome.scripting + * @type {chrome.storage.LocalStorageArea} + */ + +const script = chrome.scripting; + +/** + * @description The storage to use + * @type {chrome.storage.LocalStorageArea} + */ + +const storage = chrome.storage.local; + /** * @description Refreshes data * @param {void?} callback @@ -84,29 +98,29 @@ chrome.runtime.onMessage.addListener((message, sender, callback) => { if (tabId) chrome.action.setPopup({ popup: '/popup.html', tabId }); break; case 'GET_DATA': - chrome.storage.local.get('data', ({ data }) => { - if (data) callback(data); - else refreshData(callback); - }); - break; + storage.get('data', ({ data }) => (data ? callback(data) : refreshData(callback))); + return true; case 'GET_STATE': - // prettier-ignore - if (hostname) chrome.storage.local.get(hostname, (state) => callback(state[hostname] ?? initial)); - break; + if (hostname) storage.get(hostname, (state) => callback(state[hostname] ?? initial)); + return true; case 'GET_TAB': chrome.tabs.query({ active: true, currentWindow: true }, (tabs) => callback(tabs[0])); + return true; + case 'INSERT_CONTENT_CSS': + if (tabId) script.insertCSS({ files: ['styles/content.css'], target: { tabId } }); + break; + case 'INSERT_DIALOG_CSS': + if (tabId) script.insertCSS({ files: ['styles/dialog.css'], target: { tabId } }); break; case 'REPORT': if (tabId) report(message, sender.tab); break; case 'UPDATE_STATE': - if (hostname) chrome.storage.local.set({ [hostname]: message.state }); + if (hostname) storage.set({ [hostname]: message.state }); break; default: break; } - - return true; }); /** diff --git a/packages/browser-extension/src/scripts/content.js b/packages/browser-extension/src/scripts/content.js index fb4de5a..bdeaffd 100644 --- a/packages/browser-extension/src/scripts/content.js +++ b/packages/browser-extension/src/scripts/content.js @@ -78,6 +78,25 @@ const forceClean = () => { } }; +/** + * @description Checks if an element is visible in the viewport + * @param {HTMLElement} node + * @returns {boolean} + */ + +const isInViewport = (node) => { + const bounding = node.getBoundingClientRect(); + + return ( + bounding.top >= -node.offsetHeight && + bounding.left >= -node.offsetWidth && + bounding.right <= + (window.innerWidth || document.documentElement.clientWidth) + node.offsetWidth && + bounding.bottom <= + (window.innerHeight || document.documentElement.clientHeight) + node.offsetHeight + ); +}; + /** * @description Matches if node element is removable * @param {Element} node @@ -86,19 +105,24 @@ const forceClean = () => { */ const match = (node, skipMatch) => { - if (!(node instanceof HTMLElement)) return false; + if (node instanceof HTMLElement) { + const style = window.getComputedStyle(node); + const skipIsInViewport = + style.display === 'none' || + style.height === '0px' || + style.opacity === '0' || + style.visibility === 'hidden'; - const rect = node.getBoundingClientRect(); - const isFullscreen = rect.bottom + rect.top > 0 && rect.bottom - rect.top === 0; - const isVisible = rect.top <= (window.innerHeight || document.documentElement.clientHeight); + return ( + !data?.tags.includes(node.tagName?.toUpperCase?.()) && + (skipIsInViewport || isInViewport(node)) && + (!!node.offsetParent || style.position === 'fixed') && + !!node.parentElement && + (skipMatch || node.matches(data?.elements ?? [])) + ); + } - return ( - !data?.tags.includes(node.tagName?.toUpperCase?.()) && - (isFullscreen || isVisible) && - (node.offsetParent || window.getComputedStyle(node).position === 'fixed') && - node.parentElement && - (skipMatch || node.matches(data?.elements ?? [])) - ); + return false; }; /** @@ -106,6 +130,12 @@ const match = (node, skipMatch) => { */ const fix = () => { + const backdrop = document.getElementsByClassName('modal-backdrop')[0]; + + if (backdrop && backdrop.children.length === 0) { + backdrop.remove(); + } + document.getElementsByClassName('_31e')[0]?.classList.remove('_31e'); if (data?.skips.length && !data.skips.includes(hostname)) { @@ -189,7 +219,8 @@ window.addEventListener('pageshow', (event) => { if (state.enabled) { data = await dispatch({ hostname, type: 'GET_DATA' }); - observer.observe(document.body ?? document.documentElement, options); dispatch({ type: 'ENABLE_ICON' }); + dispatch({ type: 'INSERT_CONTENT_CSS' }); + observer.observe(document.body ?? document.documentElement, options); } })(); diff --git a/packages/browser-extension/src/scripts/dialog.js b/packages/browser-extension/src/scripts/dialog.js index 640ee8d..86a8c43 100644 --- a/packages/browser-extension/src/scripts/dialog.js +++ b/packages/browser-extension/src/scripts/dialog.js @@ -182,6 +182,7 @@ const showReportDialog = () => { radio.addEventListener('click', radioClickHandler); } + dispatch({ type: 'INSERT_DIALOG_CSS' }); document.body.appendChild(dialog); dialog.showModal(); diff --git a/packages/browser-extension/src/styles/content.css b/packages/browser-extension/src/styles/content.css new file mode 100644 index 0000000..c6820f6 --- /dev/null +++ b/packages/browser-extension/src/styles/content.css @@ -0,0 +1,7 @@ +*, +*:before, +*:after { + animation: none !important; + /* transform: none !important; */ + transition-property: none !important; +}