Skip to main content
","learningResourceType":"Practice problem","educationalLevel":"hard","about":"HTML","teaches":"observedAttributes","url":"https://journeyuncommon.com/quiz/question/7cbfbf9e-7424-4fa8-9912-1229d2d9cd11","inLanguage":"en","isAccessibleForFree":true,"provider":{"@id":"https://journeyuncommon.com/#organization"},"isPartOf":{"@type":"WebSite","@id":"https://journeyuncommon.com/#website","name":"Journey Uncommon","url":"https://journeyuncommon.com"}}
Journey Uncommon Logo
JourneyUncommon
hardHTMLobservedAttributesSingle-choice MCQ

Why does attributeChangedCallback fire for attributes already present on a custom element when it is upgraded, but only for observed ones?

<x-el data-a="1" data-b="2"></x-el> <script> customElements.define('x-el', class extends HTMLElement { static observedAttributes = ['data-a']; attributeChangedCallback(n, o, v) { console.log(n, o, v); } }); </script>