DEV Community

Discussion on: The Web Components journey: wrong ways, lacking parts and promising paths

Collapse
 
ashubham profile image
Ashish Shubham

We have recently started a POC for using LitElement for our huge enterprise Web app. One problem, I am facing initially tooling wise is Chrome Dev tool's inability to alter CSS within shadow Root on the fly.

Its really helpful to be able to experiment with CSS right in the browser, with Web Components that flexibility seems to be taken away which I think is a bummer. And this one for a change does not require browser consensus :)

Collapse
 
webpadawan profile image
Serhii Kulykov • Edited

There is an issue to fix that already so I hope it would be resolved in future:
bugs.chromium.org/p/chromium/issue...

In the meanwhile, you can workaround that using delete Document.prototype.adoptedStyleSheets.

When called prior to loading LitElement, this will make it act like the feature does not exist and place style elements into the shadowRoot (same as Firefox and Safari).