From f6319b69b3367c2a4e9d457c09e651c82eab4db1 Mon Sep 17 00:00:00 2001 From: Sergei Maertens Date: Sun, 17 Nov 2024 21:29:03 +0100 Subject: [PATCH] :alien: [#724] Vitest doesn't support the done callback Instead, the most elegant way to handle this is to use async/await syntax. --- .../formio/components/currency.spec.js | 41 ++--- src/jstests/formio/components/date.spec.js | 20 +-- src/jstests/formio/components/file.spec.js | 83 ++++------ .../formio/components/ibanfield.spec.js | 100 +++++------- .../formio/components/licenseplate.spec.js | 60 +++---- src/jstests/formio/components/map.spec.js | 10 +- src/jstests/formio/components/number.spec.js | 24 ++- .../formio/components/textfield.spec.js | 153 +++++++----------- src/jstests/formio/components/time.spec.js | 130 ++++++--------- 9 files changed, 239 insertions(+), 382 deletions(-) diff --git a/src/jstests/formio/components/currency.spec.js b/src/jstests/formio/components/currency.spec.js index 145316e21..65f14da5c 100644 --- a/src/jstests/formio/components/currency.spec.js +++ b/src/jstests/formio/components/currency.spec.js @@ -1,5 +1,4 @@ import _ from 'lodash'; -import React from 'react'; import {Formio} from 'react-formio'; import OpenFormsModule from 'formio/module'; @@ -10,44 +9,34 @@ import {currencyForm} from './fixtures/currency'; Formio.use(OpenFormsModule); describe('Currency Component', () => { - test('Currency component with 0 decimalLimit formatted correctly', done => { + test('Currency component with 0 decimalLimit formatted correctly', async () => { let formJSON = _.cloneDeep(currencyForm); const element = document.createElement('div'); - Formio.createForm(element, formJSON) - .then(form => { - form.setPristine(false); - const component = form.getComponent('currency'); - const formattedValue = component.getValueAsString(1); + const form = await Formio.createForm(element, formJSON); + form.setPristine(false); + const component = form.getComponent('currency'); + const formattedValue = component.getValueAsString(1); - expect(formattedValue).toEqual('€1'); - - done(); - }) - .catch(done); + expect(formattedValue).toEqual('€1'); }); - test('#2903 - Emptying currency component results in null value in data', done => { + test('#2903 - Emptying currency component results in null value in data', async () => { let formJSON = _.cloneDeep(currencyForm); const element = document.createElement('div'); - Formio.createForm(element, formJSON) - .then(form => { - form.setPristine(false); - const component = form.getComponent('currency'); - component.setValue(13); - - expect(form._data['currency']).toEqual(13); + const form = await Formio.createForm(element, formJSON); + form.setPristine(false); + const component = form.getComponent('currency'); + component.setValue(13); - component.dataValue = null; + expect(form._data['currency']).toEqual(13); - // null, instead of undefined (default Formio behaviour which removes the key from the data) - expect(form._data['currency']).toEqual(null); + component.dataValue = null; - done(); - }) - .catch(done); + // null, instead of undefined (default Formio behaviour which removes the key from the data) + expect(form._data['currency']).toEqual(null); }); }); diff --git a/src/jstests/formio/components/date.spec.js b/src/jstests/formio/components/date.spec.js index c393ec884..dcdcd5d5e 100644 --- a/src/jstests/formio/components/date.spec.js +++ b/src/jstests/formio/components/date.spec.js @@ -6,7 +6,7 @@ import {MinMaxDateValidator} from 'formio/validators/minMaxDateAndDatetimeValida const FormioComponent = Formio.Components.components.component; describe('Date Component', () => { - test('Date validator: check min date', done => { + test('Date validator: check min date', () => { const component = { label: 'date', key: 'date', @@ -33,11 +33,9 @@ describe('Date Component', () => { const isValid2 = MinMaxDateValidator.check(componentInstance, {}, '2024-01-01'); expect(isValid2).toBeTruthy(); - - done(); }); - test('Date validator: check max date', done => { + test('Date validator: check max date', () => { const component = { label: 'date', key: 'date', @@ -64,11 +62,9 @@ describe('Date Component', () => { const isValid2 = MinMaxDateValidator.check(componentInstance, {}, '2020-01-01'); expect(isValid2).toBeTruthy(); - - done(); }); - test('Date validator: check max date including the current one', done => { + test('Date validator: check max date including the current one', () => { const component = { label: 'date', key: 'date', @@ -88,11 +84,9 @@ describe('Date Component', () => { const isValid1 = MinMaxDateValidator.check(componentInstance, {}, '2023-09-08'); expect(isValid1).toBeTruthy(); - - done(); }); - test('Date validator: error message', done => { + test('Date validator: error message', () => { const component = { label: 'date', key: 'date', @@ -137,11 +131,9 @@ describe('Date Component', () => { MinMaxDateValidator.message(componentInstance); expect(mockTranslation.mock.calls[1][0]).toEqual('maxDate'); - - done(); }); - test('Date validator: check max date AND min date', done => { + test('Date validator: check max date AND min date', () => { const component = { label: 'date', key: 'date', @@ -171,7 +163,5 @@ describe('Date Component', () => { expect( componentInstance.openForms.validationErrorContext.minMaxDateAndDatetimeValidatorErrorKey ).toContain('minDate'); - - done(); }); }); diff --git a/src/jstests/formio/components/file.spec.js b/src/jstests/formio/components/file.spec.js index f1dc23484..15970352c 100644 --- a/src/jstests/formio/components/file.spec.js +++ b/src/jstests/formio/components/file.spec.js @@ -25,71 +25,58 @@ const maxNFilesForm = { }; describe('Multiple File Component', () => { - test('Uploading 1 file gives no error', done => { + test('Uploading 1 file gives no error', async () => { let formJSON = _.cloneDeep(maxNFilesForm); const element = document.createElement('div'); - Formio.createForm(element, formJSON) - .then(form => { - form.setPristine(false); - const component = form.getComponent('multipleFiles'); - component.upload([{name: 'File 1', size: '50'}]); + const form = await Formio.createForm(element, formJSON); + form.setPristine(false); + const component = form.getComponent('multipleFiles'); + component.upload([{name: 'File 1', size: '50'}]); - expect(!!component.error).toBeFalsy(); - - done(); - }) - .catch(done); + expect(!!component.error).toBeFalsy(); }); - test('Uploading 3 files gives an error', done => { + test('Uploading 3 files gives an error', async () => { let formJSON = _.cloneDeep(maxNFilesForm); const element = document.createElement('div'); - Formio.createForm(element, formJSON) - .then(form => { - form.setPristine(false); - const component = form.getComponent('multipleFiles'); - component.upload([ - {name: 'File 1', size: '50'}, - {name: 'File 2', size: '50'}, - {name: 'File 3', size: '50'}, - ]); - - expect(!!component.error).toBeTruthy(); - expect(component.error.message).toEqual( - 'Too many files added. The maximum allowed number of files is 2.' - ); - done(); - }) - .catch(done); + const form = await Formio.createForm(element, formJSON); + form.setPristine(false); + const component = form.getComponent('multipleFiles'); + component.upload([ + {name: 'File 1', size: '50'}, + {name: 'File 2', size: '50'}, + {name: 'File 3', size: '50'}, + ]); + + expect(!!component.error).toBeTruthy(); + expect(component.error.message).toEqual( + 'Too many files added. The maximum allowed number of files is 2.' + ); }); // GH-4222 - test('Uploading 1 file then 2 files gives an error', done => { + test('Uploading 1 file then 2 files gives an error', async () => { let formJSON = _.cloneDeep(maxNFilesForm); const element = document.createElement('div'); - Formio.createForm(element, formJSON) - .then(form => { - form.setPristine(false); - const component = form.getComponent('multipleFiles'); - component.dataValue.push({name: 'File 1', size: '50'}); - - component.upload([ - {name: 'File 2', size: '50'}, - {name: 'File 3', size: '50'}, - ]); - - expect(!!component.error).toBeTruthy(); - expect(component.error.message).toEqual( - 'Too many files added. The maximum allowed number of files is 2.' - ); - done(); - }) - .catch(done); + const form = await Formio.createForm(element, formJSON); + form.setPristine(false); + const component = form.getComponent('multipleFiles'); + component.dataValue.push({name: 'File 1', size: '50'}); + + component.upload([ + {name: 'File 2', size: '50'}, + {name: 'File 3', size: '50'}, + ]); + + expect(!!component.error).toBeTruthy(); + expect(component.error.message).toEqual( + 'Too many files added. The maximum allowed number of files is 2.' + ); }); }); diff --git a/src/jstests/formio/components/ibanfield.spec.js b/src/jstests/formio/components/ibanfield.spec.js index 07ebe0ec6..c0ca88043 100644 --- a/src/jstests/formio/components/ibanfield.spec.js +++ b/src/jstests/formio/components/ibanfield.spec.js @@ -1,8 +1,8 @@ import _ from 'lodash'; -import React from 'react'; import {Formio} from 'react-formio'; import OpenFormsModule from 'formio/module'; +import {sleep} from 'utils'; import {iban, twoComponentForm} from './fixtures/iban'; @@ -10,78 +10,52 @@ import {iban, twoComponentForm} from './fixtures/iban'; Formio.use(OpenFormsModule); describe('IBAN Component', () => { - test('IBAN component validation', done => { + test.each([ + // valid values + ['BR15 0000 0000 0000 1093 2840 814 P2', true], + ['FR76 3000 6000 0112 3456 7890 189', true], + ['MU43 BOMM 0101 1234 5678 9101 000 MUR', true], + ['BR1500000000000010932840814P2', true], + ['FR76-3000-6000-0112-3456-7890-189', true], + // invalid values + ['BR15 0000 0000 0000 1093 2840 814 00', false], + ['FR76 3000 6000 0112 3456 7890 000', false], + ['MU43 BOMM 0101 1234 5678 9101 000 MUR 00', false], + ['BR150000000000001093284081400', false], + ['FR76-3000-6000-0112-3456-7890-000', false], + ])('IBAN component validation (%s, valid: %s)', async (value, valid) => { const formJSON = _.cloneDeep(iban); - const validValues = [ - 'BR15 0000 0000 0000 1093 2840 814 P2', - 'FR76 3000 6000 0112 3456 7890 189', - 'MU43 BOMM 0101 1234 5678 9101 000 MUR', - 'BR1500000000000010932840814P2', - 'FR76-3000-6000-0112-3456-7890-189', - ]; + const element = document.createElement('div'); - const invalidValues = [ - 'BR15 0000 0000 0000 1093 2840 814 00', - 'FR76 3000 6000 0112 3456 7890 000', - 'MU43 BOMM 0101 1234 5678 9101 000 MUR 00', - 'BR150000000000001093284081400', - 'FR76-3000-6000-0112-3456-7890-000', - ]; + const form = await Formio.createForm(element, formJSON); + form.setPristine(false); + const component = form.getComponent('iban'); + const changed = component.setValue(value); + expect(changed).toBeTruthy(); - const testValidity = (values, valid) => { - values.forEach(value => { - const element = document.createElement('div'); + await sleep(300); - Formio.createForm(element, formJSON) - .then(form => { - form.setPristine(false); - const component = form.getComponent('iban'); - const changed = component.setValue(value); - expect(changed).toBeTruthy(); - - setTimeout(() => { - if (valid) { - expect(!!component.error).toBeFalsy(); - } else { - expect(!!component.error).toBeTruthy(); - expect(component.error.message).toEqual('Invalid IBAN'); - } - - if (value === invalidValues[4]) { - done(); - } - }, 300); - }) - .catch(done); - }); - }; - - testValidity(validValues, true); - testValidity(invalidValues, false); + if (valid) { + expect(!!component.error).toBeFalsy(); + } else { + expect(!!component.error).toBeTruthy(); + expect(component.error.message).toEqual('Invalid IBAN'); + } }); - test('IBAN validation not triggered by other components', done => { + test('IBAN validation not triggered by other components', async () => { const formJSON = _.cloneDeep(twoComponentForm); - const testValidity = () => { - const element = document.createElement('div'); - - Formio.createForm(element, formJSON) - .then(form => { - form.setPristine(false); - const component = form.getComponent('name'); - const changed = component.setValue('John'); - expect(changed).toBeTruthy(); + const element = document.createElement('div'); - setTimeout(() => { - expect(!!component.error).toBeFalsy(); - done(); - }, 300); - }) - .catch(done); - }; + const form = await Formio.createForm(element, formJSON); + form.setPristine(false); + const component = form.getComponent('name'); + const changed = component.setValue('John'); + expect(changed).toBeTruthy(); - testValidity(); + await sleep(300); + expect(!!component.error).toBeFalsy(); }); }); diff --git a/src/jstests/formio/components/licenseplate.spec.js b/src/jstests/formio/components/licenseplate.spec.js index 37a40069e..25620c9da 100644 --- a/src/jstests/formio/components/licenseplate.spec.js +++ b/src/jstests/formio/components/licenseplate.spec.js @@ -3,6 +3,7 @@ import {Formio} from 'react-formio'; import LicensePlateField from 'formio/components/LicensePlateField'; import OpenFormsModule from 'formio/module'; +import {sleep} from 'utils'; import {licenseplate} from './fixtures/licenseplate'; @@ -10,45 +11,36 @@ import {licenseplate} from './fixtures/licenseplate'; Formio.use(OpenFormsModule); describe('License plate Component', () => { - test('License plate component validation', done => { + test.each([ + // valid values + ['GF-CP-51', true], + ['123-123-123', true], + ['J-206-FV', true], + // invalid values + ['123123123', false], + ['- - -', false], + ['abcabcabc', false], + ])('License plate component validation (%s, valid: %s)', async (value, valid) => { const formJSON = _.cloneDeep(licenseplate); const componentSchema = LicensePlateField.schema(); formJSON.components[0].validate.pattern = componentSchema.validate.pattern; formJSON.components[0].errors.pattern = componentSchema.errors.pattern; - const validValues = ['GF-CP-51', '123-123-123', 'J-206-FV']; - - const invalidValues = ['123123123', '- - -', 'abcabcabc']; - - const testValidity = (values, valid) => { - values.forEach(value => { - const element = document.createElement('div'); - - Formio.createForm(element, formJSON) - .then(form => { - form.setPristine(false); - const component = form.getComponent('licenseplate'); - component.setValue(value); - - setTimeout(() => { - if (valid) { - expect(!!component.error).toBeFalsy(); - } else { - expect(!!component.error).toBeTruthy(); - expect(component.error.message).toEqual('Invalid Dutch license plate'); - } - - if (value === invalidValues[2]) { - done(); - } - }, 300); - }) - .catch(done); - }); - }; - - testValidity(validValues, true); - testValidity(invalidValues, false); + const element = document.createElement('div'); + + const form = await Formio.createForm(element, formJSON); + form.setPristine(false); + const component = form.getComponent('licenseplate'); + component.setValue(value); + + await sleep(300); + + if (valid) { + expect(!!component.error).toBeFalsy(); + } else { + expect(!!component.error).toBeTruthy(); + expect(component.error.message).toEqual('Invalid Dutch license plate'); + } }); }); diff --git a/src/jstests/formio/components/map.spec.js b/src/jstests/formio/components/map.spec.js index 9f537ac07..fd4ba801f 100644 --- a/src/jstests/formio/components/map.spec.js +++ b/src/jstests/formio/components/map.spec.js @@ -23,16 +23,12 @@ const mapForm = { }; describe('Map component', () => { - test('Hidden map component', done => { + test('Hidden map component', async () => { let formJSON = _.cloneDeep(mapForm); const element = document.createElement('div'); - Formio.createForm(element, formJSON) - .then(form => { - form.setPristine(false); - done(); - }) - .catch(done); + const form = await Formio.createForm(element, formJSON); + form.setPristine(false); }); }); diff --git a/src/jstests/formio/components/number.spec.js b/src/jstests/formio/components/number.spec.js index 1d31f3aa4..ccfcc3fab 100644 --- a/src/jstests/formio/components/number.spec.js +++ b/src/jstests/formio/components/number.spec.js @@ -1,5 +1,4 @@ import _ from 'lodash'; -import React from 'react'; import {Formio} from 'react-formio'; import OpenFormsModule from 'formio/module'; @@ -10,26 +9,21 @@ import {numberForm} from './fixtures/number'; Formio.use(OpenFormsModule); describe('Number Component', () => { - test('#2903 - Emptying number component results in null value in data', done => { + test('#2903 - Emptying number component results in null value in data', async () => { let formJSON = _.cloneDeep(numberForm); const element = document.createElement('div'); - Formio.createForm(element, formJSON) - .then(form => { - form.setPristine(false); - const component = form.getComponent('number'); - component.setValue(13); + const form = await Formio.createForm(element, formJSON); + form.setPristine(false); + const component = form.getComponent('number'); + component.setValue(13); - expect(form._data['number']).toEqual(13); + expect(form._data['number']).toEqual(13); - component.dataValue = null; + component.dataValue = null; - // null, instead of undefined (default Formio behaviour which removes the key from the data) - expect(form._data['number']).toEqual(null); - - done(); - }) - .catch(done); + // null, instead of undefined (default Formio behaviour which removes the key from the data) + expect(form._data['number']).toEqual(null); }); }); diff --git a/src/jstests/formio/components/textfield.spec.js b/src/jstests/formio/components/textfield.spec.js index f16bb78f3..cb977c91e 100644 --- a/src/jstests/formio/components/textfield.spec.js +++ b/src/jstests/formio/components/textfield.spec.js @@ -4,6 +4,7 @@ import {Formio} from 'react-formio'; import {BASE_URL} from 'api-mocks'; import mswServer from 'api-mocks/msw-server'; import OpenFormsModule from 'formio/module'; +import {sleep} from 'utils'; import {addressPrefillForm} from './fixtures/textfield'; import {mockLocationGet} from './textfield.mocks'; @@ -12,28 +13,22 @@ import {mockLocationGet} from './textfield.mocks'; Formio.use(OpenFormsModule); describe('TextField Component', () => { - test('Address prefill city', done => { + test('Address prefill city', async () => { let formJSON = _.cloneDeep(addressPrefillForm); mswServer.use(mockLocationGet({city: 'Amsterdam', streetName: 'Beautiful Street'})); const element = document.createElement('div'); - Formio.createForm(element, formJSON, {baseUrl: BASE_URL}) - .then(form => { - form.setPristine(false); - const componentCity = form.getComponent('city'); - componentCity.handleSettingLocationData({postcode: '1111AA', houseNumber: '1'}); - componentCity._debouncedSetLocationData.flush(); - - setTimeout(() => { - expect(componentCity.getValue()).toEqual('Amsterdam'); - done(); - }, 300); - }) - .catch(done); + const form = await Formio.createForm(element, formJSON, {baseUrl: BASE_URL}); + form.setPristine(false); + const componentCity = form.getComponent('city'); + componentCity.handleSettingLocationData({postcode: '1111AA', houseNumber: '1'}); + componentCity._debouncedSetLocationData.flush(); + await sleep(300); + expect(componentCity.getValue()).toEqual('Amsterdam'); }); - test('TextField (readonly) with address prefill refreshes city on invalid data', done => { + test('TextField (readonly) with address prefill refreshes city on invalid data', async () => { let formJSON = _.cloneDeep(addressPrefillForm); formJSON.components[2].disabled = true; formJSON.components[3].disabled = true; @@ -41,69 +36,51 @@ describe('TextField Component', () => { const element = document.createElement('div'); - Formio.createForm(element, formJSON, {baseUrl: BASE_URL}) - .then(form => { - form.setPristine(false); - const componentCity = form.getComponent('city'); - componentCity.setValue('Amsterdam'); - - componentCity.handleSettingLocationData({postcode: '0000AA', houseNumber: '0'}); - componentCity._debouncedSetLocationData.flush(); - - setTimeout(() => { - expect(componentCity.getValue()).toEqual(''); - done(); - }, 300); - }) - .catch(done); + const form = await Formio.createForm(element, formJSON, {baseUrl: BASE_URL}); + form.setPristine(false); + const componentCity = form.getComponent('city'); + componentCity.setValue('Amsterdam'); + + componentCity.handleSettingLocationData({postcode: '0000AA', houseNumber: '0'}); + componentCity._debouncedSetLocationData.flush(); + await sleep(300); + expect(componentCity.getValue()).toEqual(''); }); - test('TextField (editable) with address prefill does not modify city if already filled', done => { + test('TextField (editable) with address prefill does not modify city if already filled', async () => { let formJSON = _.cloneDeep(addressPrefillForm); mswServer.use(mockLocationGet({})); const element = document.createElement('div'); - Formio.createForm(element, formJSON, {baseUrl: BASE_URL}) - .then(form => { - form.setPristine(false); - const componentCity = form.getComponent('city'); - componentCity.setValue('Amsterdam'); - - componentCity.handleSettingLocationData({postcode: '0000AA', houseNumber: '0'}); - componentCity.setLocationData; // access the getter so the debounced method is created - componentCity._debouncedSetLocationData.flush(); - - setTimeout(() => { - expect(componentCity.getValue()).toEqual('Amsterdam'); - done(); - }, 300); - }) - .catch(done); + const form = await Formio.createForm(element, formJSON, {baseUrl: BASE_URL}); + form.setPristine(false); + const componentCity = form.getComponent('city'); + componentCity.setValue('Amsterdam'); + + componentCity.handleSettingLocationData({postcode: '0000AA', houseNumber: '0'}); + componentCity.setLocationData; // access the getter so the debounced method is created + componentCity._debouncedSetLocationData.flush(); + await sleep(300); + expect(componentCity.getValue()).toEqual('Amsterdam'); }); - test('Address prefill street', done => { + test('Address prefill street', async () => { let formJSON = _.cloneDeep(addressPrefillForm); mswServer.use(mockLocationGet({city: 'Amsterdam', streetName: 'Beautiful Street'})); const element = document.createElement('div'); - Formio.createForm(element, formJSON, {baseUrl: BASE_URL}) - .then(form => { - form.setPristine(false); - const componentStreet = form.getComponent('streetName'); - componentStreet.handleSettingLocationData({postcode: '1111AA', houseNumber: '1'}); - componentStreet._debouncedSetLocationData.flush(); - - setTimeout(() => { - expect(componentStreet.getValue()).toEqual('Beautiful Street'); - done(); - }, 300); - }) - .catch(done); + const form = await Formio.createForm(element, formJSON, {baseUrl: BASE_URL}); + form.setPristine(false); + const componentStreet = form.getComponent('streetName'); + componentStreet.handleSettingLocationData({postcode: '1111AA', houseNumber: '1'}); + componentStreet._debouncedSetLocationData.flush(); + await sleep(300); + expect(componentStreet.getValue()).toEqual('Beautiful Street'); }); - test('TextField (readonly) with address prefill refreshes street on invalid data', done => { + test('TextField (readonly) with address prefill refreshes street on invalid data', async () => { let formJSON = _.cloneDeep(addressPrefillForm); formJSON.components[2].disabled = true; formJSON.components[3].disabled = true; @@ -111,44 +88,32 @@ describe('TextField Component', () => { const element = document.createElement('div'); - Formio.createForm(element, formJSON, {baseUrl: BASE_URL}) - .then(form => { - form.setPristine(false); - const componentStreet = form.getComponent('streetName'); - componentStreet.setValue('Beautiful Street'); - - componentStreet.handleSettingLocationData({postcode: '0000AA', houseNumber: '0'}); - componentStreet._debouncedSetLocationData.flush(); - - setTimeout(() => { - expect(componentStreet.getValue()).toEqual(''); - done(); - }, 300); - }) - .catch(done); + const form = await Formio.createForm(element, formJSON, {baseUrl: BASE_URL}); + form.setPristine(false); + const componentStreet = form.getComponent('streetName'); + componentStreet.setValue('Beautiful Street'); + + componentStreet.handleSettingLocationData({postcode: '0000AA', houseNumber: '0'}); + componentStreet._debouncedSetLocationData.flush(); + await sleep(300); + expect(componentStreet.getValue()).toEqual(''); }); - test('TextField (editable) with address prefill (invalid data) does not modify street if already filled', done => { + test('TextField (editable) with address prefill (invalid data) does not modify street if already filled', async () => { let formJSON = _.cloneDeep(addressPrefillForm); mswServer.use(mockLocationGet({})); const element = document.createElement('div'); - Formio.createForm(element, formJSON, {baseUrl: BASE_URL}) - .then(form => { - form.setPristine(false); - const componentStreet = form.getComponent('streetName'); - componentStreet.setValue('Beautiful Street'); - - componentStreet.handleSettingLocationData({postcode: '0000AA', houseNumber: '0'}); - componentStreet.setLocationData; // access the getter so the debounced method is created - componentStreet._debouncedSetLocationData.flush(); - - setTimeout(() => { - expect(componentStreet.getValue()).toEqual('Beautiful Street'); - done(); - }, 300); - }) - .catch(done); + const form = await Formio.createForm(element, formJSON, {baseUrl: BASE_URL}); + form.setPristine(false); + const componentStreet = form.getComponent('streetName'); + componentStreet.setValue('Beautiful Street'); + + componentStreet.handleSettingLocationData({postcode: '0000AA', houseNumber: '0'}); + componentStreet.setLocationData; // access the getter so the debounced method is created + componentStreet._debouncedSetLocationData.flush(); + await sleep(300); + expect(componentStreet.getValue()).toEqual('Beautiful Street'); }); }); diff --git a/src/jstests/formio/components/time.spec.js b/src/jstests/formio/components/time.spec.js index 384bd2477..5eb2ca6f2 100644 --- a/src/jstests/formio/components/time.spec.js +++ b/src/jstests/formio/components/time.spec.js @@ -134,7 +134,7 @@ describe('Time Component', () => { } ); - test('Time component with both min/max and max > min validation and custom error', done => { + test('Time component with both min/max and max > min validation and custom error', async () => { let formJSON = _.cloneDeep(timeForm); // Note: the backend dynamically updates the configuration so that `translatedErrors` are added to // `errors` in the correct language. @@ -148,24 +148,18 @@ describe('Time Component', () => { const element = document.createElement('div'); - Formio.createForm(element, formJSON) - .then(form => { - form.setPristine(false); - const component = form.getComponent('time'); - const changed = component.setValue('10:00'); - expect(changed).toBeTruthy(); - - setTimeout(() => { - expect(!!component.error).toBeTruthy(); - expect(component.error.message).toEqual('Custom error! Min time 12:00'); - - done(); - }, 300); - }) - .catch(done); + const form = await Formio.createForm(element, formJSON); + form.setPristine(false); + const component = form.getComponent('time'); + const changed = component.setValue('10:00'); + expect(changed).toBeTruthy(); + + await sleep(300); + expect(!!component.error).toBeTruthy(); + expect(component.error.message).toEqual('Custom error! Min time 12:00'); }); - test('Time component with both min/max and max < min validation and custom error', done => { + test('Time component with both min/max and max < min validation and custom error', async () => { let formJSON = _.cloneDeep(timeForm); // Note: the backend dynamically updates the configuration so that `translatedErrors` are added to // `errors` in the correct language. @@ -179,24 +173,18 @@ describe('Time Component', () => { const element = document.createElement('div'); - Formio.createForm(element, formJSON) - .then(form => { - form.setPristine(false); - const component = form.getComponent('time'); - const changed = component.setValue('07:00'); - expect(changed).toBeTruthy(); - - setTimeout(() => { - expect(!!component.error).toBeTruthy(); - expect(component.error.message).toEqual('Custom error! Min time: 08:00 Max time: 01:00.'); - - done(); - }, 300); - }) - .catch(done); + const form = await Formio.createForm(element, formJSON); + form.setPristine(false); + const component = form.getComponent('time'); + const changed = component.setValue('07:00'); + expect(changed).toBeTruthy(); + + await sleep(300); + expect(!!component.error).toBeTruthy(); + expect(component.error.message).toEqual('Custom error! Min time: 08:00 Max time: 01:00.'); }); - test('Time component with only min and custom error', done => { + test('Time component with only min and custom error', async () => { let formJSON = _.cloneDeep(timeForm); // Note: the backend dynamically updates the configuration so that `translatedErrors` are added to // `errors` in the correct language. @@ -209,24 +197,18 @@ describe('Time Component', () => { const element = document.createElement('div'); - Formio.createForm(element, formJSON) - .then(form => { - form.setPristine(false); - const component = form.getComponent('time'); - const changed = component.setValue('10:00'); - expect(changed).toBeTruthy(); - - setTimeout(() => { - expect(!!component.error).toBeTruthy(); - expect(component.error.message).toEqual('Custom error! Min time 13:00'); - - done(); - }, 300); - }) - .catch(done); + const form = await Formio.createForm(element, formJSON); + form.setPristine(false); + const component = form.getComponent('time'); + const changed = component.setValue('10:00'); + expect(changed).toBeTruthy(); + + await sleep(300); + expect(!!component.error).toBeTruthy(); + expect(component.error.message).toEqual('Custom error! Min time 13:00'); }); - test('Time component with only max and custom error', done => { + test('Time component with only max and custom error', async () => { let formJSON = _.cloneDeep(timeForm); // Note: the backend dynamically updates the configuration so that `translatedErrors` are added to // `errors` in the correct language. @@ -239,24 +221,18 @@ describe('Time Component', () => { const element = document.createElement('div'); - Formio.createForm(element, formJSON) - .then(form => { - form.setPristine(false); - const component = form.getComponent('time'); - const changed = component.setValue('14:00'); - expect(changed).toBeTruthy(); - - setTimeout(() => { - expect(!!component.error).toBeTruthy(); - expect(component.error.message).toEqual('Custom error! Max time 13:00'); - - done(); - }, 300); - }) - .catch(done); + const form = await Formio.createForm(element, formJSON); + form.setPristine(false); + const component = form.getComponent('time'); + const changed = component.setValue('14:00'); + expect(changed).toBeTruthy(); + + await sleep(300); + expect(!!component.error).toBeTruthy(); + expect(component.error.message).toEqual('Custom error! Max time 13:00'); }); - test('Time component with empty string error', done => { + test('Time component with empty string error', async () => { let formJSON = _.cloneDeep(timeForm); // Note: the backend dynamically updates the configuration so that `translatedErrors` are added to // `errors` in the correct language. @@ -267,20 +243,14 @@ describe('Time Component', () => { const element = document.createElement('div'); - Formio.createForm(element, formJSON) - .then(form => { - form.setPristine(false); - const component = form.getComponent('time'); - const changed = component.setValue('14:00'); - expect(changed).toBeTruthy(); - - setTimeout(() => { - expect(!!component.error).toBeTruthy(); - expect(component.error.message).toEqual('invalid_time'); - - done(); - }, 300); - }) - .catch(done); + const form = await Formio.createForm(element, formJSON); + form.setPristine(false); + const component = form.getComponent('time'); + const changed = component.setValue('14:00'); + expect(changed).toBeTruthy(); + + await sleep(300); + expect(!!component.error).toBeTruthy(); + expect(component.error.message).toEqual('invalid_time'); }); });