webcomponents / webcomponents/polyfills

[scoped-custom-element-registry] Attr nodes do not trigger the attributeChangedCallback

Open
#560 1 comment 0 reactions 0 assignees View on GitHub
Focus Area: Standards & Polyfills Type: Bug
Dominant language
HTML
Stars
1.2k
Forks
168
PR merge metrics
No merged PRs in 30d

Description

### Description
When the polyfill is active, creating and adding an `Attr` node to an element, changing an existing `Attr` node, or removing an `Attr` node from an element does not trigger the `attributeChangedCallback`.
When the polyfill is not active, these modifications do trigger the `attributeChangedCallback`.

This does not just influence custom elements using the scoped registry, but _all_ custom elements on the page. Therefore, loading the polyfill could break unrelated code.

### Example
```html







customElements.define('my-element', class MyElement extends HTMLElement {
static get observedAttributes() {
return ['param'];
}

attributeChangedCallback(name, oldValue, newValue) {
console.log('attributeChangedCallback', { name, oldValue, newValue });
}
});

const element = document.createElement('my-element');
const attr = document.createAttribute('param');
attr.value = 'Initial value';

// This should log adding the attribute
element.setAttributeNode(attr);

// This should log changing the attribute
attr.value = 'New value';

// This should log changing the attribute
element.getAttributeNode('param').value = 'Another value';

for (const node of element.attributes) {
if (node.nodeName === 'param') {
// This should log changing the attribute
node.value = 'Value from for-loop';
}
}

// This should log removing the attribute
element.removeAttributeNode(attr);

```
I have also created a number of tests demonstrating this behavior in this patch file: [attributeNode-tests.txt](https://github.com/webcomponents/polyfills/files/12409433/attributeNode-tests.txt).

#### Expected behavior
Modifications to an Element's observed Attr nodes should trigger the attributeChangedCallback.

#### Actual behavior
Modifications to an Element's observed Attr nodes do not trigger the attributeChangedCallback.

### Version
0.0.9

### Browsers affected

- [x] Chrome
- [x] Firefox
- [x] Edge
- [ ] Safari
- [ ] IE 11

(only browsers I could test)

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.