From 92aa04c223f2ee462e6db0c258ae45f9809386c1 Mon Sep 17 00:00:00 2001 From: alter-eggo Date: Wed, 1 Nov 2023 05:14:23 +0400 Subject: [PATCH] fix: bug with go back action in send flow, #4355 --- .../edit-nonce-drawer/edit-nonce-drawer.tsx | 10 ++++++---- .../hooks/use-recipient-select-fields.tsx | 2 +- .../stacks/stacks-send-form-confirmation.tsx | 2 +- tests/page-object-models/send.page.ts | 5 +++++ tests/specs/send/send-stx.spec.ts | 16 ++++++++++------ 5 files changed, 23 insertions(+), 12 deletions(-) diff --git a/src/app/features/edit-nonce-drawer/edit-nonce-drawer.tsx b/src/app/features/edit-nonce-drawer/edit-nonce-drawer.tsx index 14fb48d4827..c702ec0a371 100644 --- a/src/app/features/edit-nonce-drawer/edit-nonce-drawer.tsx +++ b/src/app/features/edit-nonce-drawer/edit-nonce-drawer.tsx @@ -37,10 +37,12 @@ export function EditNonceDrawer() { useOnMount(() => setLoadedNextNonce(values.nonce)); - const onGoBack = useCallback( - () => navigate('..' + search, { replace: true }), - [navigate, search] - ); + const onGoBack = useCallback(() => { + if (search) { + return navigate('..' + search, { replace: true }); + } + navigate(-1); + }, [navigate, search]); const onBlur = useCallback(() => validateField('nonce'), [validateField]); diff --git a/src/app/pages/send/send-crypto-asset-form/components/recipient-fields/hooks/use-recipient-select-fields.tsx b/src/app/pages/send/send-crypto-asset-form/components/recipient-fields/hooks/use-recipient-select-fields.tsx index 9c754eaba82..4fe6ef180ac 100644 --- a/src/app/pages/send/send-crypto-asset-form/components/recipient-fields/hooks/use-recipient-select-fields.tsx +++ b/src/app/pages/send/send-crypto-asset-form/components/recipient-fields/hooks/use-recipient-select-fields.tsx @@ -21,7 +21,7 @@ export function useRecipientSelectFields() { const onClickLabelAction = useCallback(() => { setSelectedRecipientField(RecipientFieldType.Address); - navigate(RouteUrls.SendCryptoAssetFormRecipientAccounts); + navigate(RouteUrls.SendCryptoAssetFormRecipientAccounts, { replace: true }); }, [navigate]); // Formik does not provide a field reset diff --git a/src/app/pages/send/send-crypto-asset-form/form/stacks/stacks-send-form-confirmation.tsx b/src/app/pages/send/send-crypto-asset-form/form/stacks/stacks-send-form-confirmation.tsx index 50fc8e4f7ab..84b6cfcf81f 100644 --- a/src/app/pages/send/send-crypto-asset-form/form/stacks/stacks-send-form-confirmation.tsx +++ b/src/app/pages/send/send-crypto-asset-form/form/stacks/stacks-send-form-confirmation.tsx @@ -49,7 +49,7 @@ export function StacksSendFormConfirmation() { navigate('../', { relative: 'path' })} + onGoBack={() => navigate('../', { relative: 'path', replace: true })} title="Review" /> ); diff --git a/tests/page-object-models/send.page.ts b/tests/page-object-models/send.page.ts index 0bcfd8ef671..8e1a631853f 100644 --- a/tests/page-object-models/send.page.ts +++ b/tests/page-object-models/send.page.ts @@ -87,4 +87,9 @@ export class SendPage { async goBack() { await this.page.getByTestId(SharedComponentsSelectors.ModalHeaderBackBtn).click(); } + + async goBackSelectStx() { + await this.goBack(); + await this.selectStxAndGoToSendForm(); + } } diff --git a/tests/specs/send/send-stx.spec.ts b/tests/specs/send/send-stx.spec.ts index bfa79fd6eb0..c48be77231b 100644 --- a/tests/specs/send/send-stx.spec.ts +++ b/tests/specs/send/send-stx.spec.ts @@ -26,11 +26,6 @@ test.describe('send stx', () => { sPage = sendPage; }); - test.afterEach(async () => { - await sPage.page.getByTestId('modal-header-back-button').click(); - await sPage.selectStxAndGoToSendForm(); - }); - test('that send max button sets available balance minus fee', async () => { await sPage.amountInput.fill('.0001'); await sPage.amountInput.clear(); @@ -38,6 +33,7 @@ test.describe('send stx', () => { await sPage.sendMaxButton.click(); await sPage.amountInput.blur(); test.expect(await sPage.amountInput.inputValue()).toBeTruthy(); + await sPage.goBackSelectStx(); }); test('that empty memo on preview matches default empty value', async () => { @@ -52,6 +48,7 @@ test.describe('send stx', () => { .getByTestId(SharedComponentsSelectors.InfoCardRowValue) .innerText(); test.expect(confirmationMemo).toEqual(emptyMemoPreviewValue); + await sPage.goBack(); }); test('that asset value, recipient, memo and fees on preview match input', async () => { @@ -84,9 +81,13 @@ test.describe('send stx', () => { .getByTestId(SharedComponentsSelectors.InfoCardRowValue) .innerText(); test.expect(confirmationMemo2).toEqual(memo); + await sPage.goBack(); }); test.describe('send form validation', () => { + test.afterEach(async () => { + await sPage.goBackSelectStx(); + }); test('that the amount must be a number', async () => { await sPage.amountInput.fill('aaaaaa'); await sPage.amountInput.blur(); @@ -128,7 +129,6 @@ test.describe('send stx', () => { await sPage.previewSendTxButton.click(); const errorMsg = await sPage.formInputErrorLabel.innerText(); test.expect(errorMsg).toContain(FormErrorMessages.SameAddress); - await sPage.goBack(); }); test('that valid addresses are accepted', async () => { @@ -141,6 +141,10 @@ test.describe('send stx', () => { }); test.describe('send form preview', () => { + test.afterEach(async () => { + await sPage.goBack(); + await sPage.goBackSelectStx(); + }); test('that it shows preview of tx details to be confirmed', async () => { await sPage.amountInput.fill('0.000001'); await sPage.recipientInput.fill(TEST_TESTNET_ACCOUNT_2_STX_ADDRESS);