diff --git a/src/index.js b/src/index.js index 42318d7..a280b74 100644 --- a/src/index.js +++ b/src/index.js @@ -28,6 +28,7 @@ export default function register(Component, tagName, propNames, options) { }, set(v) { if (this._vdom) { + this._props[name] = v; this.attributeChangedCallback(name, null, v); } else { if (!this._props) this._props = {}; diff --git a/src/index.test.jsx b/src/index.test.jsx index 00da646..7e71935 100644 --- a/src/index.test.jsx +++ b/src/index.test.jsx @@ -130,6 +130,33 @@ describe('web components', () => { }); assert.equal(other, 1); }); + + it('sets complex property after other property', () => { + const el = document.createElement('x-dummy-button'); + + // set simple property first + el.text = 'click me'; + + let clicks = 0; + const onClick = () => clicks++; + el.onClick = onClick; + + assert.equal(el.text, 'click me'); + assert.equal(el.onClick, onClick); + + root.appendChild(el); + assert.equal( + root.innerHTML, + '' + ); + + act(() => { + el.querySelector('button').click(); + }); + + assert.equal(el.onClick, onClick); + assert.equal(clicks, 1); + }); }); function Foo({ text, children }) {