Comment by c-smile

All this is over-engineered IMO.

It is just enough to add support of behavior property to CSS:

      my-toggler {
         display:block;
         behavior: MyToggler url(my-components.js);
      }

As soon as browser will see <my-toggler /> in markup it will call function MyToggler() with 'this' set to the element in file my-components.js. That's what I did in my Sciter[1]. It was proven as quite useful and easily understandable yet implementable in 100 lines or so of native code.

The value of shadow DOM is also quite doubtful to be honest. It is shadowed from whom and for what purpose? User don't care about DOM structure ... Programmers? They are OK with that.

[1] http://sciter.com