diff --git a/src/components/staff-payment/StaffPayment.stories.ts b/src/components/staff-payment/StaffPayment.stories.ts index ed12580a..cbb19d74 100644 --- a/src/components/staff-payment/StaffPayment.stories.ts +++ b/src/components/staff-payment/StaffPayment.stories.ts @@ -27,3 +27,14 @@ export const Default = Template.bind({}) Default['args'] = { staffPaymentData: staffPaymentData } + +export const BcolWithLowerCaseDatNumber = Template.bind({}) +BcolWithLowerCaseDatNumber['args'] = { + staffPaymentData: { + ...staffPaymentData, + option: StaffPaymentOptions.BCOL, + bcolAccountNumber: '123456', + datNumber: 'c1234567' + } as StaffPaymentIF, + validate: true +} diff --git a/src/components/staff-payment/StaffPayment.vue b/src/components/staff-payment/StaffPayment.vue index e54b28bf..adde3335 100644 --- a/src/components/staff-payment/StaffPayment.vue +++ b/src/components/staff-payment/StaffPayment.vue @@ -196,7 +196,7 @@ export default class StaffPayment extends Vue { /** Validation rules for DAT Number. */ readonly datNumberRules: Array<(v) => boolean | string> = [ v => !!v || 'Enter DAT Number', - v => /^[A-Z]{1}[0-9]{7,9}$/.test(v) || 'DAT Number must be in standard format (eg, C1234567)' + v => /^[A-Za-z]{1}[0-9]{7,9}$/.test(v) || 'DAT Number must be in standard format (eg, C1234567)' ] /** Called when component is mounted. */ @@ -281,7 +281,8 @@ export default class StaffPayment extends Vue { return { option, routingSlipNumber, isPriority } as StaffPaymentIF case StaffPaymentOptions.BCOL: - return { option, bcolAccountNumber, datNumber, folioNumber, isPriority } as StaffPaymentIF + // upper case the DAT number so a lower case leading letter is accepted and normalized + return { option, bcolAccountNumber, datNumber: datNumber.toUpperCase(), folioNumber, isPriority } as StaffPaymentIF case StaffPaymentOptions.NO_FEE: return { option } as StaffPaymentIF diff --git a/src/components/staff-payment/package.json b/src/components/staff-payment/package.json index c3ff48f7..d5df3da9 100644 --- a/src/components/staff-payment/package.json +++ b/src/components/staff-payment/package.json @@ -1,6 +1,6 @@ { "name": "@bcrs-shared-components/staff-payment", - "version": "2.1.76", + "version": "2.1.77", "publishConfig": { "access": "public" }, diff --git a/tests/unit/BaseAddress.spec.ts b/tests/unit/BaseAddress.spec.ts index 780140e3..1ea9953d 100644 --- a/tests/unit/BaseAddress.spec.ts +++ b/tests/unit/BaseAddress.spec.ts @@ -179,18 +179,27 @@ describe('BaseAddress - valid event (#34469)', () => { } }) - it('emits valid=true after validate() on a fully valid address', async () => { + it('emits valid=true after validate() once an invalid postal code is corrected', async () => { + // start invalid (empty, required postal code) so the validity watcher has a change to react to wrapper = mount(BaseAddress, { vuetify, - propsData: { schema, editing: true, address } + propsData: { schema, editing: true, address: { ...address, postalCode: '' } } }) await Vue.nextTick() + expect(wrapper.vm.isPostalCodeValid).toBe(false) - await wrapper.vm.validate() + // correct the postal code, then validate as the consuming app does on submit + const postalCode = wrapper.find('.postal-code input') + await postalCode.setValue('V8V 1V1') + await Vue.nextTick() + + expect(await wrapper.vm.validate()).toBe(true) await Vue.nextTick() const validEvents = wrapper.emitted('valid') expect(validEvents).toBeTruthy() expect(validEvents[validEvents.length - 1][0]).toBe(true) + expect(wrapper.vm.isPostalCodeValid).toBe(true) + expect(wrapper.vm.addressFormValid).toBe(true) }) }) diff --git a/tests/unit/StaffPayment.spec.ts b/tests/unit/StaffPayment.spec.ts index 436833c9..e8409c7a 100644 --- a/tests/unit/StaffPayment.spec.ts +++ b/tests/unit/StaffPayment.spec.ts @@ -428,4 +428,51 @@ describe('StaffPayment', () => { // Confirm validation expect(vm.validate).toBe(true) }) + + it('accepts a lower or upper case leading letter in the DAT Number', async () => { + const wrapper = mount(StaffPayment, { vuetify }) + await Vue.nextTick() + + const vm: any = wrapper.vm + const formatRule = vm.datNumberRules[1] + + // valid formats + expect(formatRule('C1234567')).toBe(true) + expect(formatRule('c1234567')).toBe(true) + expect(formatRule('c123456789')).toBe(true) + + // invalid formats + expect(formatRule('1234567')).toBe('DAT Number must be in standard format (eg, C1234567)') + expect(formatRule('C123456')).toBe('DAT Number must be in standard format (eg, C1234567)') + expect(formatRule('CC1234567')).toBe('DAT Number must be in standard format (eg, C1234567)') + + wrapper.destroy() + }) + + it('emits the DAT Number in upper case', async () => { + const wrapper = mount(StaffPayment, { + vuetify, + propsData: { + staffPaymentData: { + option: 2, // BCOL + bcolAccountNumber: '123456', + datNumber: '' + } + } + }) + await Vue.nextTick() + + await wrapper.find('#dat-number-textfield').setValue('c1234567') + + // @Emit emits the return value first, followed by the original argument + expect(wrapper.emitted('update:staffPaymentData').pop()[0]).toEqual({ + option: 2, // BCOL + bcolAccountNumber: '123456', + datNumber: 'C1234567', + folioNumber: '', + isPriority: false + }) + + wrapper.destroy() + }) })