Files
pepperplus-ui/test/pages/visProgPage/visualProgrammingUI/VisProgStores.test.tsx
2025-10-25 14:59:34 +02:00

107 lines
3.0 KiB
TypeScript

import {act} from '@testing-library/react';
import useFlowStore from '../../../../src/pages/VisProgPage/visualProgrammingUI/VisProgStores.tsx';
import { mockReactFlow } from '../../../setupFlowTests.ts';
beforeAll(() => {
mockReactFlow();
});
describe('FlowStore Functionality', () => {
describe('Node changes', () => {
// currently just using a single function from the ReactFlow library,
// so testing would mean we are testing already tested behavior.
// if implementation gets modified tests should be added for custom behavior
});
describe('Edge changes', () => {
// currently just using a single function from the ReactFlow library,
// so testing would mean we are testing already tested behavior.
// if implementation gets modified tests should be added for custom behavior
})
describe('ReactFlow 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',
});
});
});
describe('ReactFlow onReconnect', () => {
});
describe('ReactFlow onReconnectStart', () => {
});
describe('ReactFlow onReconnectEnd', () => {
});
describe('ReactFlow setNodes', () => {
test('sets nodes to the provided list of nodes', () => {
const {setNodes} = useFlowStore.getState();
act(() => {
setNodes([
{
id: 'start',
type: 'start',
position: {x: 0, y: 0},
data: {label: 'start'}
},
{
id: 'end',
type: 'end',
position: {x: 0, y: 300},
data: {label: 'End'}
}
]);
});
const updatedNodes = useFlowStore.getState().nodes;
expect(updatedNodes).toHaveLength(2);
expect(updatedNodes[0]).toMatchObject({
id: 'start',
type: 'start',
position: {x: 0, y: 0},
data: {label: 'start'}
});
expect(updatedNodes[1]).toMatchObject({
id: 'end',
type: 'end',
position: {x: 0, y: 300},
data: {label: 'End'}
});
});
});
describe('ReactFlow setEdges', () => {
test('sets edges to the provided list of edges', () => {
const {setEdges} = useFlowStore.getState();
act(() => {
setEdges([
{
id: 'start-end',
source: 'start',
target: 'end'
}
]);
});
const updatedEdges = useFlowStore.getState().edges;
expect(updatedEdges).toHaveLength(1);
expect(updatedEdges[0]).toMatchObject({
id: 'start-end',
source: 'start',
target: 'end'
});
});
});
});