Merge 4e6e035e5d into 48294e7ec1

packages/cli/templates/form-trigger.handlebars

@@ -735,6 +735,14 @@
 							}
 
 							return;
+						}).then(() => {
+							window.addEventListener('storage', function(event) {
+								if (event.key === 'n8n_redirect_to_next_form_test_page' && event.newValue) {
+									const newUrl = event.newValue;
+									localStorage.removeItem('n8n_redirect_to_next_form_test_page');
+									window.location.replace(newUrl);
+								}
+							});
 						})
 						.catch(function (error) {
 							console.error('Error:', error);

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

@@ -7,6 +7,7 @@ import {
 	NODE_INSERT_SPACER_BETWEEN_INPUT_GROUPS,
 	SIMULATE_NODE_TYPE,
 	SIMULATE_TRIGGER_NODE_TYPE,
+	WAIT_NODE_TYPE,
 	WAIT_TIME_UNLIMITED,
 } from '@/constants';
 import type {
@@ -268,7 +269,7 @@ const nodeClass = computed(() => {
 const nodeExecutionStatus = computed(() => {
 	const nodeExecutionRunData = workflowsStore.getWorkflowRunData?.[props.name];
 	if (nodeExecutionRunData) {
-		return nodeExecutionRunData.filter(Boolean)[0].executionStatus ?? '';
+		return nodeExecutionRunData.filter(Boolean)[0]?.executionStatus ?? '';
 	}
 	return '';
 });
@@ -320,9 +321,21 @@ const nodeTitle = computed(() => {
 const waiting = computed(() => {
 	const workflowExecution = workflowsStore.getWorkflowExecution as ExecutionSummary;
 
-	if (workflowExecution?.waitTill) {
+	if (workflowExecution?.waitTill && !workflowExecution?.finished) {
 		const lastNodeExecuted = get(workflowExecution, 'data.resultData.lastNodeExecuted');
 		if (props.name === lastNodeExecuted) {
+			const node = props.workflow.getNode(lastNodeExecuted);
+			if (
+				node &&
+				node.type === WAIT_NODE_TYPE &&
+				['webhook', 'form'].includes(node.parameters.resume as string)
+			) {
+				const event =
+					node.parameters.resume === 'webhook'
+						? i18n.baseText('node.theNodeIsWaitingWebhookCall')
+						: i18n.baseText('node.theNodeIsWaitingFormCall');
+				return event;
+			}
 			const waitDate = new Date(workflowExecution.waitTill);
 			if (waitDate.toISOString() === WAIT_TIME_UNLIMITED) {
 				return i18n.baseText('node.theNodeIsWaitingIndefinitelyForAnIncomingWebhookCall');

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

@@ -56,7 +56,7 @@ defineOptions({
 const lastPopupCountUpdate = ref(0);
 
 const router = useRouter();
-const { runWorkflow, stopCurrentExecution } = useRunWorkflow({ router });
+const { runWorkflowResolvePending, stopCurrentExecution } = useRunWorkflow({ router });
 
 const workflowsStore = useWorkflowsStore();
 const externalHooks = useExternalHooks();
@@ -264,7 +264,7 @@ async function onClick() {
 			telemetry.track('User clicked execute node button', telemetryPayload);
 			await externalHooks.run('nodeExecuteButton.onClick', telemetryPayload);
 
-			await runWorkflow({
+			await runWorkflowResolvePending({
 				destinationNode: props.nodeName,
 				source: 'RunData.ExecuteNodeButton',
 			});

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

@@ -210,6 +210,16 @@ const canPinData = computed(() => {
 
 // Methods
 
+const waitingNodeMessage = (resume: string) => {
+	if (resume === 'form') {
+		return i18n.baseText('ndv.output.waitNodeWaitingForFormSubmission');
+	}
+	if (resume === 'webhook') {
+		return i18n.baseText('ndv.output.waitNodeWaitingForWebhook');
+	}
+	return i18n.baseText('ndv.output.waitNodeWaiting');
+};
+
 const insertTestData = () => {
 	if (!runDataRef.value) return;
 
@@ -348,6 +358,13 @@ const activatePane = () => {
 			</n8n-text>
 		</template>
 
+		<template #node-waiting>
+			<n8n-text :bold="true" color="text-dark" size="large">Waiting for input</n8n-text>
+			<n8n-text>
+				{{ waitingNodeMessage(node?.parameters?.resume as string) }}
+			</n8n-text>
+		</template>
+
 		<template #no-output-data>
 			<n8n-text :bold="true" color="text-dark" size="large">{{
 				$locale.baseText('ndv.output.noOutputData.title')

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

@@ -40,6 +40,7 @@ import {
 	MAX_DISPLAY_ITEMS_AUTO_ALL,
 	TEST_PIN_DATA,
 	HTML_NODE_TYPE,
+	WAIT_NODE_TYPE,
 } from '@/constants';
 
 import BinaryDataDisplay from '@/components/BinaryDataDisplay.vue';
@@ -218,6 +219,14 @@ export default defineComponent({
 		isReadOnlyRoute() {
 			return this.$route?.meta?.readOnlyCanvas === true;
 		},
+		isWaitNodeWaiting() {
+			return (
+				this.hasNodeRun &&
+				this.workflowExecution?.status === 'waiting' &&
+				this.node?.type === WAIT_NODE_TYPE &&
+				this.workflowExecution?.data?.resultData?.lastNodeExecuted === this.node?.name
+			);
+		},
 		activeNode(): INodeUi | null {
 			return this.ndvStore.activeNode;
 		},
@@ -1501,6 +1510,10 @@ export default defineComponent({
 				</n8n-text>
 			</div>
 
+			<div v-else-if="isWaitNodeWaiting" :class="$style.center">
+				<slot name="node-waiting">xxx</slot>
+			</div>
+
 			<div v-else-if="hasNodeRun && !inputData.length && !search" :class="$style.center">
 				<slot name="no-output-data">xxx</slot>
 			</div>

packages/editor-ui/src/composables/__tests__/useRunWorkflow.spec.ts

@@ -6,7 +6,7 @@ import { ExpressionError, type IPinData, type IRunData, type Workflow } from 'n8
 
 import { useRootStore } from '@/stores/root.store';
 import { useRunWorkflow } from '@/composables/useRunWorkflow';
-import type { IStartRunData, IWorkflowData } from '@/Interface';
+import type { IExecutionResponse, IStartRunData, IWorkflowData } from '@/Interface';
 import { useWorkflowsStore } from '@/stores/workflows.store';
 import { useUIStore } from '@/stores/ui.store';
 import { useWorkflowHelpers } from '@/composables/useWorkflowHelpers';
@@ -22,6 +22,7 @@ vi.mock('@/stores/workflows.store', () => ({
 		executionWaitingForWebhook: false,
 		getCurrentWorkflow: vi.fn().mockReturnValue({ id: '123' }),
 		getNodeByName: vi.fn(),
+		getExecution: vi.fn(),
 	}),
 }));
 
@@ -306,4 +307,101 @@ describe('useRunWorkflow({ router })', () => {
 			expect(result.runData).toEqual(undefined);
 		});
 	});
+
+	describe('useRunWorkflow({ router }) - runWorkflowResolvePending', () => {
+		let uiStore: ReturnType<typeof useUIStore>;
+		let workflowsStore: ReturnType<typeof useWorkflowsStore>;
+		let router: ReturnType<typeof useRouter>;
+
+		beforeAll(() => {
+			const pinia = createTestingPinia({ stubActions: false });
+			setActivePinia(pinia);
+			rootStore = useRootStore();
+			uiStore = useUIStore();
+			workflowsStore = useWorkflowsStore();
+			router = useRouter();
+			workflowHelpers = useWorkflowHelpers({ router });
+		});
+
+		beforeEach(() => {
+			uiStore.activeActions = [];
+			vi.mocked(workflowsStore).runWorkflow.mockReset();
+		});
+
+		it('should resolve when runWorkflow finished', async () => {
+			const { runWorkflowResolvePending } = useRunWorkflow({ router });
+			const mockExecutionResponse = { executionId: '123' };
+
+			vi.mocked(workflowsStore).runWorkflow.mockResolvedValue(mockExecutionResponse);
+			vi.mocked(workflowsStore).allNodes = [];
+			vi.mocked(workflowsStore).getExecution.mockResolvedValue({
+				finished: true,
+			} as unknown as IExecutionResponse);
+			vi.mocked(workflowsStore).workflowExecutionData = {
+				id: '123',
+			} as unknown as IExecutionResponse;
+
+			const result = await runWorkflowResolvePending({});
+
+			expect(result).toEqual(mockExecutionResponse);
+		});
+
+		it('should return when workflowExecutionData is null', async () => {
+			const { runWorkflowResolvePending } = useRunWorkflow({ router });
+			const mockExecutionResponse = { executionId: '123' };
+
+			vi.mocked(workflowsStore).runWorkflow.mockResolvedValue(mockExecutionResponse);
+			vi.mocked(workflowsStore).allNodes = [];
+			vi.mocked(workflowsStore).getExecution.mockResolvedValue({
+				finished: true,
+			} as unknown as IExecutionResponse);
+			vi.mocked(workflowsStore).workflowExecutionData = null;
+
+			const result = await runWorkflowResolvePending({});
+
+			expect(result).toEqual(mockExecutionResponse);
+		});
+
+		it('should handle workflow execution error properly', async () => {
+			const { runWorkflowResolvePending } = useRunWorkflow({ router });
+			const mockExecutionResponse = { executionId: '123' };
+
+			vi.mocked(workflowsStore).runWorkflow.mockResolvedValue(mockExecutionResponse);
+			vi.mocked(workflowsStore).allNodes = [];
+			vi.mocked(workflowsStore).getExecution.mockResolvedValue({
+				finished: false,
+				status: 'error',
+			} as unknown as IExecutionResponse);
+
+			await runWorkflowResolvePending({});
+
+			expect(workflowsStore.setWorkflowExecutionData).toHaveBeenCalled();
+			expect(workflowsStore.workflowExecutionData).toBe(null);
+		});
+
+		it('should retry execution when waiting for webhook and eventually resolve', async () => {
+			const { runWorkflowResolvePending } = useRunWorkflow({ router });
+			const mockExecutionResponse = { waitingForWebhook: true };
+
+			vi.mocked(workflowsStore)
+				.runWorkflow.mockResolvedValueOnce(mockExecutionResponse)
+				.mockResolvedValueOnce({
+					executionId: '123',
+				});
+			vi.mocked(workflowsStore).allNodes = [];
+
+			vi.mocked(workflowsStore)
+				.getExecution.mockResolvedValueOnce({ status: 'waiting' } as unknown as IExecutionResponse)
+				.mockResolvedValueOnce({ status: 'waiting' } as unknown as IExecutionResponse)
+				.mockResolvedValueOnce({ finished: true } as unknown as IExecutionResponse);
+
+			const result = await runWorkflowResolvePending({});
+
+			expect(result).toEqual({
+				executionId: '123',
+			});
+			expect(workflowsStore.getExecution).toHaveBeenCalledTimes(4);
+			expect(workflowsStore.getExecution).toHaveBeenNthCalledWith(4, '123');
+		});
+	});
 });

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

@@ -231,7 +231,8 @@ export function useCanvasMapping({
 	const nodeExecutionStatusById = computed(() =>
 		nodes.value.reduce<Record<string, ExecutionStatus>>((acc, node) => {
 			acc[node.id] =
-				workflowsStore.getWorkflowRunData?.[node.name]?.filter(Boolean)[0].executionStatus ?? 'new';
+				workflowsStore.getWorkflowRunData?.[node.name]?.filter(Boolean)[0]?.executionStatus ??
+				'new';
 			return acc;
 		}, {}),
 	);
@@ -325,7 +326,8 @@ export function useCanvasMapping({
 			if (workflowExecution && lastNodeExecuted && isExecutionSummary(workflowExecution)) {
 				if (
 					node.name === workflowExecution.data?.resultData?.lastNodeExecuted &&
-					workflowExecution.waitTill
+					workflowExecution?.waitTill &&
+					!workflowExecution?.finished
 				) {
 					const waitDate = new Date(workflowExecution.waitTill);
 

packages/editor-ui/src/composables/usePushConnection.ts

@@ -325,13 +325,6 @@ export function usePushConnection({ router }: { router: ReturnType<typeof useRou
 
 				// Workflow did start but had been put to wait
 				titleChange.titleSet(workflow.name as string, 'IDLE');
-				toast.showToast({
-					title: 'Workflow started waiting',
-					message: `${action} <a href="https://docs.n8n.io/integrations/builtin/core-nodes/n8n-nodes-base.wait/" target="_blank">More info</a>`,
-					type: 'success',
-					duration: 0,
-					dangerouslyUseHTMLString: true,
-				});
 			} else if (runDataExecuted.finished !== true) {
 				titleChange.titleSet(workflow.name as string, 'ERROR');
 

packages/editor-ui/src/composables/useRunWorkflow.ts

@@ -4,6 +4,7 @@ import type {
 	IStartRunData,
 	IWorkflowDb,
 } from '@/Interface';
+
 import type {
 	IRunData,
 	IRunExecutionData,
@@ -13,19 +14,25 @@ import type {
 	StartNodeData,
 	IRun,
 	INode,
+	IDataObject,
 } from 'n8n-workflow';
+
 import { NodeConnectionType } from 'n8n-workflow';
 
 import { useToast } from '@/composables/useToast';
 import { useNodeHelpers } from '@/composables/useNodeHelpers';
 
-import { CHAT_TRIGGER_NODE_TYPE, WORKFLOW_LM_CHAT_MODAL_KEY } from '@/constants';
+import {
+	CHAT_TRIGGER_NODE_TYPE,
+	FORM_TRIGGER_NODE_TYPE,
+	WAIT_NODE_TYPE,
+	WORKFLOW_LM_CHAT_MODAL_KEY,
+} from '@/constants';
 import { useTitleChange } from '@/composables/useTitleChange';
 import { useRootStore } from '@/stores/root.store';
 import { useUIStore } from '@/stores/ui.store';
-import { useNodeTypesStore } from '@/stores/nodeTypes.store';
 import { useWorkflowsStore } from '@/stores/workflows.store';
-import { displayForm } from '@/utils/executionUtils';
+import { displayForm, openPopUpWindow } from '@/utils/executionUtils';
 import { useExternalHooks } from '@/composables/useExternalHooks';
 import { useWorkflowHelpers } from '@/composables/useWorkflowHelpers';
 import type { useRouter } from 'vue-router';
@@ -36,6 +43,8 @@ import { useExecutionsStore } from '@/stores/executions.store';
 import type { PushPayload } from '@n8n/api-types';
 import { useLocalStorage } from '@vueuse/core';
 
+const FORM_RELOAD = 'n8n_redirect_to_next_form_test_page';
+
 export function useRunWorkflow(useRunWorkflowOpts: { router: ReturnType<typeof useRouter> }) {
 	const nodeHelpers = useNodeHelpers();
 	const workflowHelpers = useWorkflowHelpers({ router: useRunWorkflowOpts.router });
@@ -45,7 +54,6 @@ export function useRunWorkflow(useRunWorkflowOpts: { router: ReturnType<typeof u
 
 	const rootStore = useRootStore();
 	const uiStore = useUIStore();
-	const nodeTypesStore = useNodeTypesStore();
 	const workflowsStore = useWorkflowsStore();
 	const executionsStore = useExecutionsStore();
 
@@ -265,42 +273,23 @@ export function useRunWorkflow(useRunWorkflowOpts: { router: ReturnType<typeof u
 
 			const getTestUrl = (() => {
 				return (node: INode) => {
-					const nodeType = nodeTypesStore.getNodeType(node.type, node.typeVersion);
-					if (nodeType?.webhooks?.length) {
-						return workflowHelpers.getWebhookUrl(nodeType.webhooks[0], node, 'test');
-					}
-					return '';
+					return `${rootStore.formTestUrl}/${node.parameters.path}`;
 				};
 			})();
 
-			const shouldShowForm = (() => {
-				return (node: INode) => {
-					const workflowTriggerNodes = workflow
-						.getTriggerNodes()
-						.map((triggerNode) => triggerNode.name);
-
-					const showForm =
-						options.destinationNode === node.name ||
-						directParentNodes.includes(node.name) ||
-						workflowTriggerNodes.some((triggerNode) =>
-							workflowsStore.isNodeInOutgoingNodeConnections(triggerNode, node.name),
-						);
-					return showForm;
-				};
-			})();
-
-			displayForm({
-				nodes: workflowData.nodes,
-				runData: workflowsStore.getWorkflowExecution?.data?.resultData?.runData,
-				destinationNode: options.destinationNode,
-				pinData,
-				directParentNodes,
-				formWaitingUrl: rootStore.formWaitingUrl,
-				executionId: runWorkflowApiResponse.executionId,
-				source: options.source,
-				getTestUrl,
-				shouldShowForm,
-			});
+			try {
+				displayForm({
+					nodes: workflowData.nodes,
+					runData: workflowsStore.getWorkflowExecution?.data?.resultData?.runData,
+					destinationNode: options.destinationNode,
+					pinData,
+					directParentNodes,
+					source: options.source,
+					getTestUrl,
+				});
+			} catch (error) {
+				console.log(error);
+			}
 
 			await useExternalHooks().run('workflowRun.runWorkflow', {
 				nodeName: options.destinationNode,
@@ -315,6 +304,114 @@ export function useRunWorkflow(useRunWorkflowOpts: { router: ReturnType<typeof u
 		}
 	}
 
+	function getFormResumeUrl(node: INode, executionId: string) {
+		const { webhookSuffix } = (node.parameters.options ?? {}) as IDataObject;
+		const suffix = webhookSuffix && typeof webhookSuffix !== 'object' ? `/${webhookSuffix}` : '';
+		const testUrl = `${rootStore.formWaitingUrl}/${executionId}${suffix}`;
+		return testUrl;
+	}
+
+	async function runWorkflowResolvePending(options: {
+		destinationNode?: string;
+		triggerNode?: string;
+		nodeData?: ITaskData;
+		source?: string;
+	}): Promise<IExecutionPushResponse | undefined> {
+		let runWorkflowApiResponse = await runWorkflow(options);
+		let { executionId } = runWorkflowApiResponse || {};
+
+		const MAX_DELAY = 3000;
+		let delay = 300;
+
+		const waitForWebhook = async (): Promise<string> => {
+			return await new Promise<string>((resolve) => {
+				const interval = setInterval(async () => {
+					await useExternalHooks().run('workflowRun.runWorkflow', {
+						nodeName: options.destinationNode,
+						source: options.source,
+					});
+
+					if (workflowsStore.activeExecutionId) {
+						executionId = workflowsStore.activeExecutionId;
+						runWorkflowApiResponse = { executionId };
+						clearInterval(interval);
+						resolve(executionId);
+					}
+					delay = Math.min(delay * 1.1, MAX_DELAY);
+				}, delay);
+			});
+		};
+
+		if (!executionId) executionId = await waitForWebhook();
+
+		let isFormShown =
+			!options.destinationNode &&
+			workflowsStore.allNodes.some((node) => node.type === FORM_TRIGGER_NODE_TYPE);
+
+		const resolveWaitingNodesData = async (): Promise<void> => {
+			return await new Promise<void>((resolve) => {
+				const interval = setInterval(async () => {
+					const execution = await workflowsStore.getExecution((executionId as string) || '');
+
+					localStorage.removeItem(FORM_RELOAD);
+
+					if (!execution || workflowsStore.workflowExecutionData === null) {
+						clearInterval(interval);
+						resolve();
+						return;
+					}
+
+					if (execution.finished || ['error', 'canceled', 'crashed'].includes(execution.status)) {
+						clearInterval(interval);
+						resolve();
+						return;
+					}
+
+					if (execution.status === 'waiting' && execution.data?.waitTill) {
+						workflowsStore.setWorkflowExecutionRunData(execution.data);
+
+						const { lastNodeExecuted } = execution.data?.resultData || {};
+
+						const waitingNode = execution.workflowData.nodes.find((node) => {
+							return node.name === lastNodeExecuted;
+						});
+
+						if (
+							waitingNode &&
+							waitingNode.type === WAIT_NODE_TYPE &&
+							waitingNode.parameters.resume === 'form'
+						) {
+							const testUrl = getFormResumeUrl(waitingNode, executionId as string);
+
+							if (isFormShown) {
+								localStorage.setItem(FORM_RELOAD, testUrl);
+							} else {
+								isFormShown = true;
+								openPopUpWindow(testUrl);
+							}
+						}
+					}
+					delay = Math.min(delay * 1.1, MAX_DELAY);
+				}, delay);
+			});
+		};
+
+		await resolveWaitingNodesData();
+
+		const execution = await workflowsStore.getExecution((executionId as string) || '');
+
+		if (execution) {
+			workflowsStore.setWorkflowExecutionData(execution);
+		}
+
+		await useExternalHooks().run('workflowRun.runWorkflow', {
+			nodeName: options.destinationNode,
+			source: options.source,
+		});
+
+		return runWorkflowApiResponse;
+	}
+
 	function consolidateRunDataAndStartNodes(
 		directParentNodes: string[],
 		runData: IRunData | null,
@@ -435,6 +532,7 @@ export function useRunWorkflow(useRunWorkflowOpts: { router: ReturnType<typeof u
 	return {
 		consolidateRunDataAndStartNodes,
 		runWorkflow,
+		runWorkflowResolvePending,
 		runWorkflowApi,
 		stopCurrentExecution,
 		stopWaitingForWebhook,

packages/editor-ui/src/plugins/i18n/locales/en.json

@@ -955,6 +955,9 @@
 	"ndv.output.run": "Run",
 	"ndv.output.runNodeHint": "Execute this node to view data",
 	"ndv.output.runNodeHintSubNode": "Output will appear here once the parent node is run",
+	"ndv.output.waitNodeWaitingForWebhook": "Execution will continue when webhook is received",
+	"ndv.output.waitNodeWaitingForFormSubmission": "Execution will continue when form is submitted",
+	"ndv.output.waitNodeWaiting": "Execution will continue when wait time is over",
 	"ndv.output.insertTestData": "set mock data",
 	"ndv.output.staleDataWarning.regular": "Node parameters have changed.<br>Test node again to refresh output.",
 	"ndv.output.staleDataWarning.pinData": "Node parameter changes will not affect pinned output data.",
@@ -1001,6 +1004,8 @@
 	"node.nodeIsExecuting": "Node is executing",
 	"node.nodeIsWaitingTill": "Node is waiting until {date} {time}",
 	"node.theNodeIsWaitingIndefinitelyForAnIncomingWebhookCall": "The node is waiting for an incoming webhook call (indefinitely)",
+	"node.theNodeIsWaitingWebhookCall": "The node is waiting for an incoming webhook call",
+	"node.theNodeIsWaitingFormCall": "The node is waiting for an form submission",
 	"node.waitingForYouToCreateAnEventIn": "Waiting for you to create an event in {nodeType}",
 	"node.discovery.pinData.canvas": "You can pin this output instead of waiting for a test event. Open node to do so.",
 	"node.discovery.pinData.ndv": "You can pin this output instead of waiting for a test event.",

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

@@ -44,7 +44,9 @@ export const useRootStore = defineStore(STORES.ROOT, () => {
 
 	const formTestUrl = computed(() => `${state.value.urlBaseEditor}${state.value.endpointFormTest}`);
 
-	const formWaitingUrl = computed(() => `${state.value.baseUrl}${state.value.endpointFormWaiting}`);
+	const formWaitingUrl = computed(
+		() => `${state.value.urlBaseEditor}${state.value.endpointFormWaiting}`,
+	);
 
 	const webhookUrl = computed(() => `${state.value.urlBaseWebhook}${state.value.endpointWebhook}`);
 

packages/editor-ui/src/utils/__tests__/executionUtils.spec.ts

@@ -15,7 +15,6 @@ vi.mock('../executionUtils', async () => {
 
 describe('displayForm', () => {
 	const getTestUrlMock = vi.fn();
-	const shouldShowFormMock = vi.fn();
 
 	beforeEach(() => {
 		vi.clearAllMocks();
@@ -50,11 +49,8 @@ describe('displayForm', () => {
 			pinData,
 			destinationNode: undefined,
 			directParentNodes: [],
-			formWaitingUrl: 'http://example.com',
-			executionId: undefined,
 			source: undefined,
 			getTestUrl: getTestUrlMock,
-			shouldShowForm: shouldShowFormMock,
 		});
 
 		expect(openPopUpWindow).not.toHaveBeenCalled();
@@ -86,11 +82,8 @@ describe('displayForm', () => {
 			pinData: {},
 			destinationNode: 'Node3',
 			directParentNodes: ['Node4'],
-			formWaitingUrl: 'http://example.com',
-			executionId: '12345',
 			source: undefined,
 			getTestUrl: getTestUrlMock,
-			shouldShowForm: shouldShowFormMock,
 		});
 
 		expect(openPopUpWindow).not.toHaveBeenCalled();
@@ -116,11 +109,8 @@ describe('displayForm', () => {
 			pinData: {},
 			destinationNode: undefined,
 			directParentNodes: [],
-			formWaitingUrl: 'http://example.com',
-			executionId: undefined,
 			source: 'RunData.ManualChatMessage',
 			getTestUrl: getTestUrlMock,
-			shouldShowForm: shouldShowFormMock,
 		});
 
 		expect(openPopUpWindow).not.toHaveBeenCalled();

packages/editor-ui/src/utils/executionUtils.ts

@@ -1,7 +1,7 @@
 import type { ExecutionStatus, IDataObject, INode, IPinData, IRunData } from 'n8n-workflow';
 import type { ExecutionFilterType, ExecutionsQueryFilter } from '@/Interface';
 import { isEmpty } from '@/utils/typesUtils';
-import { FORM_TRIGGER_NODE_TYPE, WAIT_NODE_TYPE } from '../constants';
+import { FORM_TRIGGER_NODE_TYPE } from '../constants';
 
 export function getDefaultExecutionFilters(): ExecutionFilterType {
 	return {
@@ -76,15 +76,15 @@ export const openPopUpWindow = (
 	const windowWidth = window.innerWidth;
 	const smallScreen = windowWidth <= 800;
 	if (options?.alwaysInNewTab || smallScreen) {
-		window.open(url, '_blank');
+		return window.open(url, '_blank');
 	} else {
 		const height = options?.width || 700;
 		const width = options?.height || window.innerHeight - 50;
 		const left = (window.innerWidth - height) / 2;
 		const top = 50;
 		const features = `width=${height},height=${width},left=${left},top=${top},resizable=yes,scrollbars=yes`;
-
-		window.open(url, '_blank', features);
+		const windowName = `form-waiting-since-${Date.now()}`;
+		return window.open(url, windowName, features);
 	}
 };
 
@@ -94,56 +94,30 @@ export function displayForm({
 	pinData,
 	destinationNode,
 	directParentNodes,
-	formWaitingUrl,
-	executionId,
 	source,
 	getTestUrl,
-	shouldShowForm,
 }: {
 	nodes: INode[];
 	runData: IRunData | undefined;
 	pinData: IPinData;
 	destinationNode: string | undefined;
 	directParentNodes: string[];
-	formWaitingUrl: string;
-	executionId: string | undefined;
 	source: string | undefined;
 	getTestUrl: (node: INode) => string;
-	shouldShowForm: (node: INode) => boolean;
 }) {
 	for (const node of nodes) {
 		const hasNodeRun = runData && runData?.hasOwnProperty(node.name);
 
 		if (hasNodeRun || pinData[node.name]) continue;
 
-		if (![FORM_TRIGGER_NODE_TYPE, WAIT_NODE_TYPE].includes(node.type)) {
-			continue;
-		}
+		if (![FORM_TRIGGER_NODE_TYPE].includes(node.type)) continue;
 
-		if (
-			destinationNode &&
-			destinationNode !== node.name &&
-			!directParentNodes.includes(node.name)
-		) {
+		if (destinationNode && destinationNode !== node.name && !directParentNodes.includes(node.name))
 			continue;
-		}
 
 		if (node.name === destinationNode || !node.disabled) {
 			let testUrl = '';
-
-			if (node.type === FORM_TRIGGER_NODE_TYPE) {
-				testUrl = getTestUrl(node);
-			}
-
-			if (node.type === WAIT_NODE_TYPE && node.parameters.resume === 'form' && executionId) {
-				if (!shouldShowForm(node)) continue;
-
-				const { webhookSuffix } = (node.parameters.options ?? {}) as IDataObject;
-				const suffix =
-					webhookSuffix && typeof webhookSuffix !== 'object' ? `/${webhookSuffix}` : '';
-				testUrl = `${formWaitingUrl}/${executionId}${suffix}`;
-			}
-
+			if (node.type === FORM_TRIGGER_NODE_TYPE) testUrl = getTestUrl(node);
 			if (testUrl && source !== 'RunData.ManualChatMessage') openPopUpWindow(testUrl);
 		}
 	}

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

@@ -153,7 +153,8 @@ const { addBeforeUnloadEventBindings, removeBeforeUnloadEventBindings } = useBef
 	route,
 });
 const { registerCustomAction, unregisterCustomAction } = useGlobalLinkActions();
-const { runWorkflow, stopCurrentExecution, stopWaitingForWebhook } = useRunWorkflow({ router });
+const { runWorkflow, runWorkflowResolvePending, stopCurrentExecution, stopWaitingForWebhook } =
+	useRunWorkflow({ router });
 const {
 	updateNodePosition,
 	updateNodesPosition,
@@ -980,7 +981,11 @@ const workflowExecutionData = computed(() => workflowsStore.workflowExecutionDat
 async function onRunWorkflow() {
 	trackRunWorkflow();
 
-	await runWorkflow({});
+	if (isExecutionPreview.value) {
+		await runWorkflow({});
+	} else {
+		await runWorkflowResolvePending({});
+	}
 }
 
 function trackRunWorkflow() {
@@ -1005,7 +1010,12 @@ async function onRunWorkflowToNode(id: string) {
 	if (!node) return;
 
 	trackRunWorkflowToNode(node);
-	await runWorkflow({ destinationNode: node.name, source: 'Node.executeNode' });
+
+	if (isExecutionPreview.value) {
+		await runWorkflow({ destinationNode: node.name, source: 'Node.executeNode' });
+	} else {
+		await runWorkflowResolvePending({ destinationNode: node.name, source: 'Node.executeNode' });
+	}
 }
 
 function trackRunWorkflowToNode(node: INodeUi) {

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

@@ -234,7 +234,9 @@ export default defineComponent({
 		const { callDebounced } = useDebounce();
 		const canvasPanning = useCanvasPanning(nodeViewRootRef, { onMouseMoveEnd });
 		const workflowHelpers = useWorkflowHelpers({ router });
-		const { runWorkflow, stopCurrentExecution } = useRunWorkflow({ router });
+		const { runWorkflow, stopCurrentExecution, runWorkflowResolvePending } = useRunWorkflow({
+			router,
+		});
 		const { addBeforeUnloadEventBindings, removeBeforeUnloadEventBindings } = useBeforeUnload({
 			route,
 		});
@@ -254,6 +256,7 @@ export default defineComponent({
 			onMouseMoveEnd,
 			workflowHelpers,
 			runWorkflow,
+			runWorkflowResolvePending,
 			stopCurrentExecution,
 			callDebounced,
 			...useCanvasMouseSelect(),
@@ -847,7 +850,12 @@ export default defineComponent({
 			};
 			this.$telemetry.track('User clicked execute node button', telemetryPayload);
 			void this.externalHooks.run('nodeView.onRunNode', telemetryPayload);
-			void this.runWorkflow({ destinationNode: nodeName, source });
+
+			if (this.isExecutionPreview) {
+				void this.runWorkflow({ destinationNode: nodeName, source });
+			} else {
+				void this.runWorkflowResolvePending({ destinationNode: nodeName, source });
+			}
 		},
 		async onOpenChat() {
 			const telemetryPayload = {
@@ -857,6 +865,7 @@ export default defineComponent({
 			void this.externalHooks.run('nodeView.onOpenChat', telemetryPayload);
 			this.uiStore.openModal(WORKFLOW_LM_CHAT_MODAL_KEY);
 		},
+
 		async onRunWorkflow() {
 			void this.workflowHelpers.getWorkflowDataToSave().then((workflowData) => {
 				const telemetryPayload = {
@@ -873,7 +882,12 @@ export default defineComponent({
 				void this.externalHooks.run('nodeView.onRunWorkflow', telemetryPayload);
 			});
 
-			await this.runWorkflow({});
+			if (this.isExecutionPreview) {
+				await this.runWorkflow({});
+			} else {
+				await this.runWorkflowResolvePending({});
+			}
+
 			this.refreshEndpointsErrorsState();
 		},
 		resetEndpointsErrors() {

packages/nodes-base/nodes/Wait/Wait.node.ts

@@ -238,14 +238,6 @@ export class Wait extends Webhook {
 		inputs: [NodeConnectionType.Main],
 		outputs: [NodeConnectionType.Main],
 		credentials: credentialsProperty(this.authPropertyName),
-		hints: [
-			{
-				message:
-					"When testing your workflow using the Editor UI, you can't see the rest of the execution following the Wait node. To inspect the execution results, enable Save Manual Executions in your Workflow settings so you can review the execution results there.",
-				location: 'outputPane',
-				whenToDisplay: 'beforeExecution',
-			},
-		],
 		webhooks: [
 			{
 				...defaultWebhookDescription,