demoed https://www.webkit.org/blog/4096/introducing-shadow-dom-api/ on jsfiddle.net using a ToT WebKit build[[BR]] css selectors have scope now[[BR]] you can have nested shadow trees[[BR]] slots leave “holes” in the shadow tree that will connect to nodes in the containing DOM tree[[BR]] :host doesn’t do anything if it’s not in a shadow tree[[BR]] [[BR]] defineCustomElement uses ES6 classes like HTMLTagNames.in and HTMLElementFactory.cpp[[BR]] lifecycle callbacks called when exiting from user agent code[[BR]] check every idl call to see if it modifies the DOM to do this callback[[BR]] should the HTML5 spec have this annotation on all specs?[[BR]] [[BR]] Questions:[[BR]] dbates: could someone using the shadow dom specify which elements should be styled using the style of the containing page?[[BR]] http://tabatkins.github.io/specs/css-apply-rule/#example-ded67f3a[[BR]] use css variables[[BR]] :root { —toolbar-theme: hsl(120, 70%, 95%); }[[BR]] .toolbar { —background-color: var(—toolbar-theme) }[[BR]] what if you want many toolbars on a page and all of them to have different colors?[[BR]] outside shadow dom[[BR]] #nav my-toolbar { —toolbar-theme: red; }[[BR]] #sidebar my-toolbar { —toolbar-theme: blue; }[[BR]] inside shadow dom[[BR]] .toolbar { background-color: var(—toolbar-theme); }[[BR]] what if you want to have toolbars within toolbars with different colors? not possible with currently proposed api.[[BR]] html imports - scripts inside imported scripts apply as if they were in the document that imported them - confusing[[BR]] interaction with es6 modules unclear[[BR]] loading inline script type=module should maybe also be asynchronous[[BR]] allowing inline modules - not at all - maybe load as if they were loaded asynchronously, but not proposed[[BR]]