Find invisible elements

by mgiuffrida

HTML

<div>
  <div hidden>
    <link>
    <span>
</span>
  </div>
</div>

JavaScript

var isNonMeta = function(el) {
  return ['STYLE', 'LINK', 'SCRIPT', 'TEMPLATE', 'DOM-MODULE', 'CONTENT', 'path', 'g'].indexOf(el.tagName) == -1;
};
var isVisible = function(el) {
  return el.offsetParent;
};

var els = Array.from(document.body.querySelectorAll('*, * /deep/ *'));
var nonMetaEls = els.filter(isNonMeta);

console.log('Elements: ' + els.length);
console.log('Non-meta elements: ' + nonMetaEls.length);
console.log('Visible non-meta elements: ' + nonMetaEls.filter(isVisible).length);
console.log('Invisible non-meta elements: ' + nonMetaEls.filter(a => !isVisible(a)).length);