Re: [Custom Elements] They are globals.

> On Apr 11, 2016, at 2:29 PM, /#!/JoePea <trusktr@gmail.com> wrote:
> 
> What if custom elements can be registered on a shadow-root basis, so
> that the author of a Custom Element (one that isn't registered by
> default) can register a bunch of elements that it's shadow root will
> use, passing constructors that the author code may have imported from
> anywhere. Then that same author simply exports the custom element
> (does not register it) for a following author to use. The following
> author would import that custom element, then register it with the
> shadow roots of his/her new custom elements, and thus the cycle
> continues, with registered elements defined on shadow roots on a
> per-custom-element basis, without those elements ever being registered
> to some global registry.
> 
> ```
> // library code
> import SomeClass from './somewhere'
> 
> export default
> class AuthorElement extends HTMLElement {
>    constructor() {
>        this.shadowRoot.defineElement(
>            'authors-should-call-this-anything-they-want',
>            SomeClass
>        )
>        // ...
>    }
> }
> ```

Now, let's say you do "new SomeClass" now, and SomeClass is defined as follows:

```js
class SomeClass extends HTMLElement {
    constructor()
    {
        super(); // (1)
    }
}
```

When HTMLElement's constructor is involved in (1), it needs to construct an element by the name of "authors-should-call-this-anything-they-want".  However, it has no idea to which shadow root or document it belongs.  The fundamental here is that any construction of new element now needs to specify the shadow root or document for which it is created so simple "new SomeClass" would not work.  You'd have to instead write it as "new SomeClass(this.shadowRoot)" and then (1) needs to be modified as: `super(..arguments)` to pass the argument along to the HTMLElement constructor.

- R. Niwa

Received on Monday, 11 April 2016 23:45:27 UTC