diff --git a/client/app/components/Toast/__tests__/Toast.spec.jsx b/client/app/components/Toast/__tests__/Toast.spec.jsx index 5bf653299..cc7aa0d7a 100644 --- a/client/app/components/Toast/__tests__/Toast.spec.jsx +++ b/client/app/components/Toast/__tests__/Toast.spec.jsx @@ -9,20 +9,14 @@ describe('Toast', () => { describe('Toast Type: Alert', () => { it('renders correctly', () => { render( - , + , ); expect(screen).not.toBeNull(); }); it('closes correctly on button click', () => { const { getByRole, container } = render( - , + , ); const toastContent = getByRole('alert'); @@ -35,10 +29,7 @@ describe('Toast', () => { it('closes automatically after 7 seconds', async () => { const { getByRole } = render( - , + , ); const toastContent = getByRole('alert'); diff --git a/client/app/components/Toast/index.jsx b/client/app/components/Toast/index.jsx index 940267985..bbcc16eaf 100644 --- a/client/app/components/Toast/index.jsx +++ b/client/app/components/Toast/index.jsx @@ -34,12 +34,16 @@ export const Toast = ({ alert, notice, appendDashboardClass }: Props): Node => { }; useEffect(() => { + let timer; if (showAlert || showNotice) { - setTimeout(() => { + timer = setTimeout(() => { hideNotice(); hideAlert(); }, 7000); } + return () => { + clearTimeout(timer); + }; }, [showAlert, showNotice]); return ( diff --git a/client/app/stories/Toast.stories.jsx b/client/app/stories/Toast.stories.jsx index b2f23b00f..d33863c11 100644 --- a/client/app/stories/Toast.stories.jsx +++ b/client/app/stories/Toast.stories.jsx @@ -13,7 +13,7 @@ export const noticeToast = Template.bind({}); noticeToast.args = { notice: 'Login successful.', - appendDashboardClass: 'true', + appendDashboardClass: true, }; noticeToast.storyName = 'Toast Type: Notice'; diff --git a/client/app/widgets/Notifications/__tests__/Notifications.spec.jsx b/client/app/widgets/Notifications/__tests__/Notifications.spec.jsx index df3101e6f..336636ce5 100644 --- a/client/app/widgets/Notifications/__tests__/Notifications.spec.jsx +++ b/client/app/widgets/Notifications/__tests__/Notifications.spec.jsx @@ -10,21 +10,22 @@ const button = ; describe('Notifications', () => { it('gets notifications and clears them', async (done) => { - jest + const axiosGetSpy = jest .spyOn(axios, 'get') .mockReturnValueOnce(Promise.resolve({ data: { signed_in: 1 } })) .mockReturnValueOnce( Promise.resolve({ data: { fetch_notifications: ['Hello'] } }), - ); + ) + .mockReturnValue(Promise.resolve()); jest .spyOn(axios, 'delete') .mockReturnValue(Promise.resolve({ data: { ok: true } })); render(); - await waitFor(() => expect(axios.get).toHaveBeenCalledWith('/notifications/signed_in')); - await waitFor(() => expect(axios.get).toHaveBeenCalledWith( + await waitFor(() => expect(axiosGetSpy).toHaveBeenCalledWith('/notifications/signed_in')); + await waitFor(() => expect(axiosGetSpy).toHaveBeenCalledWith( '/notifications/fetch_notifications', )); - expect(axios.get).toHaveBeenCalledTimes(3); + expect(axiosGetSpy).toHaveBeenCalledTimes(3); expect(screen.getByText('Hello')).toBeInTheDocument(); fireEvent.click(screen.getByText('Clear')); await waitFor(() => { diff --git a/client/app/widgets/ToggleLocale/__tests__/ToggleLocale.spec.jsx b/client/app/widgets/ToggleLocale/__tests__/ToggleLocale.spec.jsx index 49d4e73e5..21a4c1da2 100644 --- a/client/app/widgets/ToggleLocale/__tests__/ToggleLocale.spec.jsx +++ b/client/app/widgets/ToggleLocale/__tests__/ToggleLocale.spec.jsx @@ -16,14 +16,18 @@ describe('ToggleLocale', () => { }); it('does nothing if the previous locale is the same as the selected', async () => { - const axiosPostSpy = jest.spyOn(axios, 'post').mockImplementation(() => Promise.resolve()); + const axiosPostSpy = jest + .spyOn(axios, 'post') + .mockImplementation(() => Promise.resolve()); render(component); await userEvent.selectOptions(screen.getByRole('combobox'), 'en'); expect(axiosPostSpy).not.toHaveBeenCalled(); }); it('sets the locale cookie and makes a post request if the selected locale is different from the previous', async () => { - const axiosPostSpy = jest.spyOn(axios, 'post').mockImplementation(() => Promise.resolve()); + const axiosPostSpy = jest + .spyOn(axios, 'post') + .mockImplementation(() => Promise.resolve()); render(component); await userEvent.selectOptions(screen.getByRole('combobox'), 'es'); expect(Cookies.set).toHaveBeenCalledWith('locale', 'es');