Re: [w3c/webcomponents] Scoped Custom Element Registries (#716)

I have thought some about this. If we want to be able to override elements without a hyphen, two things stand out to me:

- Scoping of registries will be very confusing.
- Shadow roots seem like a much better place than on element instances.

So I propose two APIs (that work together) to do this.

## In an option when creating a shadow root

This will allow for optimizations, be pleasant to use and ensure that builtin elements are never rendered before elements are upgraded. I'm not against having this be the only way to override builtin elements.

(This part of the proposal could be added as a follow-up proposal.)

```javascript
const shadow = element.attachShadow({
  mode: 'open',
  customElements: {
    'ul': MyUl,
    'li': MyLi,
    'my-element': MyElement
  }
})
```

## ShadowRoot instances should each have a customElements registry

We can use `ShadowRoot#customElements` in the exact same way as `window.customElements`.

```javascript
shadow.customElements.define(
  'another-element',
  class extends HTMLElement { ... }
)
```

## Registries should not bleed through slots and shadow roots

It would be very confusing to have `<ul></ul>` not be the builtin element unless explicitly specified. It could also affect the performance of deeply nested shadow roots.

-- 
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/716#issuecomment-460928103