Re: [w3c/webcomponents] Shadow tree encapsulation and CSS (#804)

What constitutes "CSS and Selectors violate the encapsulation principles"? 

Because it seems to me that the `:focus`/`:focus-within` doesn't really violate encapsulation as in order for `:focus`/`:focus-within` to detect a shadow root you actually need to add a `:focus`-able element inside the tree within the Shadow root for this to occur.

Similarly can't we detect *all* shadow roots with *no default slot* simply by appending a child with size to an element we want to check? If the CSSOM is different than what we expected (e.g. `clientWidth`, `getComputedStyle`, etc) then there's a shadow root.

Example of detecting shadow roots without a default slot:

```html
<!doctype html>

<div id="hasShadowRoot"></div>
<div id="hasNoShadowRoot"></div>

<script>
  const shadowRoot = hasShadowRoot.attachShadow({ mode: 'closed' });

  function doesHaveShadowRoot(el) {
    if (!el.isConnected) {
      document.body.appendChild(el)
    }
    const child = document.createElement('div');
    child.style.width = '10px';
    child.style.height = '10px';

    document.body.appendChild(child);
    const {
      clientHeight: predictedHeight,
      clientWidth: predictedWidth,
    } = child;

    el.appendChild(child);
    const {
      clientHeight: realHeight,
      clientWidth: realWidth,
    } = child;

    if (predictedHeight !== realHeight || predictedWidth !== realWidth) {
      return 'definitely has shadow root'
    }
    return 'not sure if has shadow root'
  }

  document.body.insertAdjacentHTML('beforeend', `
    hasShadowRoot: ${ doesHaveShadowRoot(hasShadowRoot) }
    <br>
    hasNoShadowRoot: ${ doesHaveShadowRoot(hasNoShadowRoot) }
  `)
</script>
```

It seems to me that the only shadow roots that can be truly encapsulated from detection are those that don't affect layout in any way.

-- 
You are receiving this because you are subscribed to this thread.
Reply to this email directly or view it on GitHub:
https://github.com/w3c/webcomponents/issues/804#issuecomment-483548529

Received on Tuesday, 16 April 2019 07:43:10 UTC