fix: Show actual execution data for production executions even if pin data exists (#6302)

packages/editor-ui/src/components/WorkflowPreview.vue

@@ -27,6 +27,7 @@ import { useToast } from '@/composables';
 import type { IWorkflowDb } from '@/Interface';
 import { mapStores } from 'pinia';
 import { useRootStore } from '@/stores/n8nRoot.store';
+import { useWorkflowsStore } from '@/stores';
 
 export default defineComponent({
 	name: 'WorkflowPreview',
@@ -73,7 +74,7 @@ export default defineComponent({
 		};
 	},
 	computed: {
-		...mapStores(useRootStore),
+		...mapStores(useRootStore, useWorkflowsStore),
 		showPreview(): boolean {
 			return (
 				!this.loading &&
@@ -134,6 +135,16 @@ export default defineComponent({
 						}),
 						'*',
 					);
+
+					if (this.workflowsStore.activeWorkflowExecution) {
+						iframeRef.contentWindow.postMessage(
+							JSON.stringify({
+								command: 'setActiveExecution',
+								execution: this.workflowsStore.activeWorkflowExecution,
+							}),
+							'*',
+						);
+					}
 				}
 			} catch (error) {
 				this.showError(

packages/editor-ui/src/mixins/workflowHelpers.ts

@@ -223,32 +223,36 @@ function connectionInputData(
 		}
 	}
 
-	const parentPinData = parentNode.reduce((acc: INodeExecutionData[], parentNodeName, index) => {
+	const workflowsStore = useWorkflowsStore();
-		const pinData = useWorkflowsStore().pinDataByNodeName(parentNodeName);
 
-		if (pinData) {
+	if (workflowsStore.shouldReplaceInputDataWithPinData) {
-			acc.push({
+		const parentPinData = parentNode.reduce<INodeExecutionData[]>((acc, parentNodeName, index) => {
-				json: pinData[0],
+			const pinData = workflowsStore.pinDataByNodeName(parentNodeName);
-				pairedItem: {
-					item: index,
-					input: 1,
-				},
-			});
-		}
 
-		return acc;
+			if (pinData) {
-	}, []);
+				acc.push({
+					json: pinData[0],
+					pairedItem: {
+						item: index,
+						input: 1,
+					},
+				});
+			}
 
-	if (parentPinData.length > 0) {
+			return acc;
-		if (connectionInputData && connectionInputData.length > 0) {
+		}, []);
-			parentPinData.forEach((parentPinDataEntry) => {
+
-				connectionInputData![0].json = {
+		if (parentPinData.length > 0) {
-					...connectionInputData![0].json,
+			if (connectionInputData && connectionInputData.length > 0) {
-					...parentPinDataEntry.json,
+				parentPinData.forEach((parentPinDataEntry) => {
-				};
+					connectionInputData![0].json = {
-			});
+						...connectionInputData![0].json,
-		} else {
+						...parentPinDataEntry.json,
-			connectionInputData = parentPinData;
+					};
+				});
+			} else {
+				connectionInputData = parentPinData;
+			}
 		}
 	}
 
@@ -271,21 +275,24 @@ function executeData(
 		// Add the input data to be able to also resolve the short expression format
 		// which does not use the node name
 		const parentNodeName = parentNode[0];
+		const workflowsStore = useWorkflowsStore();
 
-		const parentPinData = useWorkflowsStore().getPinData![parentNodeName];
+		if (workflowsStore.shouldReplaceInputDataWithPinData) {
+			const parentPinData = workflowsStore.getPinData![parentNodeName];
 
-		// populate `executeData` from `pinData`
+			// populate `executeData` from `pinData`
 
-		if (parentPinData) {
+			if (parentPinData) {
-			executeData.data = { main: [parentPinData] };
+				executeData.data = { main: [parentPinData] };
-			executeData.source = { main: [{ previousNode: parentNodeName }] };
+				executeData.source = { main: [{ previousNode: parentNodeName }] };
 
-			return executeData;
+				return executeData;
+			}
 		}
 
 		// populate `executeData` from `runData`
 
-		const workflowRunData = useWorkflowsStore().getWorkflowRunData;
+		const workflowRunData = workflowsStore.getWorkflowRunData;
 		if (workflowRunData === null) {
 			return executeData;
 		}

packages/editor-ui/src/stores/__tests__/workflows.test.ts

@@ -0,0 +1,31 @@
+import { createTestingPinia } from '@pinia/testing';
+import { useWorkflowsStore } from '@/stores';
+
+let pinia: ReturnType<typeof createTestingPinia>;
+beforeAll(() => {
+	pinia = createTestingPinia();
+});
+
+describe('Workflows Store', () => {
+	describe('shouldReplaceInputDataWithPinData', () => {
+		beforeEach(() => {
+			pinia.state.value = {
+				workflows: useWorkflowsStore(),
+			};
+		});
+
+		it('should return true if no active execution is set', () => {
+			expect(useWorkflowsStore().shouldReplaceInputDataWithPinData).toBe(true);
+		});
+
+		it('should return true if active execution is set and mode is manual', () => {
+			pinia.state.value.workflows.activeWorkflowExecution = { mode: 'manual' };
+			expect(useWorkflowsStore().shouldReplaceInputDataWithPinData).toBe(true);
+		});
+
+		it('should return false if active execution is set and mode is not manual', () => {
+			pinia.state.value.workflows.activeWorkflowExecution = { mode: 'webhook' };
+			expect(useWorkflowsStore().shouldReplaceInputDataWithPinData).toBe(false);
+		});
+	});
+});

packages/editor-ui/src/stores/workflows.store.ts

@@ -248,6 +248,9 @@ export const useWorkflowsStore = defineStore(STORES.WORKFLOWS, {
 				return acc;
 			}, 0);
 		},
+		shouldReplaceInputDataWithPinData(): boolean {
+			return !this.activeWorkflowExecution || this.activeWorkflowExecution?.mode === 'manual';
+		},
 		executedNode(): string | undefined {
 			return this.workflowExecutionData ? this.workflowExecutionData.executedNode : undefined;
 		},

packages/editor-ui/src/views/NodeView.vue

@@ -3622,6 +3622,8 @@ export default defineComponent({
 							type: 'error',
 						});
 					}
+				} else if (json?.command === 'setActiveExecution') {
+					this.workflowsStore.activeWorkflowExecution = json.execution;
 				}
 			} catch (e) {}
 		},