Re: [whatwg/dom] Declarative Shadow DOM (#831)

> Interested in what the fall back is for browsers for who don't support DSD?

@kaleidawave DSD as proposed, and what's implemented in Chrome (currently behind a flag) is that it uses `<template>`, this means it'll simply render nothing, e.g. this is DSD:

```js
<style>
  /* This styles nothing, with or without DSD */
  #foo {
      color: red;
  }
</style>

<div>
  <template shadowroot="open">
    <style>
      #foo { color: blue; }
    </style>
    <p id="foo">Hello DSD!</p>
  </template>
</div>
```

Although I suppose if you use slots then the light DOM children will be rendered (@mfreed7 has this been considered before?). I suppose this might be a problem for some use cases while not all browsers support DSD. Once they do though this will be a non-problem e.g.:

```js
<my-element>
  <template shadowroot="open">
    <slot></slot>
  </template>
  <p>This will be rendered</p>
</my-element>
```

If you wanna disable rendering of light dom children with DSD in browsers that don't support it you could still match it with selectors (for custom elements this is as simple as `:not(:defined) > * { display: none; }`).

-- 
You are receiving this because you are subscribed to this thread.
Reply to this email directly or view it on GitHub:
https://github.com/whatwg/dom/issues/831#issuecomment-769559449

Received on Friday, 29 January 2021 04:02:00 UTC