From 4214179b61df428f7865d6836ced97e7983c9f66 Mon Sep 17 00:00:00 2001 From: Richard Smith Date: Thu, 16 Nov 2023 12:26:12 +0000 Subject: [PATCH 1/7] Prompt login if back button is clicked on the patient search page --- .../generic/backButton/BackButton.test.tsx | 20 ++++++++++++++++++- .../generic/backButton/BackButton.tsx | 12 +++++++++-- 2 files changed, 29 insertions(+), 3 deletions(-) diff --git a/app/src/components/generic/backButton/BackButton.test.tsx b/app/src/components/generic/backButton/BackButton.test.tsx index b870c1874..51ee7c549 100644 --- a/app/src/components/generic/backButton/BackButton.test.tsx +++ b/app/src/components/generic/backButton/BackButton.test.tsx @@ -5,7 +5,7 @@ import userEvent from '@testing-library/user-event'; import BackButton from './BackButton'; describe('BackButton', () => { - it('navigates to previous page when clicking the back button', async () => { + it('navigates to previous page when clicking the back buttonand not on the search pages', async () => { const history = createMemoryHistory({ initialEntries: ['/', '/example'], initialIndex: 1, @@ -23,4 +23,22 @@ describe('BackButton', () => { expect(history.location.pathname).toBe('/'); }); }); + + it.skip('navigates calls the login handler when clicking the back button on a patient search page', async () => { + const history = createMemoryHistory({ + initialEntries: [], + }); + + render( + + + , + ); + + userEvent.click(screen.getByText('Back')); + + await waitFor(() => { + expect(history.location.pathname).toBe('/'); + }); + }); }); diff --git a/app/src/components/generic/backButton/BackButton.tsx b/app/src/components/generic/backButton/BackButton.tsx index a217e585b..e97aaf526 100644 --- a/app/src/components/generic/backButton/BackButton.tsx +++ b/app/src/components/generic/backButton/BackButton.tsx @@ -1,14 +1,22 @@ import { BackLink } from 'nhsuk-react-components'; import React from 'react'; import type { MouseEvent } from 'react'; -import { useNavigate } from 'react-router'; +import { useNavigate, useLocation } from 'react-router'; +import { endpoints } from '../../../types/generic/endpoints'; +import { useBaseAPIUrl } from '../../../providers/configProvider/ConfigProvider'; const BackButton = () => { const navigate = useNavigate(); + const location = useLocation(); + const baseAPIUrl = useBaseAPIUrl(); const onBack = (e: MouseEvent) => { e.preventDefault(); - navigate(-1); + if (location.pathname.includes('/search')) { + window.location.replace(`${baseAPIUrl}${endpoints.LOGIN}`); + } else { + navigate(-1); + } }; return ( From 240e9d266b13634cbd03d41c1c6f6d261618ffc7 Mon Sep 17 00:00:00 2001 From: Richard Smith Date: Thu, 16 Nov 2023 15:31:37 +0000 Subject: [PATCH 2/7] Make URL criteria for triggering login more specific --- app/src/components/generic/backButton/BackButton.tsx | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/app/src/components/generic/backButton/BackButton.tsx b/app/src/components/generic/backButton/BackButton.tsx index e97aaf526..e12d499bc 100644 --- a/app/src/components/generic/backButton/BackButton.tsx +++ b/app/src/components/generic/backButton/BackButton.tsx @@ -12,7 +12,10 @@ const BackButton = () => { const onBack = (e: MouseEvent) => { e.preventDefault(); - if (location.pathname.includes('/search')) { + if ( + location.pathname.includes('/search/upload') || + location.pathname.includes('/search/patient') + ) { window.location.replace(`${baseAPIUrl}${endpoints.LOGIN}`); } else { navigate(-1); From c1afa8a209ff142f152160bb79007e3e48aedccf Mon Sep 17 00:00:00 2001 From: Richard Smith Date: Thu, 16 Nov 2023 17:15:15 +0000 Subject: [PATCH 3/7] Prevent logout on search result page --- app/src/components/generic/backButton/BackButton.tsx | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/app/src/components/generic/backButton/BackButton.tsx b/app/src/components/generic/backButton/BackButton.tsx index e12d499bc..de3e07101 100644 --- a/app/src/components/generic/backButton/BackButton.tsx +++ b/app/src/components/generic/backButton/BackButton.tsx @@ -13,8 +13,9 @@ const BackButton = () => { const onBack = (e: MouseEvent) => { e.preventDefault(); if ( - location.pathname.includes('/search/upload') || - location.pathname.includes('/search/patient') + (location.pathname.includes('/search/upload') || + location.pathname.includes('/search/patient')) && + !location.pathname.includes('/result') ) { window.location.replace(`${baseAPIUrl}${endpoints.LOGIN}`); } else { From 9c844466c3b02cab18ed2a7e7b7f11e945044d26 Mon Sep 17 00:00:00 2001 From: Richard Smith Date: Fri, 17 Nov 2023 11:27:46 +0000 Subject: [PATCH 4/7] Try exact match for path --- .../generic/backButton/BackButton.tsx | 19 ++++++++++++++----- 1 file changed, 14 insertions(+), 5 deletions(-) diff --git a/app/src/components/generic/backButton/BackButton.tsx b/app/src/components/generic/backButton/BackButton.tsx index de3e07101..f42003c8e 100644 --- a/app/src/components/generic/backButton/BackButton.tsx +++ b/app/src/components/generic/backButton/BackButton.tsx @@ -12,17 +12,26 @@ const BackButton = () => { const onBack = (e: MouseEvent) => { e.preventDefault(); - if ( - (location.pathname.includes('/search/upload') || - location.pathname.includes('/search/patient')) && - !location.pathname.includes('/result') - ) { + if (location.pathname === '/search/upload' || location.pathname === '/search/patient') { window.location.replace(`${baseAPIUrl}${endpoints.LOGIN}`); } else { navigate(-1); } }; + // const onSearchPage = () => { + // (location.pathname.includes('/search/upload') || + // location.pathname.includes('/search/patient')) && + // !( + // location.pathname.includes('/result') || + // location.pathname.includes('/results') || + // location.pathname.includes('/delete') || + // location.pathname.includes('/upload') || + // location.pathname.includes('/submit') || + // location.pathname.includes('/lloyd-george-record') + // ); + // }; + return ( Back From 8e4c29bbe71f2da2c296d8af3b8e532a86f357f3 Mon Sep 17 00:00:00 2001 From: Richard Smith Date: Fri, 17 Nov 2023 11:42:20 +0000 Subject: [PATCH 5/7] Get locations from routes --- .../generic/backButton/BackButton.tsx | 19 +++++-------------- 1 file changed, 5 insertions(+), 14 deletions(-) diff --git a/app/src/components/generic/backButton/BackButton.tsx b/app/src/components/generic/backButton/BackButton.tsx index f42003c8e..fb47da654 100644 --- a/app/src/components/generic/backButton/BackButton.tsx +++ b/app/src/components/generic/backButton/BackButton.tsx @@ -4,6 +4,7 @@ import type { MouseEvent } from 'react'; import { useNavigate, useLocation } from 'react-router'; import { endpoints } from '../../../types/generic/endpoints'; import { useBaseAPIUrl } from '../../../providers/configProvider/ConfigProvider'; +import { routes } from '../../../types/generic/routes'; const BackButton = () => { const navigate = useNavigate(); @@ -12,26 +13,16 @@ const BackButton = () => { const onBack = (e: MouseEvent) => { e.preventDefault(); - if (location.pathname === '/search/upload' || location.pathname === '/search/patient') { + if ( + location.pathname === routes.UPLOAD_SEARCH || + location.pathname === routes.DOWNLOAD_SEARCH + ) { window.location.replace(`${baseAPIUrl}${endpoints.LOGIN}`); } else { navigate(-1); } }; - // const onSearchPage = () => { - // (location.pathname.includes('/search/upload') || - // location.pathname.includes('/search/patient')) && - // !( - // location.pathname.includes('/result') || - // location.pathname.includes('/results') || - // location.pathname.includes('/delete') || - // location.pathname.includes('/upload') || - // location.pathname.includes('/submit') || - // location.pathname.includes('/lloyd-george-record') - // ); - // }; - return ( Back From 1d2380b61118e1cb5d31088a6f6e0cbef26852d5 Mon Sep 17 00:00:00 2001 From: Richard Smith Date: Fri, 17 Nov 2023 16:14:24 +0000 Subject: [PATCH 6/7] Back button tests --- .../generic/backButton/BackButton.test.tsx | 52 +++++++++++++++++-- .../PatientSearchPage.test.tsx | 2 +- 2 files changed, 49 insertions(+), 5 deletions(-) diff --git a/app/src/components/generic/backButton/BackButton.test.tsx b/app/src/components/generic/backButton/BackButton.test.tsx index 51ee7c549..53b2b8df3 100644 --- a/app/src/components/generic/backButton/BackButton.test.tsx +++ b/app/src/components/generic/backButton/BackButton.test.tsx @@ -3,6 +3,8 @@ import { render, screen, waitFor } from '@testing-library/react'; import * as ReactRouter from 'react-router'; import userEvent from '@testing-library/user-event'; import BackButton from './BackButton'; +import { routes } from '../../../types/generic/routes'; +import { endpoints } from '../../../types/generic/endpoints'; describe('BackButton', () => { it('navigates to previous page when clicking the back buttonand not on the search pages', async () => { @@ -24,13 +26,25 @@ describe('BackButton', () => { }); }); - it.skip('navigates calls the login handler when clicking the back button on a patient search page', async () => { + it('calls the login handler when clicking the back button on the upload search page', async () => { + const test_location_prefix = 'http://test'; + const history = createMemoryHistory({ - initialEntries: [], + initialEntries: ['/', '/example'], + initialIndex: 1, }); + //Override the default window.location property as it is not configurable so can't be mocked by jest + Object.defineProperty(window, 'location', { + configurable: true, + enumerable: true, + value: new URL(window.location.href), + }); + + window.location.replace = jest.fn(); + render( - + , ); @@ -38,7 +52,37 @@ describe('BackButton', () => { userEvent.click(screen.getByText('Back')); await waitFor(() => { - expect(history.location.pathname).toBe('/'); + expect(window.location.replace).toBeCalledWith(test_location_prefix + endpoints.LOGIN); + }); + }); + + it('calls the login handler when clicking the back button on the download search page', async () => { + const test_location_prefix = 'http://test'; + + const history = createMemoryHistory({ + initialEntries: ['/', '/example'], + initialIndex: 1, + }); + + //Override the default window.location property as it is not configurable so can't be mocked by jest + Object.defineProperty(window, 'location', { + configurable: true, + enumerable: true, + value: new URL(window.location.href), + }); + + window.location.replace = jest.fn(); + + render( + + + , + ); + + userEvent.click(screen.getByText('Back')); + + await waitFor(() => { + expect(window.location.replace).toBeCalledWith(test_location_prefix + endpoints.LOGIN); }); }); }); diff --git a/app/src/pages/patientSearchPage/PatientSearchPage.test.tsx b/app/src/pages/patientSearchPage/PatientSearchPage.test.tsx index 8fb777daf..63d14c4d9 100644 --- a/app/src/pages/patientSearchPage/PatientSearchPage.test.tsx +++ b/app/src/pages/patientSearchPage/PatientSearchPage.test.tsx @@ -43,7 +43,7 @@ describe('PatientSearchPage', () => { }, ); it.each(authorisedRoles)( - "rdisplays a loading spinner when the patients details are being requested when user role is '%s'", + "displays a loading spinner when the patients details are being requested when user role is '%s'", async (role) => { mockedUseRole.mockReturnValue(role); From 57996952e75c20f6cca62538a192eae306a88dc2 Mon Sep 17 00:00:00 2001 From: Richard Smith Date: Fri, 17 Nov 2023 16:30:51 +0000 Subject: [PATCH 7/7] Linting --- app/src/components/generic/backButton/BackButton.test.tsx | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/app/src/components/generic/backButton/BackButton.test.tsx b/app/src/components/generic/backButton/BackButton.test.tsx index 53b2b8df3..45afd055b 100644 --- a/app/src/components/generic/backButton/BackButton.test.tsx +++ b/app/src/components/generic/backButton/BackButton.test.tsx @@ -5,6 +5,7 @@ import userEvent from '@testing-library/user-event'; import BackButton from './BackButton'; import { routes } from '../../../types/generic/routes'; import { endpoints } from '../../../types/generic/endpoints'; +import { useBaseAPIUrl } from '../../../providers/configProvider/ConfigProvider'; describe('BackButton', () => { it('navigates to previous page when clicking the back buttonand not on the search pages', async () => { @@ -27,7 +28,7 @@ describe('BackButton', () => { }); it('calls the login handler when clicking the back button on the upload search page', async () => { - const test_location_prefix = 'http://test'; + const test_location_prefix = useBaseAPIUrl(); const history = createMemoryHistory({ initialEntries: ['/', '/example'], @@ -57,7 +58,7 @@ describe('BackButton', () => { }); it('calls the login handler when clicking the back button on the download search page', async () => { - const test_location_prefix = 'http://test'; + const test_location_prefix = useBaseAPIUrl(); const history = createMemoryHistory({ initialEntries: ['/', '/example'],