Skate + ShadyCSS <custom-style>issue - native ShadowDom Browsers

[Hotell]

<custom-style> element from ShadyCSS throws error with skate-web-components polyfill within browsers that implements shadow dom ( Chrome ... )

It throws during parsing

shadycss.min.js?6d2b:2481 Uncaught TypeError: Illegal invocation
    at HTMLElement.w._findStyle (shadycss.min.js?6d2b:2481)
    at Function.w.findStyles (shadycss.min.js?6d2b:2452)
    at Object.applyStyle (shadycss.min.js?6d2b:2128)
    at Object.updateStyles (shadycss.min.js?6d2b:2256)
    at shadycss.min.js?6d2b:2402

DEMO (with skate-web-components): http://codepen.io/Hotell/pen/VPbdGo?editors=1010

Although if polyfills are used separately, it works

DEMO (with webcomponents/@ polyfills) : http://codepen.io/Hotell/pen/ygbjRO?editors=1010

[treshugart]

Possibly an issue with using very old commits. Updating now to see if that fixes things. Your pen ws using master (and not including the native-shim).

[treshugart]

Once they release, I we can set the dep versions to * and not have to do this dance anymore.

[Hotell]

great! thanks!

[treshugart]

Updated both pens:

• http://codepen.io/treshugart/pen/rjmZZW?editors=1010
• http://codepen.io/treshugart/pen/rjmZwe?editors=1010

There was an issue with the @ one where you needed to drop babel transpilation for CE's to work in native. I had issues when using the native-shim with Babel. Not sure why.

[Hotell]

great, no errors. Closed by https://github.com/skatejs/web-components/releases/tag/v5.0.2

[Hotell]

hmm but still. With Raw polyfills, contents of custom-style are transformed correctly

from .hello{ color: red } to .hello:not(.style-scope) { color: red; }

although with skate polyfills, there is no transformation at all :-|

[treshugart]

That's really interesting. We should look into this. If I reverse the inclusion order of Shady DOM / CSS so CSS comes first when loading the @ fills directly, then I get the same behaviour. I wonder if somehow DOM is not coming before CSS even though we're using require() in order.

[treshugart]

Had to fix the entry points we were importing as the polyfills have different conventions for each repo. This is a result of them not publishing unminified sources as we have to consume unminified sources so we can create our bundles. Raised an issue in https://github.com/webcomponents/custom-elements/issues/45 to see if we can address that.