Merge pull request #2810 from oaknational/feat/PUPIL-967/PUPIL-1033/p…

…rintable-results-page

feat(printable): create style printable results page

package.json

@@ -70,10 +70,10 @@
     "@hubspot/api-client": "^11.1.0",
     "@mux/mux-node": "^8.8.0",
     "@mux/mux-player-react": "2.7.0-canary.0-7c57cdd",
-    "@oaknational/oak-components": "^1.30.0",
+    "@oaknational/oak-components": "^1.33.0",
     "@oaknational/oak-consent-client": "^2.1.0",
     "@oaknational/oak-curriculum-schema": "^1.22.0",
-    "@oaknational/oak-pupil-client": "^2.9.0",
+    "@oaknational/oak-pupil-client": "^2.11.0",
     "@portabletext/react": "^3.0.11",
     "@react-aria/aria-modal-polyfill": "^3.7.8",
     "@sanity/asset-utils": "^1.3.0",

src/__tests__/pages/pupils/lessons/[lessonSlug]/results/[attemptId]/printable.test.tsx

@@ -1,7 +1,125 @@
-import CanonicalResultsPage from "@/pages/pupils/lessons/[lessonSlug]/results/[attemptId]/printable";
+import React from "react";
+import { useOakPupil } from "@oaknational/oak-pupil-client";
+import { screen, waitFor } from "@testing-library/react";
+import { oakDefaultTheme, OakThemeProvider } from "@oaknational/oak-components";
+
+import CanonicalResultsPage, {
+  CanonicalResultsPrintablePageProps,
+  getStaticProps,
+  InnerRender,
+} from "@/pages/pupils/lessons/[lessonSlug]/results/[attemptId]/printable";
+import curriculumApi2023 from "@/node-lib/curriculum-api-2023/__mocks__/index";
+import { lessonBrowseDataFixture } from "@/node-lib/curriculum-api-2023/fixtures/lessonBrowseData.fixture";
+import { lessonContentFixture } from "@/node-lib/curriculum-api-2023/fixtures/lessonContent.fixture";
+import OakError from "@/errors/OakError";
+import renderWithTheme from "@/__tests__/__helpers__/renderWithTheme";
+
+const mockProps: CanonicalResultsPrintablePageProps = {
+  browseData: lessonBrowseDataFixture({}),
+  content: lessonContentFixture({}),
+  attemptId: "attemptId",
+};
+jest.mock("@oaknational/oak-pupil-client", () => ({
+  ...jest.requireActual("@oaknational/oak-pupil-client"),
+  useOakPupil: jest.fn().mockReturnValue({
+    getAttempt: jest.fn(),
+  }),
+}));
+
+jest.mock("@/components/PupilViews/PupilResults", () => ({
+  PupilViewsResults: () => <div>attemptDataRendered</div>,
+}));
 
 describe("CanonicalResultsPage", () => {
   it("should render", () => {
     expect(CanonicalResultsPage).toBeTruthy();
   });
+  describe("innner render", () => {
+    it("should render loading state if no attempt data", () => {
+      const { getByText } = renderWithTheme(
+        <OakThemeProvider theme={oakDefaultTheme}>
+          <InnerRender {...mockProps} />
+        </OakThemeProvider>,
+      );
+      expect(getByText("Loading lesson results...")).toBeInTheDocument();
+    });
+    it("should render PupilViewsResults if attempt data", async () => {
+      const mockAttemptData = { attemptData: "attemptData" };
+      (useOakPupil as jest.Mock).mockReturnValue({
+        getAttempt: jest.fn().mockResolvedValue(mockAttemptData),
+      });
+      renderWithTheme(
+        <OakThemeProvider theme={oakDefaultTheme}>
+          <InnerRender {...mockProps} />
+        </OakThemeProvider>,
+      );
+      expect(screen.getByText("Loading lesson results...")).toBeInTheDocument();
+      await waitFor(() => {
+        expect(
+          screen.queryByText("Loading lesson results..."),
+        ).not.toBeInTheDocument();
+        expect(screen.getByText("attemptDataRendered")).toBeInTheDocument();
+      });
+    });
+  });
+
+  // });
+  describe("pages/pupils/lessons/[lessonSlug]/results/[attemptId]/printable", () => {
+    describe("getStaticProps", () => {
+      it("Should call API:pupilLessonQuery", async () => {
+        await getStaticProps({
+          params: {
+            lessonSlug: "lessonSlug",
+            attemptId: "attemptId",
+          },
+        });
+
+        expect(curriculumApi2023.pupilLessonQuery).toHaveBeenCalledWith({
+          lessonSlug: "lessonSlug",
+        });
+      });
+
+      it("should return props", async () => {
+        const curriculumData = {
+          browseData: lessonBrowseDataFixture({
+            isLegacy: true,
+            unitSlug: "test-unit-slug",
+          }),
+          content: lessonContentFixture({}),
+        };
+
+        (curriculumApi2023.pupilLessonQuery as jest.Mock).mockResolvedValueOnce(
+          curriculumData,
+        );
+
+        const res = (await getStaticProps({
+          params: {
+            lessonSlug: "lessonSlug",
+            attemptId: "attemptId",
+          },
+        })) as {
+          props: CanonicalResultsPrintablePageProps;
+        };
+
+        expect(res.props.browseData).toEqual(curriculumData.browseData);
+        expect(res.props.content).toEqual(curriculumData.content);
+      });
+
+      it("should return 404 if lesson not found", async () => {
+        (curriculumApi2023.pupilLessonQuery as jest.Mock).mockRejectedValueOnce(
+          new OakError({ code: "curriculum-api/not-found" }),
+        );
+        const res = await getStaticProps({
+          params: {
+            lessonSlug: "lessonSlug",
+            attemptId: "attemptId",
+          },
+        });
+
+        expect(res).toEqual({
+          notFound: true,
+        });
+      });
+    });
+  });
 });