Trying to make an extension that inserts an overlay over the entire page, making it more grey colored, but so that you can still see the page. However there are some pages that have shadow DOM's that interfere with the insertion process and leave a chunk of white space at the top of the page.
Currently I'm attaching the modal element onto the body tag of the document, and just copying all the page's html into the element. I want it to work on all pages, so I'd prefer to just somehow ignore the Shadow tree.
var context = { website: hostname, baseUrl: baseUrl };
var html = template(context);
var el = document.createElement('div');
el.ierHTML = html;
el.style.position = 'fixed';
el.style.display = 'none';
el.style.zIndex = '10000';
el.className = 'my-overlay';
document.body.insertBefore(el, document.body.firstChild);