diff --git a/frontends/main/package.json b/frontends/main/package.json index 57910a8d45..c88280b983 100644 --- a/frontends/main/package.json +++ b/frontends/main/package.json @@ -12,7 +12,7 @@ "dependencies": { "@ebay/nice-modal-react": "^1.2.13", "@emotion/cache": "^11.13.1", - "@mitodl/course-search-utils": "mitodl/course-search-utils.git#jk/5244-support-for-nextjs", + "@mitodl/course-search-utils": "^3.2.3", "@remixicon/react": "^4.2.0", "@tanstack/react-query": "^4.36.1", "api": "workspace:*", diff --git a/frontends/ol-test-utilities/src/mocks/nextNavigation.test.ts b/frontends/ol-test-utilities/src/mocks/nextNavigation.test.ts index 8d3efe111c..d26652f00e 100644 --- a/frontends/ol-test-utilities/src/mocks/nextNavigation.test.ts +++ b/frontends/ol-test-utilities/src/mocks/nextNavigation.test.ts @@ -1,4 +1,4 @@ -import { renderHook } from "@testing-library/react" +import { act, renderHook } from "@testing-library/react" import { nextNavigationMocks } from "./nextNavigation" import mockRouter from "next-router-mock" import { createDynamicRouteParser } from "next-router-mock/dynamic-routes" @@ -51,4 +51,34 @@ describe("Mock Navigation", () => { const { result } = renderHook(() => nextNavigationMocks.useParams()) expect(result.current).toEqual({ id: "bar", other: "baz" }) }) + + test("router.push", () => { + mockRouter.useParser(createDynamicRouteParser(["x"])) + mockRouter.setCurrentUrl("/dynamic/bar/baz?a=1&b=2") + const { result } = renderHook(() => nextNavigationMocks.useRouter()) + act(() => { + result.current.push( + "/dynamic/foo", + // @ts-expect-error The type signature of mockRouter.push is for old pages router. + // The 2nd arg here is for what our application uses, the app router + { scroll: false }, + ) + }) + expect(mockRouter.asPath).toBe("/dynamic/foo") + }) + + test("router.replace", () => { + mockRouter.useParser(createDynamicRouteParser(["x"])) + mockRouter.setCurrentUrl("/dynamic/bar/baz?a=1&b=2") + const { result } = renderHook(() => nextNavigationMocks.useRouter()) + act(() => { + result.current.replace( + "/dynamic/foo", + // @ts-expect-error The type signature of mockRouter.replace is for old pages router. + // The 2nd arg here is for what our application uses, the app router + { scroll: false }, + ) + }) + expect(mockRouter.asPath).toBe("/dynamic/foo") + }) }) diff --git a/frontends/ol-test-utilities/src/mocks/nextNavigation.ts b/frontends/ol-test-utilities/src/mocks/nextNavigation.ts index 9cc1119f3d..978e230150 100644 --- a/frontends/ol-test-utilities/src/mocks/nextNavigation.ts +++ b/frontends/ol-test-utilities/src/mocks/nextNavigation.ts @@ -37,6 +37,21 @@ const convertObjectToUrlParams = (obj: ParsedUrlQuery): [string, string][] => : [[key, value] as [string, string]], ) +/** + * memoryRouter is a mock for the older pages router + * this file adapts it for the app router + * but older router had 3-arg push and replace (url, as, options) + * new router has 2-arg (url, options). + * + * Our application code may call the 2-arg version which 2nd arg as options, + * which causes problems for the mock. Let's just limit the mock to the first + * argument. The options don't really make sense in a JSDom environment anyway. + */ +const originalPush = mocks.memoryRouter.push +const originalReplace = mocks.memoryRouter.replace +mocks.memoryRouter.push = (url) => originalPush(url) +mocks.memoryRouter.replace = (url) => originalReplace(url) + export const nextNavigationMocks = { ...mocks, notFound: jest.fn(), diff --git a/yarn.lock b/yarn.lock index 50bd44652e..b320c09f00 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3677,18 +3677,17 @@ __metadata: languageName: node linkType: hard -"@mitodl/course-search-utils@mitodl/course-search-utils.git#jk/5244-support-for-nextjs": - version: 3.1.5 - resolution: "@mitodl/course-search-utils@https://github.com/mitodl/course-search-utils.git#commit=fad9ff4f9c7025d6159d94c83b6e93d3d70237ec" +"@mitodl/course-search-utils@npm:^3.2.3": + version: 3.2.3 + resolution: "@mitodl/course-search-utils@npm:3.2.3" dependencies: - "@mitodl/open-api-axios": "npm:^2024.8.21" + "@mitodl/open-api-axios": "npm:2024.9.16" + "@remixicon/react": "npm:^4.2.0" axios: "npm:^1.6.7" fuse.js: "npm:^7.0.0" - query-string: "npm:^6.13.1" peerDependencies: "@types/history": ^4.9 - history: ^4.9 || ^5.0.0 - next: ^14.2.6 + next: ^14.2.7 react: ^16.13.1 react-router: ^6.22.2 peerDependenciesMeta: @@ -3700,17 +3699,17 @@ __metadata: optional: true react-router: optional: true - checksum: 10/72397b1061fd38a4a86c7203616ae9f6d773280cbb604648da4a61b6ef1388b655059a1f2ea2a192bfc799490beb26e8776bf97577e366115185a201def0e9b3 + checksum: 10/57484acd65d63289f9c539f687af738a079b233848b0c4b25855691491c3a15ff8f98e06d3065519aaee980f10a9d351507fd05abeb95cd667f0b9358d3d8521 languageName: node linkType: hard -"@mitodl/open-api-axios@npm:^2024.8.21": - version: 2024.9.18 - resolution: "@mitodl/open-api-axios@npm:2024.9.18" +"@mitodl/open-api-axios@npm:2024.9.16": + version: 2024.9.16 + resolution: "@mitodl/open-api-axios@npm:2024.9.16" dependencies: "@types/node": "npm:^20.11.19" axios: "npm:^1.6.5" - checksum: 10/ef1b53acaeb57c75084e94be377067ac45d647c852d1aae36246cf58e15dcb710c263910271c63ae6604fa015e56fa63686ecc745999abcf6e39b53af6cb34e3 + checksum: 10/ff40f62d087e3168e1d9ba0887cc41d3db4d2eb868e43317feb18510cf1f7d9b535d32acd478b9dd1bacfee8ea7e4967d2ed84499f5bf431317c614555f19416 languageName: node linkType: hard @@ -9079,13 +9078,6 @@ __metadata: languageName: node linkType: hard -"decode-uri-component@npm:^0.2.0": - version: 0.2.2 - resolution: "decode-uri-component@npm:0.2.2" - checksum: 10/17a0e5fa400bf9ea84432226e252aa7b5e72793e16bf80b907c99b46a799aeacc139ec20ea57121e50c7bd875a1a4365928f884e92abf02e21a5a13790a0f33e - languageName: node - linkType: hard - "dedent@npm:^0.7.0": version: 0.7.0 resolution: "dedent@npm:0.7.0" @@ -11003,13 +10995,6 @@ __metadata: languageName: node linkType: hard -"filter-obj@npm:^1.1.0": - version: 1.1.0 - resolution: "filter-obj@npm:1.1.0" - checksum: 10/9d681939eec2b4b129cb4f307b7e93d954a0657421d4e5357d86093b26d3f4f570909ed43717dcfd62428b3cf8cddd9841b35f9d40d12ac62cfabaa677942593 - languageName: node - linkType: hard - "filter-obj@npm:^2.0.2": version: 2.0.2 resolution: "filter-obj@npm:2.0.2" @@ -14250,7 +14235,7 @@ __metadata: "@ebay/nice-modal-react": "npm:^1.2.13" "@emotion/cache": "npm:^11.13.1" "@faker-js/faker": "npm:^8.4.1" - "@mitodl/course-search-utils": "mitodl/course-search-utils.git#jk/5244-support-for-nextjs" + "@mitodl/course-search-utils": "npm:^3.2.3" "@remixicon/react": "npm:^4.2.0" "@tanstack/react-query": "npm:^4.36.1" "@testing-library/jest-dom": "npm:^6.4.8" @@ -17664,18 +17649,6 @@ __metadata: languageName: node linkType: hard -"query-string@npm:^6.13.1": - version: 6.14.1 - resolution: "query-string@npm:6.14.1" - dependencies: - decode-uri-component: "npm:^0.2.0" - filter-obj: "npm:^1.1.0" - split-on-first: "npm:^1.0.0" - strict-uri-encode: "npm:^2.0.0" - checksum: 10/95f5a372f777b4fb5bdae5a2d85961cf3894d466cfc3a0cc799320d5ed633af935c0d96ee5d2b1652c02888e749831409ca5dd5eb388ce1014a9074024a22840 - languageName: node - linkType: hard - "querystring-es3@npm:^0.2.1": version: 0.2.1 resolution: "querystring-es3@npm:0.2.1" @@ -19205,13 +19178,6 @@ __metadata: languageName: node linkType: hard -"split-on-first@npm:^1.0.0": - version: 1.1.0 - resolution: "split-on-first@npm:1.1.0" - checksum: 10/16ff85b54ddcf17f9147210a4022529b343edbcbea4ce977c8f30e38408b8d6e0f25f92cd35b86a524d4797f455e29ab89eb8db787f3c10708e0b47ebf528d30 - languageName: node - linkType: hard - "sprintf-js@npm:^1.1.3": version: 1.1.3 resolution: "sprintf-js@npm:1.1.3" @@ -19334,13 +19300,6 @@ __metadata: languageName: node linkType: hard -"strict-uri-encode@npm:^2.0.0": - version: 2.0.0 - resolution: "strict-uri-encode@npm:2.0.0" - checksum: 10/eaac4cf978b6fbd480f1092cab8b233c9b949bcabfc9b598dd79a758f7243c28765ef7639c876fa72940dac687181b35486ea01ff7df3e65ce3848c64822c581 - languageName: node - linkType: hard - "string-convert@npm:^0.2.0": version: 0.2.1 resolution: "string-convert@npm:0.2.1"