diff --git a/test/test-computed-properties.js b/test/test-computed-properties.js index a4453bf..869590d 100644 --- a/test/test-computed-properties.js +++ b/test/test-computed-properties.js @@ -213,6 +213,19 @@ it('does correct NaN checking', () => { assert(el.count === count); }); +it('resets compute validity on initialization to catch upgrade edge cases with internal, computed properties', () => { + const el = document.createElement('test-element'); + el.setAttribute('a', '1'); + el.setAttribute('b', '2'); + assert(el.a === undefined); + assert(el.b === undefined); + assert(Number.isNaN(el.internal.c)); + document.body.append(el); + assert(el.a === 1); + assert(el.b === 2); + assert(el.internal.c === 3); +}); + it('cannot be written to from host', () => { const el = document.createElement('test-element'); document.body.append(el); diff --git a/x-element.js b/x-element.js index 1af8cad..441ee4b 100644 --- a/x-element.js +++ b/x-element.js @@ -646,7 +646,7 @@ export default class XElement extends HTMLElement { static #initializeHost(host) { const hostInfo = XElement.#hosts.get(host); - const { initialized, invalidProperties } = hostInfo; + const { computeMap, initialized, invalidProperties } = hostInfo; if (initialized === false) { XElement.#upgradeOwnProperties(host); // Only reflect attributes when the element is connected. @@ -661,6 +661,9 @@ export default class XElement extends HTMLElement { XElement.#setPropertyValue(host, property, property.default(host, property.initial())); } invalidProperties.add(property); + if (property.compute) { + computeMap.get(property).valid = false; + } } hostInfo.initialized = true; return true;