From a97f2f435051fd0c05da2a86d22e5461c59d41be Mon Sep 17 00:00:00 2001 From: Richa Patel Date: Wed, 18 Jun 2025 18:00:20 +1000 Subject: [PATCH 1/4] fix(checkout): fix flaky tests - wip --- .../storedInstrument/ManageInstrumentsModal.test.tsx | 4 +--- .../payment/storedInstrument/ManageInstrumentsModal.tsx | 9 ++++++++- 2 files changed, 9 insertions(+), 4 deletions(-) diff --git a/packages/core/src/app/payment/storedInstrument/ManageInstrumentsModal.test.tsx b/packages/core/src/app/payment/storedInstrument/ManageInstrumentsModal.test.tsx index 8bc7b868c4..726b41d8b5 100644 --- a/packages/core/src/app/payment/storedInstrument/ManageInstrumentsModal.test.tsx +++ b/packages/core/src/app/payment/storedInstrument/ManageInstrumentsModal.test.tsx @@ -126,11 +126,9 @@ describe('ManageInstrumentsModal', () => { expect(await screen.findByText(localeContext.language.translate('payment.instrument_manage_modal_confirmation_label'))).toBeInTheDocument(); }); - it.skip('shows list of instruments if user decides to cancel their action', async () => { + it('shows list of instruments if user decides to cancel their action', async () => { render(); - await userEvent.click(screen.getAllByText('Delete')[0]); - await userEvent.click(screen.getByText('Cancel')); await userEvent.click(screen.getAllByText('Delete')[0]); await userEvent.click(screen.getByText('Cancel')); diff --git a/packages/core/src/app/payment/storedInstrument/ManageInstrumentsModal.tsx b/packages/core/src/app/payment/storedInstrument/ManageInstrumentsModal.tsx index af10eb87fc..1daaec0507 100644 --- a/packages/core/src/app/payment/storedInstrument/ManageInstrumentsModal.tsx +++ b/packages/core/src/app/payment/storedInstrument/ManageInstrumentsModal.tsx @@ -75,6 +75,8 @@ class ManageInstrumentsModal extends Component< const { isConfirmingDelete } = this.state; + console.log("isConfirmingDelete content", isConfirmingDelete) + if (isConfirmingDelete) { return (

@@ -112,6 +114,7 @@ class ManageInstrumentsModal extends Component< const { isDeletingInstrument, isLoadingInstruments, onRequestClose } = this.props; const { isConfirmingDelete } = this.state; + console.log("isConfirmingDelete", isConfirmingDelete) if (isConfirmingDelete) { return ( <> @@ -150,9 +153,10 @@ class ManageInstrumentsModal extends Component< private handleAfterOpen: () => void = () => { const { onAfterOpen } = this.props; + console.log("does it open again??") this.setState( { - isConfirmingDelete: false, + isConfirmingDelete: this.state.isConfirmingDelete || false, }, onAfterOpen, ); @@ -165,6 +169,7 @@ class ManageInstrumentsModal extends Component< clearError(deleteInstrumentError); } + console.log("or is it set from handleCancel??"); this.setState({ isConfirmingDelete: false, }); @@ -178,6 +183,7 @@ class ManageInstrumentsModal extends Component< onRequestClose = noop, } = this.props; const { selectedInstrumentId } = this.state; + console.log("selectedInsturment id", selectedInstrumentId); if (!selectedInstrumentId) { return; @@ -193,6 +199,7 @@ class ManageInstrumentsModal extends Component< }; private handleDeleteInstrument: (id: string) => void = (id) => { + console.log("comes here on delete click??", id); this.setState({ isConfirmingDelete: true, selectedInstrumentId: id, From ae146a0a4cf73f00fab425ee2546dfccc275c33c Mon Sep 17 00:00:00 2001 From: Richa Patel Date: Wed, 18 Jun 2025 18:35:13 +1000 Subject: [PATCH 2/4] fix(checkout): fix flaky tests - manage instrument modal --- .../payment/storedInstrument/ManageInstrumentsModal.tsx | 9 +-------- .../ManageInstrumentsModal.test.tsx | 3 +-- .../ManageInstrumentsModal/ManageInstrumentsModal.tsx | 2 +- 3 files changed, 3 insertions(+), 11 deletions(-) diff --git a/packages/core/src/app/payment/storedInstrument/ManageInstrumentsModal.tsx b/packages/core/src/app/payment/storedInstrument/ManageInstrumentsModal.tsx index 1daaec0507..eff4ae7ad7 100644 --- a/packages/core/src/app/payment/storedInstrument/ManageInstrumentsModal.tsx +++ b/packages/core/src/app/payment/storedInstrument/ManageInstrumentsModal.tsx @@ -75,8 +75,6 @@ class ManageInstrumentsModal extends Component< const { isConfirmingDelete } = this.state; - console.log("isConfirmingDelete content", isConfirmingDelete) - if (isConfirmingDelete) { return (

@@ -114,7 +112,6 @@ class ManageInstrumentsModal extends Component< const { isDeletingInstrument, isLoadingInstruments, onRequestClose } = this.props; const { isConfirmingDelete } = this.state; - console.log("isConfirmingDelete", isConfirmingDelete) if (isConfirmingDelete) { return ( <> @@ -153,10 +150,9 @@ class ManageInstrumentsModal extends Component< private handleAfterOpen: () => void = () => { const { onAfterOpen } = this.props; - console.log("does it open again??") this.setState( { - isConfirmingDelete: this.state.isConfirmingDelete || false, + isConfirmingDelete: this.state.isConfirmingDelete, }, onAfterOpen, ); @@ -169,7 +165,6 @@ class ManageInstrumentsModal extends Component< clearError(deleteInstrumentError); } - console.log("or is it set from handleCancel??"); this.setState({ isConfirmingDelete: false, }); @@ -183,7 +178,6 @@ class ManageInstrumentsModal extends Component< onRequestClose = noop, } = this.props; const { selectedInstrumentId } = this.state; - console.log("selectedInsturment id", selectedInstrumentId); if (!selectedInstrumentId) { return; @@ -199,7 +193,6 @@ class ManageInstrumentsModal extends Component< }; private handleDeleteInstrument: (id: string) => void = (id) => { - console.log("comes here on delete click??", id); this.setState({ isConfirmingDelete: true, selectedInstrumentId: id, diff --git a/packages/instrument-utils/src/storedInstrument/ManageInstrumentsModal/ManageInstrumentsModal.test.tsx b/packages/instrument-utils/src/storedInstrument/ManageInstrumentsModal/ManageInstrumentsModal.test.tsx index a075050cb9..a774485984 100644 --- a/packages/instrument-utils/src/storedInstrument/ManageInstrumentsModal/ManageInstrumentsModal.test.tsx +++ b/packages/instrument-utils/src/storedInstrument/ManageInstrumentsModal/ManageInstrumentsModal.test.tsx @@ -120,8 +120,7 @@ describe('ManageInstrumentsModal', () => { ).toBeInTheDocument(); }); - // Skip the test as it is flaky - it.skip('deletes selected instrument and closes modal if user confirms their action', async () => { + it('deletes selected instrument and closes modal if user confirms their action', async () => { jest.spyOn(checkoutService, 'deleteInstrument').mockResolvedValue(checkoutState); render(); diff --git a/packages/instrument-utils/src/storedInstrument/ManageInstrumentsModal/ManageInstrumentsModal.tsx b/packages/instrument-utils/src/storedInstrument/ManageInstrumentsModal/ManageInstrumentsModal.tsx index 1572bc8442..86e662c5c4 100644 --- a/packages/instrument-utils/src/storedInstrument/ManageInstrumentsModal/ManageInstrumentsModal.tsx +++ b/packages/instrument-utils/src/storedInstrument/ManageInstrumentsModal/ManageInstrumentsModal.tsx @@ -189,7 +189,7 @@ class ManageInstrumentsModal extends Component< this.setState( { - isConfirmingDelete: false, + isConfirmingDelete: this.state.isConfirmingDelete, }, onAfterOpen, ); From c301dd06c331d4aff18fa3ddd04e11512954e5e3 Mon Sep 17 00:00:00 2001 From: Richa Patel Date: Wed, 18 Jun 2025 18:48:51 +1000 Subject: [PATCH 3/4] fix(checkout): fix lint issue --- .../ManageInstrumentsModal/ManageInstrumentsModal.tsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/packages/instrument-utils/src/storedInstrument/ManageInstrumentsModal/ManageInstrumentsModal.tsx b/packages/instrument-utils/src/storedInstrument/ManageInstrumentsModal/ManageInstrumentsModal.tsx index 86e662c5c4..09184159ba 100644 --- a/packages/instrument-utils/src/storedInstrument/ManageInstrumentsModal/ManageInstrumentsModal.tsx +++ b/packages/instrument-utils/src/storedInstrument/ManageInstrumentsModal/ManageInstrumentsModal.tsx @@ -186,10 +186,11 @@ class ManageInstrumentsModal extends Component< private handleAfterOpen: () => void = () => { const { onAfterOpen } = this.props; + const { isConfirmingDelete } = this.state; this.setState( { - isConfirmingDelete: this.state.isConfirmingDelete, + isConfirmingDelete, }, onAfterOpen, ); From 7be31010f09bf2b9b6f7368604a1ee914ea43321 Mon Sep 17 00:00:00 2001 From: Richa Patel Date: Thu, 19 Jun 2025 16:03:16 +1000 Subject: [PATCH 4/4] fix(checkout): fix flaky tests - orderConfirmation --- .../src/app/order/OrderConfirmation.test.tsx | 17 +++++++++++++++-- 1 file changed, 15 insertions(+), 2 deletions(-) diff --git a/packages/core/src/app/order/OrderConfirmation.test.tsx b/packages/core/src/app/order/OrderConfirmation.test.tsx index a8d03263fb..d9371ce268 100644 --- a/packages/core/src/app/order/OrderConfirmation.test.tsx +++ b/packages/core/src/app/order/OrderConfirmation.test.tsx @@ -23,6 +23,19 @@ import { CreatedCustomer } from '../guestSignup'; import OrderConfirmation, { OrderConfirmationProps } from './OrderConfirmation'; import { getGatewayOrderPayment, getOrder } from './orders.mock'; +const passwordRegex = /^(?=.*[a-zA-Z])(?=.*[0-9]).*$/; + +// Function to make sure faker generates valid password as per regex +const generateValidPassword = () => { + let password = ''; + + do { + password = faker.internet.password(); + } while (!passwordRegex.test(password)); + + return password; +} + describe('OrderConfirmation', () => { let checkoutService: CheckoutService; let checkoutState: CheckoutSelectors; @@ -131,7 +144,7 @@ describe('OrderConfirmation', () => { }); it('renders create account form, fills in the form and submit data', async () => { - const password = faker.internet.password(); + const password = generateValidPassword(); render(); @@ -151,7 +164,7 @@ describe('OrderConfirmation', () => { }); it('renders set password form, fills in the form and submit data', async () => { - const password = faker.internet.password(); + const password = generateValidPassword(); jest.spyOn(checkoutState.data, 'getOrder').mockReturnValue({ ...getOrder(),