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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<script src="https://unpkg.com/@webcomponents/scoped-custom-element-registry@0.0.9/src/scoped-custom-element-registry.js"></script>
</head>
<body>
<script>
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);
</script>
</body>
</html>
I have also created a number of tests demonstrating this behavior in this patch file: 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.
Description
When the polyfill is active, creating and adding an
Attr
node to an element, changing an existingAttr
node, or removing anAttr
node from an element does not trigger theattributeChangedCallback
. When the polyfill is not active, these modifications do trigger theattributeChangedCallback
.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
I have also created a number of tests demonstrating this behavior in this patch file: 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
(only browsers I could test)