pepperplus/pepperplus-ui
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

feat: added basic functionality for editable name bar

Browse Source
This commit is contained in:
Gerla, J. (Justin)
2025-11-11 13:50:45 +00:00
parent 04818f48d4
commit d4d1aecb8c
6 changed files with 298 additions and 79 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
test/pages/visProgPage/visualProgrammingUI/GraphReducer.test.ts
View File

@@ -955,7 +955,7 @@ describe('Graph Reducer Tests', () => {
state: onlyStartEnd,
expected: [],
}
])("`tests state: $state.name`", ({state, expected}) => {
])(`tests state: $state.name`, ({state, expected}) => {
useFlowStore.setState({nodes: state.nodes, edges: state.edges});
const output = graphReducer(); // uses default reducers
expect(output).toEqual(expected);

128
test/pages/visProgPage/visualProgrammingUI/VisProgStores.test.tsx
View File

@@ -221,4 +221,132 @@ describe('FlowStore Functionality', () => {
});
});
});
describe('ReactFlow updateNodeData', () => {
test.each([
{
state: {
name: 'updateName',
nodes: [{
id: 'phase-1',
type: 'phase',
position: {x: 0, y: 300},
data: {label: 'name', number: '2'}
}]
},
input: {
id: 'phase-1',
changedData: {label: 'new name'}
},
expected: {
node: {
id: 'phase-1',
type: 'phase',
position: {x: 0, y: 300},
data: {label: 'new name', number: '2'}
}
}
},
{
state: {
name: 'updateNumber',
nodes: [{
id: 'phase-1',
type: 'phase',
position: {x: 0, y: 300},
data: {label: 'name', number: '2'}
}]
},
input: {
id: 'phase-1',
changedData: {number: '3'}
},
expected: {
node: {
id: 'phase-1',
type: 'phase',
position: {x: 0, y: 300},
data: {label: 'name', number: '3'}
}
}
},
{
state: {
name: 'updateNameAndNumber',
nodes: [{
id: 'phase-1',
type: 'phase',
position: {x: 0, y: 300},
data: {label: 'name', number: '2'}
}]
},
input: {
id: 'phase-1',
changedData: {label: 'new name', number: '3'}
},
expected: {
node: {
id: 'phase-1',
type: 'phase',
position: {x: 0, y: 300},
data: {label: 'new name', number: '3'}
}
}
},
{
state: {
name: 'AddNewEntry',
nodes: [{
id: 'phase-1',
type: 'phase',
position: {x: 0, y: 300},
data: {label: 'name', number: '2'}
}]
},
input: {
id: 'phase-1',
changedData: {newEntry: 20}
},
expected: {
node: {
id: 'phase-1',
type: 'phase',
position: {x: 0, y: 300},
data: {label: 'name', number: '2', newEntry: 20}
}
}
},
{
state: {
name: 'AddNewEntryAndUpdateOneValue_UnorderedInput',
nodes: [{
id: 'phase-1',
type: 'phase',
position: {x: 0, y: 300},
data: {label: 'name', number: '2'}
}]
},
input: {
id: 'phase-1',
changedData: {newEntry: 20, number: '3'}
},
expected: {
node: {
id: 'phase-1',
type: 'phase',
position: {x: 0, y: 300},
data: {label: 'name', number: '3', newEntry: 20}
}
}
}
])(`tests state: $state.name`, ({state, input,expected}) => {
useFlowStore.setState({ nodes: state.nodes })
const {updateNodeData} = useFlowStore.getState();
act(() => {
updateNodeData(input.id, input.changedData);
})
const updatedState = useFlowStore.getState();
expect(updatedState.nodes).toHaveLength(1);
expect(updatedState.nodes[0]).toMatchObject(expected.node);
})
})
});