replacing SLOT before it is executed in dom?

[sashafirsov]

Say <show-source> web component meant to display the HTML as text which located within its body:

    <show-source>
         <style> h3{color:red} </style>
         <h3>Should be in red</h3>
    </show-source>

With async web component loading the UA of course will run css from content making all H3 red. But if the component declaration will be inline and available when UA is rendering <show-source> its code would not populate the embedded dom, replacing it with rendered text instead.

Q1. What events would permit to cut-off the inner dom before it is executed by UA?
Q2. What events would allow to interrupt the setting of innerHTML or inner dom injection making the substitution possible in run time?

Asking here as the question could become an enhancement request.

[annevk]

What does executed mean here?

[sashafirsov]

CSS rule from within content is applied in page scope.

[annevk]

I guess you can track when the elements get inserted. At that point they'll likely be rendered at the next animation frame.

[sashafirsov]

Is there some kind of flag not to render/execute content even if DOM is present?
Something like display:none but also applied to css and scripts in sub-dom.
The shadow dom is kind of like that.

[annevk]

<template> I suppose.

[annevk]

Anyway, I think it'd be best if you took this to Stack Overflow or an equivalent forum at this point. Hope this helped.