fix(form): native submit event should not trigger an error

This commit is contained in:
Thomas Allmer 2019-05-15 11:14:17 +02:00 committed by Thomas Allmer
parent 8cc1a8a287
commit f2c4433138
3 changed files with 28 additions and 5 deletions

View file

@ -39,6 +39,7 @@
"@lion/textarea": "^0.1.8",
"@lion/validate": "^0.1.8",
"@open-wc/demoing-storybook": "^0.2.0",
"@open-wc/testing": "^0.11.1"
"@open-wc/testing": "^0.11.1",
"sinon": "^7.2.2"
}
}

View file

@ -18,16 +18,22 @@ export class LionForm extends DelegateMixin(LionFieldset) {
};
}
constructor() {
super();
this.__boundSubmit = this._submit.bind(this);
this.__boundReset = this._reset.bind(this);
}
connectedCallback() {
super.connectedCallback();
this.addEventListener('submit', this._submit);
this.addEventListener('reset', this._reset);
this.addEventListener('submit', this.__boundSubmit);
this.addEventListener('reset', this.__boundReset);
}
disconnectedCallback() {
super.disconnectedCallback();
this.removeEventListener('submit', this._submit);
this.removeEventListener('reset', this._reset);
this.removeEventListener('submit', this.__boundSubmit);
this.removeEventListener('reset', this.__boundReset);
}
get formElement() {

View file

@ -1,4 +1,5 @@
import { expect, fixture, html } from '@open-wc/testing';
import { spy } from 'sinon';
import '@lion/input/lion-input.js';
import '@lion/fieldset/lion-fieldset.js';
@ -37,4 +38,19 @@ describe('<lion-form>', () => {
firstName: 'Foo',
});
});
it('works with the native submit event (triggered via a button)', async () => {
const submitSpy = spy();
const el = await fixture(html`
<lion-form @submit=${submitSpy}>
<form>
<button type="submit">submit</button>
</form>
</lion-form>
`);
const button = el.querySelector('button');
button.click();
expect(submitSpy.callCount).to.equal(1);
});
});