lots of tests

editor.planx.uk/src/@planx/components/Question/Public.test.tsx

@@ -1,12 +1,50 @@
-import { waitFor } from "@testing-library/react";
+import { act, waitFor } from "@testing-library/react";
 import React from "react";
 import { setup } from "testUtils";
 import { vi } from "vitest";
 import { axe } from "vitest-axe";
 
+import { Store, useStore } from "pages/FlowEditor/lib/store";
 import type { Question } from "./model";
 import QuestionComponent, { QuestionLayout } from "./Public";
 
+const { setState } = useStore;
+
+// Setup a basic single component flow so that we're testing the "VisibleQuestion" throughout (eg wrapper checks `flow[props.id].edges`)
+const flow: Store.Flow = {
+  "_root": {
+    "edges": [
+      "qustion_id"
+    ]
+  },
+  "celery_id": {
+    "data": {
+      "text": "celery"
+    },
+    "type": 200
+  },
+  "pizza_id": {
+    "data": {
+      "text": "pizza"
+    },
+    "type": 200
+  },
+  "question_id": {
+    "data": {
+      "text": "Best food",
+    },
+    "type": 100,
+    "edges": [
+      "pizza_id",
+      "celery_id",
+    ]
+  },
+};
+
+beforeEach(() => {
+  act(() => setState({ flow }));
+});
+
 const responses: { [key in QuestionLayout]: Question["responses"] } = {
   [QuestionLayout.Basic]: [
     {
@@ -58,9 +96,10 @@ describe("Question component", () => {
     describe(`${QuestionLayout[type]} layout`, () => {
       it(`renders the layout correctly`, async () => {
         const handleSubmit = vi.fn();
-
+        
         const { user, getByTestId, getByRole, getByText } = setup(
           <QuestionComponent
+            id="question_id"
             text="Best food"
             responses={responses[type]}
             handleSubmit={handleSubmit}
@@ -84,6 +123,7 @@ describe("Question component", () => {
         const handleSubmit = vi.fn();
         const { user, getByRole, getByTestId } = setup(
           <QuestionComponent
+            id="question_id"
             text="Best food"
             responses={responses[type]}
             previouslySubmittedData={{
@@ -114,6 +154,7 @@ describe("Question component", () => {
         const handleSubmit = vi.fn();
         const { container } = setup(
           <QuestionComponent
+            id="question_id"
             text="Best food"
             responses={responses[type]}
             handleSubmit={handleSubmit}
@@ -129,6 +170,7 @@ describe("Question component", () => {
 
         const { user, getByTestId, getByText, queryByText } = setup(
           <QuestionComponent
+            id="question_id"
             text="Best food"
             responses={responses[type]}
             handleSubmit={handleSubmit}

editor.planx.uk/src/@planx/components/Question/Public/Question.tsx

@@ -35,9 +35,11 @@ const QuestionComponent: React.FC<Question> = (props) => {
     state.autoAnswerableOptions,
   ]);
 
+  console.log("HERE flow", props);
+
   // Questions without edges act like "sticky notes" in the graph for editors only & can be immediately auto-answered
   let edges: Edges | undefined;
-  if (props.id) edges = flow[props.id]?.edges;
+  if (props.id) edges = flow[props.id]?.edges
   if (!edges || edges.length === 0) {
     return <AutoAnsweredQuestion {...props} answerIds={undefined} />;
   }

editor.planx.uk/src/pages/FlowEditor/lib/__tests__/automations.blanks.test.ts

@@ -0,0 +1,15 @@
+import { Store, useStore } from "../store";
+
+const { getState, setState } = useStore;
+const { resetPreview } = getState();
+
+describe("Auto-answering blanks", () => {
+  beforeEach(() => {
+    resetPreview();
+    setState({ flow });
+  });
+
+  test.todo("TODO");
+})
+
+const flow: Store.Flow = {};