Как понять что элемент скрыт

В CSS элемент считается скрытым, если:

1. У него display: none – элемент не занимает место в DOM
2. У него visibility: hidden – элемент занимает место, но невидим
3. У него opacity: 0 – элемент полностью прозрачен
4. Ширина/высота равны 0 (width: 0; height: 0)
5. Элемент находится за пределами видимой области (overflow: hidden + смещение)

Проверить видимость можно так:

const isHidden = (el) => {
  return !el || 
    el.offsetParent === null || 
    el.style.display === 'none' || 
    el.style.visibility === 'hidden' || 
    el.getBoundingClientRect().width === 0;
};