diff --git a/src/lib/updating-element.ts b/src/lib/updating-element.ts index cd8ac8bc..882c8729 100644 --- a/src/lib/updating-element.ts +++ b/src/lib/updating-element.ts @@ -581,14 +581,16 @@ export abstract class UpdatingElement extends HTMLElement { requestUpdate(name?: PropertyKey, oldValue?: unknown) { let shouldRequestUpdate = true; // if we have a property key, perform property update steps. - if (name !== undefined && !this._changedProperties.has(name)) { + if (name !== undefined) { const ctor = this.constructor as typeof UpdatingElement; const options = ctor._classProperties!.get(name) || defaultPropertyDeclaration; if (ctor._valueHasChanged( this[name as keyof this], oldValue, options.hasChanged)) { - // track old value when changing. - this._changedProperties.set(name, oldValue); + if (!this._changedProperties.has(name)) { + // track old value when changing. + this._changedProperties.set(name, oldValue); + } // add to reflecting properties set if (options.reflect === true && !(this._updateState & STATE_IS_REFLECTING_TO_PROPERTY)) { @@ -596,6 +598,8 @@ export abstract class UpdatingElement extends HTMLElement { this._reflectingProperties = new Map(); } this._reflectingProperties.set(name, options); + } else if (this._reflectingProperties && this._reflectingProperties.has(name)) { + this._reflectingProperties.delete(name); } // abort the request if the property should not be considered changed. } else { diff --git a/src/test/lib/updating-element_test.ts b/src/test/lib/updating-element_test.ts index 8daa277f..ac63e66b 100644 --- a/src/test/lib/updating-element_test.ts +++ b/src/test/lib/updating-element_test.ts @@ -729,7 +729,7 @@ suite('UpdatingElement', () => { assert.equal(el.getAttribute('custom'), '3'); assert.equal(el.fromAttribute, 6); assert.equal(el.toAttribute, '7'); - assert.equal(el.getAttribute('toattribute'), '7-attr'); + assert.equal(el.getAttribute('toattribute'), '7'); assert.equal(el.all, 11); assert.equal(el.getAttribute('all-attr'), '11-attr'); assert.deepEqual(el.obj, {foo: true, bar: 5, baz: 'hi'}); @@ -2219,4 +2219,37 @@ suite('UpdatingElement', () => { await a.updateComplete; assert.equal(a.updatedCalledCount, 1); }); + + test('attribute change after a property change', async () => { + class E extends UpdatingElement { + static get properties() { + return { + disabled: { + type: Boolean, + reflect: true, + attribute: true + } + }; + } + disabled = false; + } + const name = generateElementName(); + customElements.define(name, E); + container.innerHTML = `<${name}>`; + const el = container.firstChild as E; + await el.updateComplete; + el.setAttribute('disabled', ''); + el.removeAttribute('disabled'); + el.disabled = true; + await el.updateComplete; + assert.isTrue(el.disabled); + assert.isTrue(el.hasAttribute('disabled')); + el.disabled = false; + await el.updateComplete; + el.setAttribute('disabled', ''); + el.disabled = false; + await el.updateComplete; + assert.isFalse(el.disabled); + assert.isFalse(el.hasAttribute('disabled')); + }); });