This note has an interactive demo. Try it in the original

Two libraries can now define the same custom element name on one page without breaking each other. Scoped custom element registries became Baseline on 27 October 2026, when Firefox 159 shipped them. Chrome and Edge 146 and Safari 26 already had them.

The problem: one name, one page

Every custom element you've ever registered went into the same place: window.customElements , the global registry. Names in it have to be unique across the whole page. MDN describes the result: if two libraries both try to define <my-button> , one of them fails.

You can see it in the demo above. Switch it to "Global registry": Ember UI calls customElements.define('ui-button', …) first and wins. When Tide UI tries the same thing, the browser throws a NotSupportedError , and the log shows the real message from your browser. Tide UI's button then renders with Ember UI's class, because there's only one ui-button on the page.…