ayo/lion
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge pull request #80 from ing-bank/fix/edgeFormRegistration

Browse source 
Fix form registration in Edge (fixes #50)
This commit is contained in:
Mikhail Bashkirov 2019-05-29 11:32:20 +02:00 committed by GitHub
commit a3c526c6c2
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 11 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
packages/field/src/FormControlMixin.js
View file

@ -145,7 +145,7 @@ export const FormControlMixin = dedupeMixin(
* will requires a `await nextFrame()` in tests * will requires a `await nextFrame()` in tests
*/ */
_registerFormElement() { _registerFormElement() {
requestAnimationFrame(() => { this.updateComplete.then(() => {
this.dispatchEvent( this.dispatchEvent(
new CustomEvent('form-element-register', { new CustomEvent('form-element-register', {
detail: { element: this }, detail: { element: this },
@ -164,7 +164,7 @@ export const FormControlMixin = dedupeMixin(
* @see {@link this._registerFormElement} * @see {@link this._registerFormElement}
*/ */
_requestParentFormGroupUpdateOfResetModelValue() { _requestParentFormGroupUpdateOfResetModelValue() {
requestAnimationFrame(() => { this.updateComplete.then(() => {
if (this.__parentFormGroup) { if (this.__parentFormGroup) {
this.__parentFormGroup._updateResetModelValue(); this.__parentFormGroup._updateResetModelValue();
} }

14
packages/fieldset/test/lion-fieldset.test.js
View file

@ -518,7 +518,8 @@ describe('<lion-fieldset>', () => {
<lion-input id="firstName" name="firstName" .modelValue="${'Foo'}"></lion-input> <lion-input id="firstName" name="firstName" .modelValue="${'Foo'}"></lion-input>
</lion-fieldset> </lion-fieldset>
`); `);
await nextFrame(); await el.querySelector('lion-input').updateComplete;
const input = el.querySelector('#firstName'); const input = el.querySelector('#firstName');
input.modelValue = 'Bar'; input.modelValue = 'Bar';
@ -536,7 +537,8 @@ describe('<lion-fieldset>', () => {
<lion-input id="firstName" name="firstName[]" .modelValue="${'Foo'}"></lion-input> <lion-input id="firstName" name="firstName[]" .modelValue="${'Foo'}"></lion-input>
</lion-fieldset> </lion-fieldset>
`); `);
await nextFrame(); await el.querySelector('lion-input').updateComplete;
const input = el.querySelector('#firstName'); const input = el.querySelector('#firstName');
input.modelValue = 'Bar'; input.modelValue = 'Bar';
@ -556,9 +558,11 @@ describe('<lion-fieldset>', () => {
</lion-fieldset> </lion-fieldset>
</lion-fieldset> </lion-fieldset>
`); `);
// 2 times as we are nested here await Promise.all([
await nextFrame(); el.querySelector('lion-fieldset').updateComplete,
await nextFrame(); el.querySelector('lion-input').updateComplete,
]);
const input = el.querySelector('#firstName'); const input = el.querySelector('#firstName');
const nestedFieldset = el.querySelector('#name'); const nestedFieldset = el.querySelector('#name');