diff --git a/src/internal/webawesome-element.ts b/src/internal/webawesome-element.ts index a3f3d2384..7bbaf4773 100644 --- a/src/internal/webawesome-element.ts +++ b/src/internal/webawesome-element.ts @@ -10,35 +10,24 @@ export default class WebAwesomeElement extends LitElement { @property({ type: Boolean, reflect: true, attribute: 'did-ssr' }) didSSR = isServer || Boolean(this.shadowRoot); + #hasRecordedInitialProperties = true + // Store the constructor value of all `static properties = {}` - constructorProperties: Map = new Map(); + initialReflectedProperties: Map = new Map(); - constructor() { - super(); - - // queueMicrotask so that we wait until any subclasses finish their constructors and *then* we record the initial properties. - queueMicrotask(() => { - (this.constructor as typeof WebAwesomeElement).elementProperties.forEach((obj, prop) => { - // @ts-expect-error Leave me alone. + attributeChangedCallback (name: string, oldValue: string | null, newValue: string | null) { + if (!this.#hasRecordedInitialProperties) { + (this.constructor as typeof WebAwesomeElement).elementProperties.forEach((obj, prop: keyof typeof this & string) => { // eslint-disable-next-line if (obj.reflect && this[prop] != null) { - // @ts-expect-error Leave me alone. - this.constructorProperties.set(prop, this[prop]); + this.initialReflectedProperties.set(prop, this[prop]); } - }); - }); - } - protected willUpdate(changedProperties: Parameters[0]) { - super.willUpdate(changedProperties); - this.constructorProperties.forEach((value, prop) => { - // If a prop changes to `null`, we assume this happens via an attribute changing to `null`. - // @ts-expect-error leave me alone - // eslint-disable-next-line - if (changedProperties.has(prop) && this[prop] == null) { - // @ts-expect-error leave me alone - this[prop] = value; - } - }); + }) + + this.#hasRecordedInitialProperties = true + } + + super.attributeChangedCallback(name, oldValue, newValue) } protected firstUpdated(changedProperties: Parameters[0]): void {