add tests for frame hierarchy

client/src/stores/workflowEditorCommentStore.test.ts

@@ -17,7 +17,7 @@ const freehandComment: FreehandWorkflowComment = {
     },
     id: 0,
     position: [100, 100],
-    size: [0, 0],
+    size: [100, 100],
 };
 
 const textComment: TextWorkflowComment = {
@@ -28,8 +28,8 @@ const textComment: TextWorkflowComment = {
         text: "Hello World",
     },
     id: 1,
-    position: [100, 100],
-    size: [0, 0],
+    position: [100, 200],
+    size: [50, 50],
 };
 
 const markdownComment: MarkdownWorkflowComment = {
@@ -39,8 +39,8 @@ const markdownComment: MarkdownWorkflowComment = {
         text: "# Hello World",
     },
     id: 2,
-    position: [100, 100],
-    size: [0, 0],
+    position: [200, 100],
+    size: [100, 100],
 };
 
 const frameComment: FrameWorkflowComment = {
@@ -50,10 +50,51 @@ const frameComment: FrameWorkflowComment = {
         title: "My Frame",
     },
     id: 3,
-    position: [100, 100],
-    size: [0, 0],
+    position: [0, 0],
+    size: [500, 500],
 };
 
+const frameCommentTwo: FrameWorkflowComment = {
+    type: "frame",
+    colour: "none",
+    data: {
+        title: "My Frame",
+    },
+    id: 4,
+    position: [50, 50],
+    size: [180, 180],
+};
+
+jest.mock("@/stores/workflowStepStore", () => ({
+    useWorkflowStepStore: jest.fn(() => ({
+        steps: {
+            0: {
+                id: 0,
+                position: { left: 0, top: 0 },
+            },
+            1: {
+                id: 1,
+                position: { left: 100, top: 100 },
+            },
+        },
+    })),
+}));
+
+jest.mock("@/stores/workflowEditorStateStore", () => ({
+    useWorkflowStateStore: jest.fn(() => ({
+        stepPosition: {
+            0: {
+                width: 200,
+                height: 200,
+            },
+            1: {
+                width: 10,
+                height: 10,
+            },
+        },
+    })),
+}));
+
 describe("workflowEditorCommentStore", () => {
     beforeEach(() => {
         setActivePinia(createPinia());
@@ -127,4 +168,39 @@ describe("workflowEditorCommentStore", () => {
         expect(commentStore.isJustCreated(100)).toBe(false);
         expect(commentStore.highestCommentId).toBe(-1);
     });
+
+    it("determines which comments are in what frames", () => {
+        const commentStore = useWorkflowCommentStore("mock-id");
+        commentStore.addComments([freehandComment, textComment, markdownComment, frameComment, frameCommentTwo]);
+
+        commentStore.resolveCommentsInFrames();
+
+        const frame = commentStore.commentsRecord[frameComment.id];
+        const frameTwo = commentStore.commentsRecord[frameCommentTwo.id];
+
+        expect(frameTwo?.child_comments?.length).toBe(1);
+        expect(frameTwo?.child_comments).toContain(freehandComment.id);
+
+        expect(frame?.child_comments?.length).toBe(3);
+        expect(frame?.child_comments).toContain(frameCommentTwo.id);
+        expect(frame?.child_comments).toContain(markdownComment.id);
+        expect(frame?.child_comments).toContain(textComment.id);
+        expect(frame?.child_comments).not.toContain(freehandComment.id);
+    });
+
+    it("determines which steps are in what frames", () => {
+        const commentStore = useWorkflowCommentStore("mock-id");
+        commentStore.addComments([frameComment, frameCommentTwo]);
+
+        commentStore.resolveStepsInFrames();
+
+        const frame = commentStore.commentsRecord[frameComment.id];
+        const frameTwo = commentStore.commentsRecord[frameCommentTwo.id];
+
+        expect(frame?.child_steps).toContain(0);
+        expect(frameTwo?.child_steps).toContain(1);
+
+        expect(frame?.child_steps).not.toContain(1);
+        expect(frameTwo?.child_steps).not.toContain(0);
+    });
 });