diff --git a/src/components/course/data/hooks.jsx b/src/components/course/data/hooks.jsx
index da5d90550..8dcf46086 100644
--- a/src/components/course/data/hooks.jsx
+++ b/src/components/course/data/hooks.jsx
@@ -367,7 +367,7 @@ export const useCourseEnrollmentUrl = ({
* @returns An object containing the Algolia objectId and queryId that led to a page view of the Course page.
*/
export const useExtractAndRemoveSearchParamsFromURL = () => {
- const { search } = useLocation();
+ const { pathname, search } = useLocation();
const navigate = useNavigate();
const [algoliaSearchParams, setAlgoliaSearchParams] = useState({});
@@ -385,13 +385,13 @@ export const useExtractAndRemoveSearchParamsFromURL = () => {
});
queryParams.delete('queryId');
queryParams.delete('objectId');
- navigate({
+ navigate(pathname, {
search: queryParams.toString(),
replace: true,
});
}
},
- [navigate, queryParams],
+ [navigate, queryParams, pathname],
);
return algoliaSearchParams;
diff --git a/src/components/course/data/tests/hooks.test.jsx b/src/components/course/data/tests/hooks.test.jsx
index 1f728fce4..40025c60b 100644
--- a/src/components/course/data/tests/hooks.test.jsx
+++ b/src/components/course/data/tests/hooks.test.jsx
@@ -856,6 +856,7 @@ describe('useExtractAndRemoveSearchParamsFromURL', () => {
beforeEach(() => {
useLocation.mockReturnValue({
+ pathname: '/',
search: '?queryId=123&objectId=abc',
});
});
@@ -869,7 +870,7 @@ describe('useExtractAndRemoveSearchParamsFromURL', () => {
expect(screen.getByText('Query ID: 123')).toBeTruthy();
expect(screen.getByText('Object ID: abc')).toBeTruthy();
expect(mockNavigate).toHaveBeenCalledTimes(1);
- expect(mockNavigate).toHaveBeenCalledWith({ replace: true, search: '' });
+ expect(mockNavigate).toHaveBeenCalledWith('/', { replace: true, search: '' });
});
});
diff --git a/src/components/course/tests/CoursePage.test.jsx b/src/components/course/tests/CoursePage.test.jsx
index 208118605..e92870a2a 100644
--- a/src/components/course/tests/CoursePage.test.jsx
+++ b/src/components/course/tests/CoursePage.test.jsx
@@ -15,7 +15,7 @@ import { LEARNER_CREDIT_SUBSIDY_TYPE as mockLearnerCreditSubsidyType } from '../
import { mockCourseService } from './constants';
const mockGetActiveCourseRun = jest.fn();
-const mockNavigation = jest.fn();
+const mockNavigate = jest.fn();
jest.mock('../data/utils', () => ({
...jest.requireActual('../data/utils'),
@@ -27,7 +27,7 @@ jest.mock('react-router-dom', () => ({
useLocation: () => ({
pathname: '/test-enterprise-uuid/course/test-course-key',
}),
- useNavigate: () => mockNavigation,
+ useNavigate: () => mockNavigate,
useParams: () => ({ enterpriseSlug: 'test-enterprise-uuid', courseKey: 'test-course-key' }),
}));
@@ -223,7 +223,7 @@ describe('CoursePage', () => {
it('Redirects to using course type slug if path does not include it', async () => {
mockGetActiveCourseRun.mockImplementation(() => ({ staff: [] }));
render();
- expect(mockNavigation).toHaveBeenCalledWith('/test-enterprise-uuid/executive-education-2u/course/test-course-key', { replace: true });
+ expect(mockNavigate).toHaveBeenCalledWith('/test-enterprise-uuid/executive-education-2u/course/test-course-key', { replace: true });
expect(screen.getByTestId('course-enrollments-context-provider')).toBeInTheDocument();
expect(screen.getByTestId('course-context-provider')).toBeInTheDocument();
expect(screen.getByTestId('course-page-routes')).toBeInTheDocument();
diff --git a/src/components/dashboard/DashboardPage.jsx b/src/components/dashboard/DashboardPage.jsx
index 214b498af..8bdda90d5 100644
--- a/src/components/dashboard/DashboardPage.jsx
+++ b/src/components/dashboard/DashboardPage.jsx
@@ -24,7 +24,9 @@ import { IntegrationWarningModal } from '../integration-warning-modal';
import SubscriptionExpirationModal from './SubscriptionExpirationModal';
const DashboardPage = () => {
- const { pathname, state } = useLocation();
+ const {
+ pathname, state, search, hash,
+ } = useLocation();
const navigate = useNavigate();
const { enterpriseConfig, authenticatedUser } = useContext(AppContext);
const { username } = authenticatedUser;
@@ -52,9 +54,11 @@ const DashboardPage = () => {
if (state?.activationSuccess) {
const updatedLocationState = { ...state };
delete updatedLocationState.activationSuccess;
- navigate(pathname, { state: updatedLocationState });
+ navigate(pathname, {
+ search, hash, state: updatedLocationState, replace: true,
+ });
}
- }, [pathname, navigate, state]);
+ }, [pathname, navigate, state, search, hash]);
const userFirstName = useMemo(() => authenticatedUser?.name.split(' ').shift(), [authenticatedUser]);
const PAGE_TITLE = `Dashboard - ${enterpriseConfig.name}`;
diff --git a/src/components/dashboard/tests/CourseRecommendations.test.jsx b/src/components/dashboard/tests/CourseRecommendations.test.jsx
index 5eb090a99..d99b818df 100644
--- a/src/components/dashboard/tests/CourseRecommendations.test.jsx
+++ b/src/components/dashboard/tests/CourseRecommendations.test.jsx
@@ -2,7 +2,6 @@ import React from 'react';
import '@testing-library/jest-dom/extend-expect';
import { screen } from '@testing-library/react';
import { AppContext } from '@edx/frontend-platform/react';
-import { Link } from 'react-router-dom';
import userEvent from '@testing-library/user-event';
import {
@@ -10,13 +9,6 @@ import {
} from '../../../utils/tests';
import { CourseRecommendations } from '../main-content';
-jest.mock('react-router-dom', () => ({
- ...jest.requireActual('react-router-dom'),
- Link: jest.fn().mockImplementation(({ to, children }) => (
- {children}
- )),
-}));
-
const mockAuthenticatedUser = { username: 'myspace-tom', name: 'John Doe' };
const defaultAppState = {
@@ -51,11 +43,6 @@ describe('', () => {
renderWithRouter();
const courseRecommendationsButton = screen.getByText('Recommend courses for me');
userEvent.click(courseRecommendationsButton);
- expect(Link).toHaveBeenCalledWith(
- expect.objectContaining({
- to: '/BearsRUs/skills-quiz',
- }),
- expect.any(Object),
- );
+ expect(window.location.pathname).toEqual('/BearsRUs/skills-quiz');
});
});
diff --git a/src/components/enterprise-redirects/EnterpriseCustomerRedirect.jsx b/src/components/enterprise-redirects/EnterpriseCustomerRedirect.jsx
index d7d7f9ff5..10fb3293d 100644
--- a/src/components/enterprise-redirects/EnterpriseCustomerRedirect.jsx
+++ b/src/components/enterprise-redirects/EnterpriseCustomerRedirect.jsx
@@ -28,7 +28,7 @@ const EnterpriseCustomerRedirect = () => {
return ;
}
- return ;
+ return ;
};
export default EnterpriseCustomerRedirect;
diff --git a/src/components/enterprise-redirects/EnterprisePageRedirect.jsx b/src/components/enterprise-redirects/EnterprisePageRedirect.jsx
index af165ce55..ccde400f2 100644
--- a/src/components/enterprise-redirects/EnterprisePageRedirect.jsx
+++ b/src/components/enterprise-redirects/EnterprisePageRedirect.jsx
@@ -1,5 +1,5 @@
import React, { useContext } from 'react';
-import { Navigate, useLocation } from 'react-router-dom';
+import { Navigate, useParams } from 'react-router-dom';
import { AppContext } from '@edx/frontend-platform/react';
import NotFoundPage from '../NotFoundPage';
@@ -12,8 +12,7 @@ import {
const EnterprisePageRedirect = () => {
const { authenticatedUser } = useContext(AppContext);
- const { pathname } = useLocation();
- const redirectPath = pathname.substring(3);
+ const { '*': redirectPath } = useParams();
const { roles } = authenticatedUser;
const selectedEnterpriseUUID = useSelectedEnterpriseUUIDByUserRoles(roles);
const [enterpriseCustomer, isLoading] = useEnterpriseCustomerByUUID(selectedEnterpriseUUID);
@@ -31,10 +30,10 @@ const EnterprisePageRedirect = () => {
}
if (!redirectPath) {
- return ;
+ return ;
}
- return ;
+ return ;
};
export default EnterprisePageRedirect;
diff --git a/src/components/enterprise-redirects/tests/EnterpriseCustomerRedirect.test.jsx b/src/components/enterprise-redirects/tests/EnterpriseCustomerRedirect.test.jsx
index bb477e094..31fc88a06 100644
--- a/src/components/enterprise-redirects/tests/EnterpriseCustomerRedirect.test.jsx
+++ b/src/components/enterprise-redirects/tests/EnterpriseCustomerRedirect.test.jsx
@@ -2,7 +2,6 @@ import React from 'react';
import { AppContext } from '@edx/frontend-platform/react';
import { screen, waitFor } from '@testing-library/react';
import '@testing-library/jest-dom/extend-expect';
-import { mockNavigate } from 'react-router-dom';
import EnterpriseCustomerRedirect from '../EnterpriseCustomerRedirect';
@@ -12,22 +11,6 @@ import { renderWithRouter } from '../../../utils/tests';
jest.mock('../data/service');
-jest.mock('react-router-dom', () => {
- const mockNavigation = jest.fn();
-
- // eslint-disable-next-line react/prop-types
- const Navigate = ({ to }) => {
- mockNavigation(to);
- return
diff --git a/src/components/license-activation/LicenseActivation.jsx b/src/components/license-activation/LicenseActivation.jsx
index 47651ab28..4c50a265d 100644
--- a/src/components/license-activation/LicenseActivation.jsx
+++ b/src/components/license-activation/LicenseActivation.jsx
@@ -41,6 +41,7 @@ const LicenseActivation = () => {
);
}
diff --git a/src/components/license-activation/LicenseActivationPage.jsx b/src/components/license-activation/LicenseActivationPage.jsx
index abc19b1ee..753a24126 100644
--- a/src/components/license-activation/LicenseActivationPage.jsx
+++ b/src/components/license-activation/LicenseActivationPage.jsx
@@ -34,6 +34,7 @@ const LicenseActivationPage = () => {
return (
);
}
diff --git a/src/components/license-activation/tests/LicenseActivationPage.test.jsx b/src/components/license-activation/tests/LicenseActivationPage.test.jsx
index dce81eb11..fc78f1085 100644
--- a/src/components/license-activation/tests/LicenseActivationPage.test.jsx
+++ b/src/components/license-activation/tests/LicenseActivationPage.test.jsx
@@ -1,15 +1,12 @@
import React from 'react';
-import { render, screen } from '@testing-library/react';
+import { screen } from '@testing-library/react';
import { AppContext } from '@edx/frontend-platform/react';
import '@testing-library/jest-dom/extend-expect';
-import {
- MemoryRouter, Route, Routes, mockNavigate,
-} from 'react-router-dom';
-
import LicenseActivationPage from '../LicenseActivationPage';
import { UserSubsidyContext } from '../../enterprise-user-subsidy';
import { LICENSE_STATUS } from '../../enterprise-user-subsidy/data/constants';
+import { renderWithRouter } from '../../../utils/tests';
const TEST_USER_ID = 1;
@@ -29,26 +26,16 @@ jest.mock('../LicenseActivationErrorAlert', () => ({
__esModule: true,
default: () => '
',
}));
-jest.mock('react-router-dom', () => {
- const mockNavigation = jest.fn();
-
- // eslint-disable-next-line react/prop-types
- const Navigate = ({ to }) => {
- mockNavigation(to);
- return
;
- };
-
- return {
- ...jest.requireActual('react-router-dom'),
- Navigate,
- mockNavigate: mockNavigation,
- };
-});
+jest.mock('react-router-dom', () => ({
+ ...jest.requireActual('react-router-dom'),
+ useParams: () => ({
+ activationKey: '00000000-0000-0000-0000-000000000000',
+ }),
+}));
const TEST_ENTERPRISE_UUID = 'test-enterprise-uuid';
const TEST_ENTERPRISE_SLUG = 'test-enterprise-slug';
const TEST_ACTIVATION_KEY = '00000000-0000-0000-0000-000000000000';
-const TEST_ROUTE = `/${TEST_ENTERPRISE_SLUG}/licenses/${TEST_ACTIVATION_KEY}/activate`;
const LicenseActivationPageWithContext = ({
initialUserSubsidyState = {
@@ -69,9 +56,7 @@ const LicenseActivationPageWithContext = ({
}}
>
-
- } />
-
+
);
@@ -84,46 +69,34 @@ describe('
', () => {
it.each(
[undefined, { status: LICENSE_STATUS.ACTIVATED }],
)('should redirect if the user has no license to activate', (subscriptionLicense) => {
- render(
-
-
- ,
- );
+ renderWithRouter(
);
- expect(mockNavigate).toHaveBeenCalledWith(`/${TEST_ENTERPRISE_SLUG}`);
+ expect(window.location.pathname).toContain(`/${TEST_ENTERPRISE_SLUG}`);
});
it('should render error alert if attempting to activate a license that does not belong to the user', () => {
- render(
-
-
- ,
- );
+ renderWithRouter(
);
expect(screen.getByText('
')).toBeInTheDocument();
});
it('should render
if there is a license to activate', () => {
- render(
-
-
- ,
- );
+ renderWithRouter(
);
expect(screen.getByText('
')).toBeInTheDocument();
});
});
diff --git a/src/components/pathway-progress/tests/PathwayProgressListingCard.test.jsx b/src/components/pathway-progress/tests/PathwayProgressListingCard.test.jsx
index 639d679b5..57c62ab83 100644
--- a/src/components/pathway-progress/tests/PathwayProgressListingCard.test.jsx
+++ b/src/components/pathway-progress/tests/PathwayProgressListingCard.test.jsx
@@ -1,17 +1,15 @@
import React from 'react';
import { AppContext } from '@edx/frontend-platform/react';
-import {
- screen, render,
-} from '@testing-library/react';
+import { screen } from '@testing-library/react';
import '@testing-library/jest-dom/extend-expect';
import { camelCaseObject } from '@edx/frontend-platform/utils';
import userEvent from '@testing-library/user-event';
-import { BrowserRouter } from 'react-router-dom';
import { UserSubsidyContext } from '../../enterprise-user-subsidy';
import PathwayProgressCard from '../PathwayProgressCard';
import LearnerPathwayProgressData from '../data/__mocks__/PathwayProgressListData.json';
+import { renderWithRouter } from '../../../utils/tests';
const mockedNavigate = jest.fn();
jest.mock('react-router-dom', () => ({
@@ -47,15 +45,11 @@ const userSubsidyState = {
const pathwayData = camelCaseObject(LearnerPathwayProgressData[0]);
describe('
', () => {
it('renders all data related to pathway progress correctly', () => {
- const { getByAltText } = render(
-
-
- ,
- );
+ const { getByAltText } = renderWithRouter(
);
const { learnerPathwayProgress } = pathwayData;
expect(screen.getByText(learnerPathwayProgress.title)).toBeInTheDocument();
const cardImageNode = getByAltText('dug');
@@ -69,15 +63,11 @@ describe('
', () => {
});
it('redirects to correct page when clicked', () => {
- const { container } = render(
-
-
- ,
- );
+ const { container } = renderWithRouter(
);
userEvent.click(container.firstElementChild);
expect(mockedNavigate).toHaveBeenCalledWith('/test-enterprise-slug/pathway/0a017cbe-0f1c-4e5f-9095-2101823fac93/progress');
});
diff --git a/src/components/pathway-progress/tests/PathwayProgressListingPage.test.jsx b/src/components/pathway-progress/tests/PathwayProgressListingPage.test.jsx
index 16b2ccb28..877f71ff5 100644
--- a/src/components/pathway-progress/tests/PathwayProgressListingPage.test.jsx
+++ b/src/components/pathway-progress/tests/PathwayProgressListingPage.test.jsx
@@ -8,7 +8,6 @@ import '@testing-library/jest-dom/extend-expect';
import { camelCaseObject } from '@edx/frontend-platform/utils';
import userEvent from '@testing-library/user-event';
-import { BrowserRouter, Link } from 'react-router-dom';
import { UserSubsidyContext } from '../../enterprise-user-subsidy';
import PathwayProgressListingPage from '../PathwayProgressListingPage';
import { useInProgressPathwaysData } from '../data/hooks';
@@ -32,13 +31,6 @@ jest.mock('../data/hooks', () => ({
useInProgressPathwaysData: jest.fn(),
}));
-jest.mock('react-router-dom', () => ({
- ...jest.requireActual('react-router-dom'),
- Link: jest.fn().mockImplementation(({ to, children }) => (
-
{children}
- )),
-}));
-
const PathwayProgressListingWithContext = ({
initialAppState = {},
initialUserSubsidyState = {},
@@ -81,14 +73,12 @@ describe('
', () => {
useInProgressPathwaysData.mockImplementation(() => ([camelCaseObject(learnerPathwayData), null]));
await act(async () => {
- render(
-
-
- ,
+ renderWithRouter(
+
,
);
expect(screen.getByText('test 1')).toBeInTheDocument();
expect(screen.getByText('test 2')).toBeInTheDocument();
@@ -134,14 +124,8 @@ describe('
', () => {
/>,
);
userEvent.click(screen.getByText('Explore pathways'));
-
- expect(Link).toHaveBeenCalled();
- expect(Link).toHaveBeenCalledWith(
- expect.objectContaining({
- to: `/${initialAppState.enterpriseConfig.slug}/search?content_type=${CONTENT_TYPE_PATHWAY}`,
- }),
- expect.any(Object),
- );
+ expect(window.location.pathname).toEqual(`/${initialAppState.enterpriseConfig.slug}/search`);
+ expect(window.location.search).toEqual(`?content_type=${CONTENT_TYPE_PATHWAY}`);
});
});
diff --git a/src/components/program-progress/ProgramProgressRedirect.jsx b/src/components/program-progress/ProgramProgressRedirect.jsx
index 015191e12..acd1d8900 100644
--- a/src/components/program-progress/ProgramProgressRedirect.jsx
+++ b/src/components/program-progress/ProgramProgressRedirect.jsx
@@ -6,7 +6,7 @@ const ProgramProgressRedirect = () => {
const { enterpriseConfig } = useContext(AppContext);
const { programUUID } = useParams();
- return
;
+ return
;
};
export default ProgramProgressRedirect;
diff --git a/src/components/program-progress/tests/ProgramListingPage.test.jsx b/src/components/program-progress/tests/ProgramListingPage.test.jsx
index bcb239fb4..db63f5b35 100644
--- a/src/components/program-progress/tests/ProgramListingPage.test.jsx
+++ b/src/components/program-progress/tests/ProgramListingPage.test.jsx
@@ -7,7 +7,6 @@ import {
import '@testing-library/jest-dom/extend-expect';
import userEvent from '@testing-library/user-event';
-import { Link } from 'react-router-dom';
import { UserSubsidyContext } from '../../enterprise-user-subsidy';
import ProgramListingPage from '../ProgramListingPage';
import { useLearnerProgramsListData } from '../data/hooks';
@@ -70,13 +69,6 @@ jest.mock('../data/hooks', () => ({
useLearnerProgramsListData: jest.fn(),
}));
-jest.mock('react-router-dom', () => ({
- ...jest.requireActual('react-router-dom'),
- Link: jest.fn().mockImplementation(({ to, children }) => (
-
{children}
- )),
-}));
-
const ProgramListingWithContext = ({
initialAppState = {},
initialUserSubsidyState = {},
@@ -171,12 +163,8 @@ describe('
', () => {
/>,
);
userEvent.click(screen.getByText('Explore programs'));
- expect(Link).toHaveBeenCalledWith(
- expect.objectContaining({
- to: `/${initialAppState.enterpriseConfig.slug}/search?content_type=${CONTENT_TYPE_PROGRAM}`,
- }),
- expect.any(Object),
- );
+ expect(window.location.pathname).toEqual(`/${initialAppState.enterpriseConfig.slug}/search`);
+ expect(window.location.search).toEqual(`?content_type=${CONTENT_TYPE_PROGRAM}`);
});
});
diff --git a/src/components/skills-quiz/SkillsQuizPage.jsx b/src/components/skills-quiz/SkillsQuizPage.jsx
index 715ed6df5..7ee088e1f 100644
--- a/src/components/skills-quiz/SkillsQuizPage.jsx
+++ b/src/components/skills-quiz/SkillsQuizPage.jsx
@@ -8,7 +8,7 @@ import SkillsQuiz from './SkillsQuiz';
const SkillsQuizPage = () => {
const config = getConfig();
if (!config.ENABLE_SKILLS_QUIZ) {
- return
;
+ return
;
}
return
;
};
diff --git a/src/components/skills-quiz/tests/SearchCourseCard.test.jsx b/src/components/skills-quiz/tests/SearchCourseCard.test.jsx
index af4fd2a49..6f99625e5 100644
--- a/src/components/skills-quiz/tests/SearchCourseCard.test.jsx
+++ b/src/components/skills-quiz/tests/SearchCourseCard.test.jsx
@@ -150,7 +150,6 @@ describe('
', () => {
// handles click
userEvent.click(searchCourseCard);
- // expect(history.entries).toHaveLength(2);
expect(mockedNavigate).toHaveBeenCalledWith(`/${TEST_ENTERPRISE_SLUG}/course/${TEST_COURSE_KEY}`);
});
diff --git a/src/components/skills-quiz/tests/SkillsCourses.test.jsx b/src/components/skills-quiz/tests/SkillsCourses.test.jsx
index 982c3519a..2e81e3a44 100644
--- a/src/components/skills-quiz/tests/SkillsCourses.test.jsx
+++ b/src/components/skills-quiz/tests/SkillsCourses.test.jsx
@@ -5,7 +5,6 @@ import { screen, waitFor } from '@testing-library/react';
import { AppContext } from '@edx/frontend-platform/react';
import '@testing-library/jest-dom/extend-expect';
import { SearchContext } from '@edx/frontend-enterprise-catalog-search';
-import { Link } from 'react-router-dom';
import { UserSubsidyContext } from '../../enterprise-user-subsidy';
import SkillsCourses from '../SkillsCourses';
@@ -25,13 +24,6 @@ jest.mock('@edx/frontend-enterprise-utils', () => ({
sendEnterpriseTrackEvent: jest.fn(),
}));
-jest.mock('react-router-dom', () => ({
- ...jest.requireActual('react-router-dom'),
- Link: jest.fn().mockImplementation(({ to, children }) => (
-
{children}
- )),
-}));
-
const TEST_COURSE_KEY = 'test-course-key';
const SKILLS_HEADING = 'Skills';
const TEST_TITLE = 'Test Title';
@@ -147,9 +139,7 @@ describe('
', () => {
});
userEvent.click(screen.getByTestId('skills-quiz-course-card'));
-
- const linkCalls = Link.mock.calls;
- expect(linkCalls[0][0].to).toEqual(`/${TEST_ENTERPRISE_SLUG}/search?skill_names=test-skill-1`);
+ expect(window.location.pathname).toContain(`/${TEST_ENTERPRISE_SLUG}/course/${TEST_COURSE_KEY}`);
});
test('renders an alert in case of no courses returned', async () => {
diff --git a/src/components/skills-quiz/tests/SkillsQuizPage.test.jsx b/src/components/skills-quiz/tests/SkillsQuizPage.test.jsx
index 9daa55df3..eb72f5489 100644
--- a/src/components/skills-quiz/tests/SkillsQuizPage.test.jsx
+++ b/src/components/skills-quiz/tests/SkillsQuizPage.test.jsx
@@ -36,11 +36,6 @@ jest.mock('@edx/frontend-enterprise-utils', () => ({
sendEnterpriseTrackEvent: jest.fn(),
}));
-jest.mock('react-router-dom', () => ({
- ...jest.requireActual('react-router-dom'),
- Navigate: jest.fn().mockReturnValue(null),
-}));
-
const defaultCouponCodesState = {
couponCodes: [],
loading: false,