feat(add integration tests against CMS)

.github/workflows/ci-pipeline.yml

@@ -39,8 +39,19 @@ jobs:
     outputs:
       content_checksum: ${{ steps.checksum.outputs.content_checksum }}
 
-  verify-local-e2e:
+  run-integration-tests:
     needs: [get-content-file]
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - uses: ./.github/actions/cached-checkout-install
+      - uses: actions/download-artifact@v4
+        with:
+          name: content-file
+      - run: npm run test:integration
+
+  verify-local-e2e:
+    needs: [run-integration-tests]
     uses: ./.github/workflows/e2e-test.yml
     with:
       require-published-app: false

env.d.ts

@@ -1,2 +1,12 @@
 /// <reference types="vite/client" />
 /// <reference types="@remix-run/node" />
+import type { Assertion } from "vitest";
+
+interface CustomMatchers<R = unknown> {
+  toContainStrapiPage: (strapiPage: string | null) => R;
+}
+
+declare module "vitest" {
+  interface Assertion<T = any> extends CustomMatchers<T> {}
+  interface AsymmetricMatchersContaining extends CustomMatchers {}
+}

package.json

@@ -28,11 +28,12 @@
     "size": "remix vite:build --logLevel error && size-limit",
     "start:storybook": "storybook dev -p 6006",
     "start": "NODE_ENV=production node ./server.js",
-    "test:coverage": "vitest run --coverage",
+    "test:coverage": "vitest run --project unit --coverage",
     "test:e2e:ui": "npx playwright test --ui",
     "test:e2e": "npx playwright test",
-    "test": "vitest run",
-    "test:watch": "vitest watch",
+    "test": "vitest run --project unit",
+    "test:watch": "vitest run --project unit watch",
+    "test:integration": "vitest run --project integration",
     "typecheck": "tsc",
     "typecheck:watch": "tsc -w",
     "update:courtData": "tsx ./app/services/gerichtsfinder/encryptedStorage.ts updateZip",

tests/integration/util.test.ts

@@ -0,0 +1,181 @@
+import { z } from "zod";
+import {
+  compileAllStrapiPages,
+  getAllPossibleStates,
+  ignoreList,
+  invertStrapiFormFields,
+  zodKeys,
+} from "tests/integration/util";
+
+describe("integration testing helper functions", () => {
+  describe("compileAllStrapiPages", () => {
+    it("should return a flat array of all strapi page names", () => {
+      const result = compileAllStrapiPages("/beratungshilfe/antrag", {
+        "/beratungshilfe/antrag": {
+          "vorab-check-pages": [
+            {
+              // @ts-expect-error missing attributes
+              attributes: {
+                stepId: "step-1",
+                locale: "de",
+              },
+            },
+          ],
+          "form-flow-pages": [
+            {
+              // @ts-expect-error missing attributes
+              attributes: {
+                stepId: "step-2",
+                locale: "de",
+              },
+            },
+          ],
+          "result-pages": [
+            {
+              // @ts-expect-error missing attributes
+              attributes: {
+                stepId: "step-3",
+                locale: "de",
+              },
+            },
+          ],
+        },
+      });
+
+      expect(result.length).toBe(3);
+      expect(result).toEqual(
+        expect.arrayContaining(["step-1", "step-2", "step-3"]),
+      );
+    });
+
+    it("should filter out pages with locale other than the default locale", () => {
+      const result = compileAllStrapiPages("/beratungshilfe/antrag", {
+        "/beratungshilfe/antrag": {
+          "vorab-check-pages": [
+            {
+              // @ts-expect-error missing attributes
+              attributes: {
+                stepId: "step-1",
+                locale: "en",
+              },
+            },
+            {
+              // @ts-expect-error missing attributes
+              attributes: {
+                stepId: "step-1",
+                locale: "en",
+              },
+            },
+          ],
+          "form-flow-pages": [],
+          "result-pages": [],
+        },
+      });
+      expect(result.length).toBe(0);
+    });
+  });
+
+  describe("zodKeys", () => {
+    it("should recursively return all keys of a nested zod schema", () => {
+      const schemaKeys = zodKeys(
+        z.object({
+          a: z.string(),
+          b: z.number(),
+          c: z.object({ d: z.string() }),
+          e: z.array(z.object({ f: z.string() })),
+        }),
+      );
+
+      expect(schemaKeys).toEqual(["a", "b", "c.d", "e#f"]);
+    });
+
+    it("should return an empty array when schema is null or undefined", () => {
+      // @ts-expect-error
+      expect(zodKeys(null)).toEqual([]);
+      // @ts-expect-error
+      expect(zodKeys(undefined)).toEqual([]);
+    });
+
+    it("should return the keys of a nested object inside of an array", () => {
+      const schemaKeys = zodKeys(
+        z.object({
+          a: z.array(
+            z.object({ b: z.string(), c: z.object({ d: z.string() }) }),
+          ),
+        }),
+      );
+      expect(schemaKeys).toEqual(["a#b", "a#c.d"]);
+    });
+  });
+
+  describe("allPossibleStates", () => {
+    it("should return an array of all possible states", () => {
+      const allPossibleStates = getAllPossibleStates({
+        config: {
+          states: {
+            state1: {},
+            state2: {
+              states: {
+                state3: {},
+              },
+            },
+          },
+        },
+        flowType: "formFlow",
+        guards: {},
+      });
+      expect(allPossibleStates).toEqual([
+        "/state1",
+        "/state2",
+        "/state2/state3",
+      ]);
+    });
+
+    it.each(ignoreList)("should skip state %s", (ignoredPath: string) => {
+      const allPossibleStates = getAllPossibleStates({
+        config: {
+          states: {
+            [ignoredPath]: {},
+          },
+        },
+        flowType: "formFlow",
+        guards: {},
+      });
+      expect(allPossibleStates).toEqual([]);
+    });
+
+    it("should skip redundant states with an initial state", () => {
+      const allPossibleStates = getAllPossibleStates({
+        config: {
+          states: {
+            state1: {},
+            state2: {
+              initial: "state3",
+              states: {
+                state3: {},
+              },
+            },
+          },
+        },
+        flowType: "formFlow",
+        guards: {},
+      });
+      expect(allPossibleStates).toEqual(["/state1", "/state2/state3"]);
+    });
+  });
+
+  describe("invertStrapiFormFields", () => {
+    it("should reverse a FormFieldsMap to list the field names first, then the paths", () => {
+      const result = invertStrapiFormFields({
+        field: ["path1", "path2"],
+        field2: ["path3", "path4"],
+      });
+      expect(result).toEqual([
+        ["path1", "field"],
+        ["path2", "field"],
+        ["path3", "field2"],
+        ["path4", "field2"],
+      ]);
+    });
+  });
+});

