Today, my colleague Freek asked for help embedding the webview of an email campaign in an iframe. He needed it in an iframe because embedding the HTML directly caused layout issues because the website’s CSS clashed with it.
We’re going to build an embedded-webview component with an html attribute that contains a full (escaped HTML) webpage.
Finally, we enable the shadow DOM with attachShadow and dump the HTML we want to embed in the shadow root. For more shadow DOM shananigans, we could take this further and have it pull in an external HTML page with the fetch API.