Se definirmos uma propriedade como esta em um color-spanelemento personalizado:
static get observedAttributes() {
return ['bgc'];
}
E obter uma referência a uma instância como essa e, ao mesmo tempo, alterar a propriedade bgc, isso deve fazer com que o attributeChangedCallbackseja disparado?
const colorSpan = document.querySelector('color-span');
console.log(colorSpan);
colorSpan.bgc = 'BLUE';
Eu testei nesta demonstração e ele não dispara, então eu só queria confirmar meu entendimento de que ele attributeChangedCallbacksó disparará quando um atributo for definido declarativamente assim:
<color-span bgc="RED">Hello From Color Span</color-span>
Não é uma propriedade, é um atributo, e sim definido como observedAttribute eles disparam o attributeChangedCallback, tanto na instanciação do Web Component (se o atributo for declarado no Web Component e o DOM analisar) e sempre que o atributo for definido no Web Component