Skip to main content
","learningResourceType":"Practice problem","educationalLevel":"hard","about":"HTML","teaches":"observedAttributes","url":"https://journeyuncommon.com/quiz/question/d9f37992-a1be-456c-b7f4-d3d7d389540e","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

An element is upgraded after being parsed with attributes already present in the markup. How does the upgrade algorithm handle `attributeChangedCallback` for those pre-existing observed attributes?

<x-el foo="a" bar="b"></x-el> <script> // defined AFTER the element already exists in the tree class X extends HTMLElement { static get observedAttributes() { return ['foo']; } attributeChangedCallback(n,o,v){ console.log(n,o,v); } } customElements.define('x-el', X); </script>