tests/integration/util.ts

@@ -0,0 +1,106 @@
+import { z } from "zod";
+import type { FlowId } from "~/domains/flowIds";
+import type { Flow } from "~/domains/flows.server";
+import type { FormFieldsMap } from "~/services/cms/fetchAllFormFields";
+import { defaultLocale } from "~/services/cms/models/StrapiLocale";
+import { flowPageSchemas } from "~/services/cms/schemas";
+
+const _flowPageSchemas = z.object(flowPageSchemas);
+type FlowPageSchemas = z.infer<typeof _flowPageSchemas>;
+type StrapiPages = FlowPageSchemas & { formFields: FormFieldsMap };
+export type AllStrapiData = Record<FlowId, StrapiPages>;
+
+/**
+ * These pages do not exist in strapi and instead exist in our own codebase
+ */
+export const ignoreList = [
+  "redirect-vorabcheck-ergebnis",
+  "partner-start",
+  "abschluss",
+  "unterhalt", // antragstellende person unterhalt
+];
+
+export function compileAllStrapiPages(
+  flowId: FlowId,
+  allStrapiData: AllStrapiData,
+) {
+  const {
+    "vorab-check-pages": vorabCheckPages,
+    "form-flow-pages": formFlowPages,
+    "result-pages": resultPages,
+  } = allStrapiData[flowId];
+  return [...formFlowPages, ...resultPages, ...vorabCheckPages]
+    .filter((page) => page.attributes.locale === defaultLocale)
+    .map((page) => page.attributes.stepId);
+}
+
+/**
+ * Helper Function to recursively retrieve all keys from a zod schema
+ * Massive if branching is needed, as Zod has different ways of encoding
+ * a schema's keys for each data type
+ */
+export function zodKeys<T extends z.ZodTypeAny>(schema: T): string[] {
+  // make sure schema is not null or undefined
+  if (schema === null || schema === undefined) return [];
+  // check if schema is nullable or optional
+  if (schema instanceof z.ZodNullable || schema instanceof z.ZodOptional)
+    return zodKeys(schema.unwrap());
+  // check if schema is an array
+  if (schema instanceof z.ZodArray) {
+    return zodKeys(schema.element);
+  }
+  // check if schema is a ZodEffect
+  if (schema instanceof z.ZodEffects) {
+    return zodKeys(schema._def?.schema ?? schema);
+  }
+  // check if schema is an object
+  if (schema instanceof z.ZodObject) {
+    // get key/value pairs from schema
+    const entries = Object.entries(schema.shape);
+    // loop through key/value pairs
+    return entries.flatMap(([key, value]) => {
+      // get nested keys
+      const nested =
+        value instanceof z.ZodType
+          ? zodKeys(value).map(
+              (subKey) =>
+                `${key}${value instanceof z.ZodArray ? "#" : "."}${subKey}`,
+            )
+          : [];
+      // return nested keys
+      return nested.length ? nested : key;
+    });
+  }
+  // return empty array
+  return [];
+}
+
+export function getAllPossibleStates(flow: Flow) {
+  const allPossibleStates: string[] = [];
+
+  function _getAllPossibleStates(
+    states: Flow["config"]["states"],
+    path: string,
+  ) {
+    for (const state in states) {
+      if (ignoreList.includes(state)) continue;
+      const stateString = `${path}/${state.replace(/^ergebnis\//, "")}`;
+      if (!states[state].initial) {
+        allPossibleStates.push(stateString);
+      }
+      if (states[state].states) {
+        _getAllPossibleStates(states[state].states, stateString);
+      }
+    }
+  }
+
+  _getAllPossibleStates(flow.config.states, "");
+
+  return allPossibleStates;
+}
+
+export function invertStrapiFormFields(formFields: FormFieldsMap) {
+  return Object.entries(formFields)
+    .map(([key, values]) => values.map((value) => [value, key]))
+    .flat();
+}