Re: [w3ctag/design-reviews] Constructable Stylesheets (#308)

> Talking to @plinss, I now see the reason for this, but it is something we need web component authors to use and adopt when creating their custom elements, so I think it would be great if you could show a full example on how this would work in the explainer - basically showing the developer experience for using this feature

By full example, do you mean adding something like 

```js
const style = new CSSStyleSheet();
style.replace(":host { color: red; }");
class MyElement extends HTMLElement {
  constructor() {
    super();
    const shadowRoot = this.attachShadow({mode: 'open'});
    shadowRoot.adoptedStyleSheets = [style];
  }
};
```
vs the old way?
```js
class MyElement extends HTMLElement {
  constructor() {
    super();
    const shadowRoot = this.attachShadow({mode: 'open'});
    shadowRoot.innerHTML = '<style>:host { color: red; }</style>';
  }
};
```

-- 
You are receiving this because you are subscribed to this thread.
Reply to this email directly or view it on GitHub:
https://github.com/w3ctag/design-reviews/issues/308#issuecomment-440556312