From 276ad7587630a33cf6a06bcc86cd73690ea66991 Mon Sep 17 00:00:00 2001 From: quantum-grit Date: Tue, 24 Oct 2023 12:48:06 +0300 Subject: [PATCH] donation amount changed to integer to avoid language specific decimal separators --- .../donation-flow/anon-donation-custom.spec.ts | 18 +++++++++--------- .../helpers/validation-schema.ts | 11 +++++++---- .../one-time-donation/steps/FirstStep.tsx | 2 +- .../common/form/NumberInputField.tsx | 9 ++++++--- 4 files changed, 23 insertions(+), 17 deletions(-) diff --git a/e2e/tests/regression/donation-flow/anon-donation-custom.spec.ts b/e2e/tests/regression/donation-flow/anon-donation-custom.spec.ts index 358724d95..2d649c499 100644 --- a/e2e/tests/regression/donation-flow/anon-donation-custom.spec.ts +++ b/e2e/tests/regression/donation-flow/anon-donation-custom.spec.ts @@ -62,7 +62,7 @@ test.describe.serial( .soft(await donationPage.isSelectAmountStepActive(), 'Select Amount step is not active.') .toBeTruthy() await donationPage.selectRadioButtonByLabelText([otherAmountText]) - await donationPage.fillOtherAmountInputField('7,50') + await donationPage.fillOtherAmountInputField('75') await donationPage.setDonationRegionFromTheDropdown(bgDonationRegions.EUROPE) await donationPage.selectCheckboxByLabelText([bgCardIncludeFeesText]) // Expected pattern: @@ -70,21 +70,21 @@ test.describe.serial( const totalChargedAmountText = await donationPage.getTotalChargedAmountsAsText() const feeAmountText = await donationPage.getFeeAmountsAsText() const donationAmountText = await donationPage.getDonationAmountsAsText() - expect.soft(totalChargedAmountText).toEqual('8,10 лв.') - expect.soft(feeAmountText).toEqual('0,60 лв.') - expect(donationAmountText).toEqual('7,50 лв.') + expect.soft(totalChargedAmountText).toEqual('76,42 лв.') + expect.soft(feeAmountText).toEqual('1,42 лв.') + expect(donationAmountText).toEqual('75,00 лв.') }) test('The total charge, fee tax and donation amount are recalculated correctly when the donation amount is changed', async () => { - await donationPage.fillOtherAmountInputField('12,90') + await donationPage.fillOtherAmountInputField('120') // Expected pattern: // За вашия превод от {totalChargedAmountText} лв., таксата на Stripe ще е {feeAmountText} лв., а кампанията ще получи {donationAmountText} лв. const totalChargedAmountText = await donationPage.getTotalChargedAmountsAsText() const feeAmountText = await donationPage.getFeeAmountsAsText() const donationAmountText = await donationPage.getDonationAmountsAsText() - expect.soft(totalChargedAmountText).toEqual('13,56 лв.') - expect.soft(feeAmountText).toEqual('0,66 лв.') - expect(donationAmountText).toEqual('12,90 лв.') + expect.soft(totalChargedAmountText).toEqual('121,96 лв.') + expect.soft(feeAmountText).toEqual('1,96 лв.') + expect(donationAmountText).toEqual('120,00 лв.') }) test('The user is able to fill in e-mail for anonymous donation', async () => { @@ -111,7 +111,7 @@ test.describe.serial( const actualStripeEmail = await stripeCheckoutPage.getReadonlyEmailText() expect .soft(stripeTotalAmount, 'The Stripe total donation amount is not correct.') - .toContain('13,56') + .toContain('121,96') expect(actualStripeEmail, 'The user e-mail is not sent correctly to Stripe.').toEqual( testEmail, ) diff --git a/src/components/client/one-time-donation/helpers/validation-schema.ts b/src/components/client/one-time-donation/helpers/validation-schema.ts index ed5f09e20..113e2791b 100644 --- a/src/components/client/one-time-donation/helpers/validation-schema.ts +++ b/src/components/client/one-time-donation/helpers/validation-schema.ts @@ -12,10 +12,13 @@ export const validateFirst: yup.SchemaOf = yup // Here we should fetch the possible payments to put into the oneOf, but it's not that important then: yup.string().required(), }), - otherAmount: yup.number().when('amount', { - is: 'other', - then: yup.number().min(1, 'one-time-donation:errors-fields.other-amount').required(), - }), + otherAmount: yup + .number() + .integer() + .when('amount', { + is: 'other', + then: yup.number().min(1, 'one-time-donation:errors-fields.other-amount').required(), + }), }) export const validateSecond: yup.SchemaOf = yup.object().defined().shape({ diff --git a/src/components/client/one-time-donation/steps/FirstStep.tsx b/src/components/client/one-time-donation/steps/FirstStep.tsx index 0e2f507fa..755eba70d 100644 --- a/src/components/client/one-time-donation/steps/FirstStep.tsx +++ b/src/components/client/one-time-donation/steps/FirstStep.tsx @@ -237,7 +237,7 @@ export default function FirstStep() { options={ oneTimePrices .map((v) => ({ - label: moneyPublic(Number(v)), + label: moneyPublic(Number(v), undefined, undefined, 0, 0), //show amounts as integer value: String(Number(v)), })) .concat({ diff --git a/src/components/common/form/NumberInputField.tsx b/src/components/common/form/NumberInputField.tsx index b491d55db..47de14b6b 100644 --- a/src/components/common/form/NumberInputField.tsx +++ b/src/components/common/form/NumberInputField.tsx @@ -18,7 +18,6 @@ export default function NumberInputField({ }: Props) { const { t, i18n } = useTranslation('one-time-donation') const [, meta, { setValue, setError }] = useField(name) - const decimalSeparator = (1.1).toLocaleString(i18n.language).charAt(1) useEffect(() => { setValue(1) @@ -36,14 +35,15 @@ export default function NumberInputField({ e.preventDefault() return } - if (decimalSeparator !== e.key && (e.key === '.' || e.key === ',')) { + + //prevent decimal amounts + if (e.key === '.' || e.key === ',') { e.preventDefault() return } if ( (e.key.charCodeAt(0) >= 48 && e.key.charCodeAt(0) <= 57) || - (isInteger(meta.value) && e.key === decimalSeparator) || (e.ctrlKey && e.key === 'v') || (e.ctrlKey && e.key === 'c') || (e.ctrlKey && e.key === 'a') || @@ -66,7 +66,10 @@ export default function NumberInputField({ onPaste={async (e) => { e.preventDefault() const value = e.clipboardData.getData('Text') + if (value.includes('.') || value.includes(',')) return + const transformedValue: string = value.replace(/ /g, '') as string + if (!isNaN(Number(transformedValue))) { setValue(transformedValue) return