fix(editor): Use last task data for calculating the current state (#15546)

packages/frontend/editor-ui/src/composables/useCanvasMapping.test.ts

@@ -265,298 +265,298 @@ describe('useCanvasMapping', () => {
 				}),
 			);
 		});
+	});
 
-		describe('render', () => {
+	describe('render', () => {
-			it('should handle render options for default node type', () => {
+		it('should handle render options for default node type', () => {
-				const manualTriggerNode = mockNode({
+			const manualTriggerNode = mockNode({
-					name: 'Manual Trigger',
+				name: 'Manual Trigger',
-					type: MANUAL_TRIGGER_NODE_TYPE,
+				type: MANUAL_TRIGGER_NODE_TYPE,
-					disabled: false,
+				disabled: false,
-				});
+			});
-				const nodes = [manualTriggerNode];
+			const nodes = [manualTriggerNode];
-				const connections = {};
+			const connections = {};
-				const workflowObject = createTestWorkflowObject({
+			const workflowObject = createTestWorkflowObject({
-					nodes,
+				nodes,
-					connections,
+				connections,
-				});
-
-				const { nodes: mappedNodes } = useCanvasMapping({
-					nodes: ref(nodes),
-					connections: ref(connections),
-					workflowObject: ref(workflowObject) as Ref<Workflow>,
-				});
-
-				const rootStore = mockedStore(useRootStore);
-				rootStore.baseUrl = 'http://test.local/';
-
-				expect(mappedNodes.value[0]?.data?.render).toEqual({
-					type: CanvasNodeRenderType.Default,
-					options: {
-						configurable: false,
-						configuration: false,
-						trigger: true,
-						icon: {
-							src: 'http://test.local/nodes/test-node/icon.svg',
-							type: 'file',
-						},
-						inputs: {
-							labelSize: 'small',
-						},
-						outputs: {
-							labelSize: 'small',
-						},
-					},
-				});
 			});
 
-			it('should handle render options for addNodes node type', () => {
+			const { nodes: mappedNodes } = useCanvasMapping({
-				const addNodesNode = mockNode({
+				nodes: ref(nodes),
-					name: CanvasNodeRenderType.AddNodes,
+				connections: ref(connections),
-					type: CanvasNodeRenderType.AddNodes,
+				workflowObject: ref(workflowObject) as Ref<Workflow>,
-					disabled: false,
-				});
-				const nodes = [addNodesNode];
-				const connections = {};
-				const workflowObject = createTestWorkflowObject({
-					nodes: [],
-					connections,
-				});
-
-				const { nodes: mappedNodes } = useCanvasMapping({
-					nodes: ref(nodes),
-					connections: ref(connections),
-					workflowObject: ref(workflowObject) as Ref<Workflow>,
-				});
-
-				expect(mappedNodes.value[0]?.data?.render).toEqual({
-					type: CanvasNodeRenderType.AddNodes,
-					options: {},
-				});
 			});
 
-			it('should handle render options for stickyNote node type', () => {
+			const rootStore = mockedStore(useRootStore);
-				const stickyNoteNode = mockNode({
+			rootStore.baseUrl = 'http://test.local/';
-					name: 'Sticky',
+
-					type: STICKY_NODE_TYPE,
+			expect(mappedNodes.value[0]?.data?.render).toEqual({
-					disabled: false,
+				type: CanvasNodeRenderType.Default,
-					parameters: {
+				options: {
-						width: 200,
+					configurable: false,
-						height: 200,
+					configuration: false,
-						color: 3,
+					trigger: true,
-						content: '# Hello world',
+					icon: {
+						src: 'http://test.local/nodes/test-node/icon.svg',
+						type: 'file',
 					},
-				});
+					inputs: {
-				const nodes = [stickyNoteNode];
+						labelSize: 'small',
-				const connections = {};
+					},
-				const workflowObject = createTestWorkflowObject({
+					outputs: {
-					nodes,
+						labelSize: 'small',
-					connections,
+					},
-				});
+				},
-
-				const { nodes: mappedNodes } = useCanvasMapping({
-					nodes: ref(nodes),
-					connections: ref(connections),
-					workflowObject: ref(workflowObject) as Ref<Workflow>,
-				});
-
-				expect(mappedNodes.value[0]?.data?.render).toEqual({
-					type: CanvasNodeRenderType.StickyNote,
-					options: stickyNoteNode.parameters,
-				});
 			});
 		});
 
-		describe('runData', () => {
+		it('should handle render options for addNodes node type', () => {
-			describe('nodeExecutionRunDataOutputMapById', () => {
+			const addNodesNode = mockNode({
-				it('should return an empty object when there is no run data', () => {
+				name: CanvasNodeRenderType.AddNodes,
-					const workflowsStore = mockedStore(useWorkflowsStore);
+				type: CanvasNodeRenderType.AddNodes,
-					const nodes: INodeUi[] = [];
+				disabled: false,
-					const connections = {};
+			});
-					const workflowObject = createTestWorkflowObject({
+			const nodes = [addNodesNode];
-						nodes,
+			const connections = {};
-						connections,
+			const workflowObject = createTestWorkflowObject({
-					});
+				nodes: [],
+				connections,
+			});
 
-					workflowsStore.getWorkflowResultDataByNodeName.mockReturnValue(null);
+			const { nodes: mappedNodes } = useCanvasMapping({
+				nodes: ref(nodes),
+				connections: ref(connections),
+				workflowObject: ref(workflowObject) as Ref<Workflow>,
+			});
 
-					const { nodeExecutionRunDataOutputMapById } = useCanvasMapping({
+			expect(mappedNodes.value[0]?.data?.render).toEqual({
-						nodes: ref(nodes),
+				type: CanvasNodeRenderType.AddNodes,
-						connections: ref(connections),
+				options: {},
-						workflowObject: ref(workflowObject) as Ref<Workflow>,
+			});
-					});
+		});
 
-					expect(nodeExecutionRunDataOutputMapById.value).toEqual({});
+		it('should handle render options for stickyNote node type', () => {
+			const stickyNoteNode = mockNode({
+				name: 'Sticky',
+				type: STICKY_NODE_TYPE,
+				disabled: false,
+				parameters: {
+					width: 200,
+					height: 200,
+					color: 3,
+					content: '# Hello world',
+				},
+			});
+			const nodes = [stickyNoteNode];
+			const connections = {};
+			const workflowObject = createTestWorkflowObject({
+				nodes,
+				connections,
+			});
+
+			const { nodes: mappedNodes } = useCanvasMapping({
+				nodes: ref(nodes),
+				connections: ref(connections),
+				workflowObject: ref(workflowObject) as Ref<Workflow>,
+			});
+
+			expect(mappedNodes.value[0]?.data?.render).toEqual({
+				type: CanvasNodeRenderType.StickyNote,
+				options: stickyNoteNode.parameters,
+			});
+		});
+	});
+
+	describe('runData', () => {
+		describe('nodeExecutionRunDataOutputMapById', () => {
+			it('should return an empty object when there is no run data', () => {
+				const workflowsStore = mockedStore(useWorkflowsStore);
+				const nodes: INodeUi[] = [];
+				const connections = {};
+				const workflowObject = createTestWorkflowObject({
+					nodes,
+					connections,
 				});
 
-				it('should calculate iterations and total correctly for single node', () => {
+				workflowsStore.getWorkflowResultDataByNodeName.mockReturnValue(null);
-					const workflowsStore = mockedStore(useWorkflowsStore);
-					const nodes = [createTestNode({ name: 'Node 1' })];
-					const connections = {};
-					const workflowObject = createTestWorkflowObject({
-						nodes,
-						connections,
-					});
 
-					workflowsStore.getWorkflowResultDataByNodeName.mockReturnValue([
+				const { nodeExecutionRunDataOutputMapById } = useCanvasMapping({
-						{
+					nodes: ref(nodes),
-							startTime: 0,
+					connections: ref(connections),
-							executionTime: 0,
+					workflowObject: ref(workflowObject) as Ref<Workflow>,
-							executionIndex: 0,
-							source: [],
-							data: {
-								[NodeConnectionTypes.Main]: [[{ json: {} }, { json: {} }]],
-							},
-						},
-					]);
-
-					const { nodeExecutionRunDataOutputMapById } = useCanvasMapping({
-						nodes: ref(nodes),
-						connections: ref(connections),
-						workflowObject: ref(workflowObject) as Ref<Workflow>,
-					});
-
-					expect(nodeExecutionRunDataOutputMapById.value).toEqual({
-						[nodes[0].id]: {
-							[NodeConnectionTypes.Main]: {
-								0: {
-									iterations: 1,
-									total: 2,
-								},
-							},
-						},
-					});
 				});
 
-				it('should handle multiple nodes with different connection types', () => {
+				expect(nodeExecutionRunDataOutputMapById.value).toEqual({});
-					const workflowsStore = mockedStore(useWorkflowsStore);
+			});
-					const nodes = [
-						createTestNode({ id: 'node1', name: 'Node 1' }),
-						createTestNode({ id: 'node2', name: 'Node 2' }),
-					];
-					const connections = {};
-					const workflowObject = createTestWorkflowObject({
-						nodes,
-						connections,
-					});
 
-					workflowsStore.getWorkflowResultDataByNodeName.mockImplementation((nodeName: string) => {
+			it('should calculate iterations and total correctly for single node', () => {
-						if (nodeName === 'Node 1') {
+				const workflowsStore = mockedStore(useWorkflowsStore);
-							return [
+				const nodes = [createTestNode({ name: 'Node 1' })];
-								{
+				const connections = {};
-									startTime: 0,
+				const workflowObject = createTestWorkflowObject({
-									executionTime: 0,
+					nodes,
-									executionIndex: 0,
+					connections,
-									source: [],
-									data: {
-										[NodeConnectionTypes.Main]: [[{ json: {} }]],
-										[NodeConnectionTypes.AiAgent]: [[{ json: {} }, { json: {} }]],
-									},
-								},
-							];
-						} else if (nodeName === 'Node 2') {
-							return [
-								{
-									startTime: 0,
-									executionTime: 0,
-									executionIndex: 0,
-									source: [],
-									data: {
-										[NodeConnectionTypes.Main]: [[{ json: {} }, { json: {} }, { json: {} }]],
-									},
-								},
-							];
-						}
-
-						return null;
-					});
-
-					const { nodeExecutionRunDataOutputMapById } = useCanvasMapping({
-						nodes: ref(nodes),
-						connections: ref(connections),
-						workflowObject: ref(workflowObject) as Ref<Workflow>,
-					});
-
-					expect(nodeExecutionRunDataOutputMapById.value).toEqual({
-						node1: {
-							[NodeConnectionTypes.Main]: {
-								0: {
-									iterations: 1,
-									total: 1,
-								},
-							},
-							[NodeConnectionTypes.AiAgent]: {
-								0: {
-									iterations: 1,
-									total: 2,
-								},
-							},
-						},
-						node2: {
-							[NodeConnectionTypes.Main]: {
-								0: {
-									iterations: 1,
-									total: 3,
-								},
-							},
-						},
-					});
 				});
 
-				it('handles multiple iterations correctly', () => {
+				workflowsStore.getWorkflowResultDataByNodeName.mockReturnValue([
-					const workflowsStore = mockedStore(useWorkflowsStore);
+					{
-					const nodes = [createTestNode({ name: 'Node 1' })];
+						startTime: 0,
-					const connections = {};
+						executionTime: 0,
-					const workflowObject = createTestWorkflowObject({
+						executionIndex: 0,
-						nodes,
+						source: [],
-						connections,
+						data: {
-					});
+							[NodeConnectionTypes.Main]: [[{ json: {} }, { json: {} }]],
+						},
+					},
+				]);
 
-					workflowsStore.getWorkflowResultDataByNodeName.mockReturnValue([
+				const { nodeExecutionRunDataOutputMapById } = useCanvasMapping({
-						{
+					nodes: ref(nodes),
-							startTime: 0,
+					connections: ref(connections),
-							executionTime: 0,
+					workflowObject: ref(workflowObject) as Ref<Workflow>,
-							executionIndex: 0,
+				});
-							source: [],
+
-							data: {
+				expect(nodeExecutionRunDataOutputMapById.value).toEqual({
-								[NodeConnectionTypes.Main]: [[{ json: {} }]],
+					[nodes[0].id]: {
+						[NodeConnectionTypes.Main]: {
+							0: {
+								iterations: 1,
+								total: 2,
 							},
 						},
-						{
+					},
-							startTime: 0,
+				});
-							executionTime: 0,
+			});
-							executionIndex: 1,
-							source: [],
-							data: {
-								[NodeConnectionTypes.Main]: [[{ json: {} }, { json: {} }, { json: {} }]],
-							},
-						},
-						{
-							startTime: 0,
-							executionTime: 0,
-							executionIndex: 2,
-							source: [],
-							data: {
-								[NodeConnectionTypes.Main]: [[{ json: {} }, { json: {} }]],
-							},
-						},
-					]);
 
-					const { nodeExecutionRunDataOutputMapById } = useCanvasMapping({
+			it('should handle multiple nodes with different connection types', () => {
-						nodes: ref(nodes),
+				const workflowsStore = mockedStore(useWorkflowsStore);
-						connections: ref(connections),
+				const nodes = [
-						workflowObject: ref(workflowObject) as Ref<Workflow>,
+					createTestNode({ id: 'node1', name: 'Node 1' }),
-					});
+					createTestNode({ id: 'node2', name: 'Node 2' }),
+				];
+				const connections = {};
+				const workflowObject = createTestWorkflowObject({
+					nodes,
+					connections,
+				});
 
-					expect(nodeExecutionRunDataOutputMapById.value).toEqual({
+				workflowsStore.getWorkflowResultDataByNodeName.mockImplementation((nodeName: string) => {
-						[nodes[0].id]: {
+					if (nodeName === 'Node 1') {
-							[NodeConnectionTypes.Main]: {
+						return [
-								0: {
+							{
-									iterations: 3,
+								startTime: 0,
-									total: 6,
+								executionTime: 0,
+								executionIndex: 0,
+								source: [],
+								data: {
+									[NodeConnectionTypes.Main]: [[{ json: {} }]],
+									[NodeConnectionTypes.AiAgent]: [[{ json: {} }, { json: {} }]],
 								},
 							},
+						];
+					} else if (nodeName === 'Node 2') {
+						return [
+							{
+								startTime: 0,
+								executionTime: 0,
+								executionIndex: 0,
+								source: [],
+								data: {
+									[NodeConnectionTypes.Main]: [[{ json: {} }, { json: {} }, { json: {} }]],
+								},
+							},
+						];
+					}
+
+					return null;
+				});
+
+				const { nodeExecutionRunDataOutputMapById } = useCanvasMapping({
+					nodes: ref(nodes),
+					connections: ref(connections),
+					workflowObject: ref(workflowObject) as Ref<Workflow>,
+				});
+
+				expect(nodeExecutionRunDataOutputMapById.value).toEqual({
+					node1: {
+						[NodeConnectionTypes.Main]: {
+							0: {
+								iterations: 1,
+								total: 1,
+							},
 						},
-					});
+						[NodeConnectionTypes.AiAgent]: {
+							0: {
+								iterations: 1,
+								total: 2,
+							},
+						},
+					},
+					node2: {
+						[NodeConnectionTypes.Main]: {
+							0: {
+								iterations: 1,
+								total: 3,
+							},
+						},
+					},
+				});
+			});
+
+			it('handles multiple iterations correctly', () => {
+				const workflowsStore = mockedStore(useWorkflowsStore);
+				const nodes = [createTestNode({ name: 'Node 1' })];
+				const connections = {};
+				const workflowObject = createTestWorkflowObject({
+					nodes,
+					connections,
+				});
+
+				workflowsStore.getWorkflowResultDataByNodeName.mockReturnValue([
+					{
+						startTime: 0,
+						executionTime: 0,
+						executionIndex: 0,
+						source: [],
+						data: {
+							[NodeConnectionTypes.Main]: [[{ json: {} }]],
+						},
+					},
+					{
+						startTime: 0,
+						executionTime: 0,
+						executionIndex: 1,
+						source: [],
+						data: {
+							[NodeConnectionTypes.Main]: [[{ json: {} }, { json: {} }, { json: {} }]],
+						},
+					},
+					{
+						startTime: 0,
+						executionTime: 0,
+						executionIndex: 2,
+						source: [],
+						data: {
+							[NodeConnectionTypes.Main]: [[{ json: {} }, { json: {} }]],
+						},
+					},
+				]);
+
+				const { nodeExecutionRunDataOutputMapById } = useCanvasMapping({
+					nodes: ref(nodes),
+					connections: ref(connections),
+					workflowObject: ref(workflowObject) as Ref<Workflow>,
+				});
+
+				expect(nodeExecutionRunDataOutputMapById.value).toEqual({
+					[nodes[0].id]: {
+						[NodeConnectionTypes.Main]: {
+							0: {
+								iterations: 3,
+								total: 6,
+							},
+						},
+					},
 				});
 			});
 		});
@@ -621,7 +621,9 @@ describe('useCanvasMapping', () => {
 				expect(additionalNodePropertiesById.value[nodes[0].id]).toEqual({
 					style: { zIndex: -100 },
 				});
-				expect(additionalNodePropertiesById.value[nodes[1].id]).toEqual({ style: { zIndex: -99 } });
+				expect(additionalNodePropertiesById.value[nodes[1].id]).toEqual({
+					style: { zIndex: -99 },
+				});
 			});
 
 			it('should calculate zIndex correctly for overlapping sticky nodes', () => {
@@ -1141,6 +1143,62 @@ describe('useCanvasMapping', () => {
 				expect(nodeHasIssuesById.value[node2.id]).toBe(true); // Has error status
 				expect(nodeHasIssuesById.value[node3.id]).toBe(false); // No issues
 			});
+
+			it('should handle node validation issues', () => {
+				const node1 = createTestNode({
+					name: 'Node 1',
+					issues: {
+						parameters: {
+							formTitle: ['Parameter "Form Title" is required.'],
+						},
+					},
+				} as Partial<INode>);
+				const nodes = [node1];
+				const connections = {};
+				const workflowObject = createTestWorkflowObject({ nodes, connections });
+
+				const { nodeHasIssuesById } = useCanvasMapping({
+					nodes: ref(nodes),
+					connections: ref(connections),
+					workflowObject: ref(workflowObject) as Ref<Workflow>,
+				});
+				expect(nodeHasIssuesById.value[node1.id]).toBe(true); // Has error status
+			});
+
+			it('should handle successful executions after errors', () => {
+				const workflowsStore = mockedStore(useWorkflowsStore);
+				const node1 = createTestNode({ name: 'Node 2' });
+				const nodes = [node1];
+				const connections = {};
+				const workflowObject = createTestWorkflowObject({ nodes, connections });
+
+				workflowsStore.getWorkflowRunData = {
+					'Node 2': [
+						{
+							startTime: 0,
+							executionTime: 0,
+							executionIndex: 0,
+							source: [],
+							executionStatus: 'error',
+						},
+						{
+							startTime: 0,
+							executionTime: 0,
+							executionIndex: 0,
+							source: [],
+							executionStatus: 'success',
+						},
+					],
+				};
+
+				const { nodeHasIssuesById } = useCanvasMapping({
+					nodes: ref(nodes),
+					connections: ref(connections),
+					workflowObject: ref(workflowObject) as Ref<Workflow>,
+				});
+
+				expect(nodeHasIssuesById.value[node1.id]).toBe(false); // Last run was successful
+			});
 		});
 	});
 

packages/frontend/editor-ui/src/composables/useCanvasMapping.ts

@@ -329,9 +329,9 @@ export function useCanvasMapping({
 
 	const nodeExecutionStatusById = computed(() =>
 		nodes.value.reduce<Record<string, ExecutionStatus>>((acc, node) => {
-			acc[node.id] =
+			const tasks = workflowsStore.getWorkflowRunData?.[node.name] ?? [];
-				workflowsStore.getWorkflowRunData?.[node.name]?.filter(Boolean)[0]?.executionStatus ??
+
-				'new';
+			acc[node.id] = tasks.at(-1)?.executionStatus ?? 'new';
 			return acc;
 		}, {}),
 	);
@@ -406,8 +406,12 @@ export function useCanvasMapping({
 				acc[node.id] = true;
 			} else if (nodePinnedDataById.value[node.id]) {
 				acc[node.id] = false;
+			} else if (node.issues && nodeHelpers.nodeIssuesToString(node.issues, node).length) {
+				acc[node.id] = true;
 			} else {
-				acc[node.id] = nodeIssuesById.value[node.id].length > 0;
+				const tasks = workflowsStore.getWorkflowRunData?.[node.name] ?? [];
+
+				acc[node.id] = Boolean(tasks.at(-1)?.error);
 			}
 
 			return acc;