Re: [webcomponents] [Shadow] activeElement behavior seems to break encapsulation (#358)

My point is that we should be extremely careful to give the existing API yet another meaning.

- If there is a *necessary* reason, we should do it.

  A good instance is: `document.activeElement -> x-foo` in 4-a in https://github.com/w3c/webcomponents/issues/358#issuecomment-168970241
  This is necessary to explain a built-in element which uses a shadow tree or an element which uses a an user-created closed shadow tree behind the scenes.

- If the only reason is *The Change Looks Useful*, we should refrain from changing the meaning of the existing API. Even when we are to change the meaning of existing APIs, the change might not be a local effect. That's the reason I asked a concrete proposal to evaluate the effects of a proposal.

Okay, I've added how `:focus` pseudo class works in option B).

1. When focusable1 is focused:
    - a) document.activeElement -> focusable1
    - b) x-foo.shadowRoot.activeElement -> null
    - c) :focus pseudo class can be applied to:
        - in a document tree:  focusable1
        - in a shadow tree: none

2. When focusable2 is focused:
    - a) document.activeElement -> focusable2
    - b) x-foo.shadowRoot.activeElement -> null
    - c) :focus pseudo class can be applied to:
        - in a document tree:  focusable2
        - in a shadow tree: none

3. focusable3 can not be focused. Let's skip this case.

4. When focusable4 is focused:
    - a) document.activeElement -> x-foo
    - b) x-foo.shadowRoot.activeElement -> focusable4
    - c) :focus pseudo class can be applied to:
        - in a document tree:  x-foo
        - in a shadow tree: focusable4

My proposal follows the following rules:

- If shadowRoot.activeElement is null, ':focus' is never applied to the shadow host. In other words, if shadowRoot.activeElement is non-null, ':focus' can be applied to the shadow host, always.
- activeElement is always guaranteed to be a focusable element. Thus,
```javascript
const previousFocusedElement = shadowRoot.activeElement;
....
previousFocusedElement.focus();  // This makes sure that previousFocusedElement gets focused again.
```
I did not realize that the fallback contents of a canvas is an exception, but I do not think we should spread out such a bad citizen any more.

I appreciate if some one give us a concrete proposal other than option B, so that we can compare proposals in a broader perspective.


---
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/358#issuecomment-202225275