diff --git a/test/pages/visProgPage/VisProg.test.tsx b/test/pages/visProgPage/VisProg.test.tsx
new file mode 100644
index 0000000..96cb342
--- /dev/null
+++ b/test/pages/visProgPage/VisProg.test.tsx
@@ -0,0 +1,30 @@
+import { act } from '@testing-library/react';
+import useFlowStore from '../../../src/pages/VisProgPage/visualProgrammingUI/VisProgStores.tsx';
+import { mockReactFlow } from '../../setupFlowTests.ts';
+
+beforeAll(() => {
+  mockReactFlow();
+});
+
+describe('FlowCanvas onConnect', () => {
+
+  test('adds an edge when onConnect is triggered', () => {
+    const { onConnect} = useFlowStore.getState();
+
+    act(() => {
+      onConnect({
+        source: 'A',
+        target: 'B',
+        sourceHandle: null,
+        targetHandle: null,
+      });
+    });
+
+    const updatedEdges = useFlowStore.getState().edges;
+    expect(updatedEdges).toHaveLength(1);
+    expect(updatedEdges[0]).toMatchObject({
+      source: 'A',
+      target: 'B',
+    });
+  });
+});
\ No newline at end of file
diff --git a/test/setupFlowTests.ts b/test/setupFlowTests.ts
index 973460a..4e5a28c 100644
--- a/test/setupFlowTests.ts
+++ b/test/setupFlowTests.ts
@@ -63,8 +63,7 @@ export const mockReactFlow = () => {
   });
 };
 
-afterEach(() => {
-  cleanup();
-  useFlowStore.setState({ nodes: [], edges: [] });
-});
+beforeEach(() => { useFlowStore.setState({ nodes: [], edges: [] }); })
+
+afterEach(() => { cleanup(); });