webcomponents / webcomponents/custom-elements-everywhere
Add a test that attributes added in custom elements aren't removed by the framework
- Dominant language
- JavaScript
- Stars
- 1.3k
- Forks
- 108
- PR merge metrics
- No merged PRs in 30d
Description
It's been brought to my attention that Svelte removes attributes on elements [when it "claims" them](https://github.com/sveltejs/svelte/blob/967e9f51ff649f776fa034db8aba23a5a1546294/src/runtime/internal/dom.ts#L450-L456), so a custom element that adds itself some attributes will have them removed by Svelte at some point. This would be the case for example for ARIA attributes or custom attributes added to emulate custom states for styling, pending global support for `ElementInternals` and `CustomStateSet` (e.g. using https://github.com/calebdwilliams/element-internals-polyfill).
To reproduce, paste the following code in the Svelte REPL at https://svelte.dev/repl, then inspect the rendered DOM:
```svelte
let name = 'world';
class FooBarElement extends HTMLElement {
constructor() {
super();
}
connectedCallback() {
this.ariaLabel = "foo";
this.setAttribute("state--foo", "bar");
}
}
customElements.define("foo-bar", FooBarElement)
Hello {name}!
```
Contributor guide
No contributing guide indexed for this repository
Assessment
This issue has not been assessed yet.