feat(browser-extension): improve viewport visibility check

This commit is contained in:
wanhose 2022-11-29 20:41:58 +01:00
parent 5dd80ae376
commit c4761c1c5c

View File

@ -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 * @description Matches if node element is removable
* @param {Element} node * @param {Element} node
@ -85,21 +104,13 @@ const forceClean = () => {
* @returns {boolean} * @returns {boolean}
*/ */
const match = (node, skipMatch) => { const match = (node, skipMatch) =>
if (!(node instanceof HTMLElement)) return false; node instanceof HTMLElement &&
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?.()) && !data?.tags.includes(node.tagName?.toUpperCase?.()) &&
(isFullscreen || isVisible) && isInViewport(node) &&
(node.offsetParent || window.getComputedStyle(node).position === 'fixed') && (!!node.offsetParent || window.getComputedStyle(node).position === 'fixed') &&
node.parentElement && !!node.parentElement &&
(skipMatch || node.matches(data?.elements ?? [])) (skipMatch || node.matches(data?.elements ?? []));
);
};
/** /**
* @description Fixes scroll issues * @description Fixes scroll issues