From e1922f738398534bfd44b025205b591eca097267 Mon Sep 17 00:00:00 2001
From: Mutasem Aldmour <4711238+mutdmour@users.noreply.github.com>
Date: Tue, 29 Aug 2023 14:00:17 +0200
Subject: [PATCH] test: Add tests for parameter lag (#6942)

Github issue / Community forum post (link here to close automatically):
---
 cypress/e2e/5-ndv.cy.ts                       | 25 +++++++++++++++++++
 cypress/pages/ndv.ts                          |  1 +
 cypress/pages/workflow.ts                     |  4 +++
 packages/editor-ui/src/components/Node.vue    |  2 +-
 .../editor-ui/src/components/TriggerPanel.vue |  3 +++
 5 files changed, 34 insertions(+), 1 deletion(-)

diff --git a/cypress/e2e/5-ndv.cy.ts b/cypress/e2e/5-ndv.cy.ts
index 67010b4a13df3..a729ddffaceda 100644
--- a/cypress/e2e/5-ndv.cy.ts
+++ b/cypress/e2e/5-ndv.cy.ts
@@ -288,4 +288,29 @@ describe('NDV', () => {
 			ndv.getters.parameterInput('value').clear();
 		});
 	});
+
+	it('should flag issues as soon as params are set', () => {
+		workflowPage.actions.addInitialNodeToCanvas('Webhook');
+		workflowPage.getters.canvasNodes().first().dblclick();
+
+		workflowPage.getters.nodeIssuesByName('Webhook').should('not.exist');
+		ndv.getters.nodeExecuteButton().should('not.be.disabled');
+		ndv.getters.triggerPanelExecuteButton().should('exist');
+
+		ndv.getters.parameterInput('path').clear();
+
+		ndv.getters.nodeExecuteButton().should('be.disabled');
+		ndv.getters.triggerPanelExecuteButton().should('not.exist');
+		ndv.actions.close();
+		workflowPage.getters.nodeIssuesByName('Webhook').should('exist');
+
+		workflowPage.getters.canvasNodes().first().dblclick();
+		ndv.getters.parameterInput('path').type('t')
+
+		ndv.getters.nodeExecuteButton().should('not.be.disabled');
+		ndv.getters.triggerPanelExecuteButton().should('exist');
+
+		ndv.actions.close();
+		workflowPage.getters.nodeIssuesByName('Webhook').should('not.exist');
+	});
 });
diff --git a/cypress/pages/ndv.ts b/cypress/pages/ndv.ts
index 301de78cfe5a3..0cd8e0913b863 100644
--- a/cypress/pages/ndv.ts
+++ b/cypress/pages/ndv.ts
@@ -8,6 +8,7 @@ export class NDV extends BasePage {
 		copyInput: () => cy.getByTestId('copy-input'),
 		credentialInput: (eq = 0) => cy.getByTestId('node-credentials-select').eq(eq),
 		nodeExecuteButton: () => cy.getByTestId('node-execute-button'),
+		triggerPanelExecuteButton: () => cy.getByTestId('trigger-execute-button'),
 		inputSelect: () => cy.getByTestId('ndv-input-select'),
 		inputOption: () => cy.getByTestId('ndv-input-option'),
 		inputPanel: () => cy.getByTestId('ndv-input-panel'),
diff --git a/cypress/pages/workflow.ts b/cypress/pages/workflow.ts
index 950c83be9bc9e..a92736e17906c 100644
--- a/cypress/pages/workflow.ts
+++ b/cypress/pages/workflow.ts
@@ -26,6 +26,10 @@ export class WorkflowPage extends BasePage {
 		canvasNodes: () => cy.getByTestId('canvas-node'),
 		canvasNodeByName: (nodeName: string) =>
 			this.getters.canvasNodes().filter(`:contains(${nodeName})`),
+		nodeIssuesByName: (nodeName: string) =>
+			this.getters.canvasNodes().filter(`:contains(${nodeName})`)
+			.should('have.length.greaterThan', 0)
+			.findChildByTestId('node-issues'),
 		getEndpointSelector: (type: 'input' | 'output' | 'plus', nodeName: string, index = 0) => {
 			return `[data-endpoint-name='${nodeName}'][data-endpoint-type='${type}'][data-input-index='${index}']`;
 		},
diff --git a/packages/editor-ui/src/components/Node.vue b/packages/editor-ui/src/components/Node.vue
index 08ca458cc0972..594dd01864ed8 100644
--- a/packages/editor-ui/src/components/Node.vue
+++ b/packages/editor-ui/src/components/Node.vue
@@ -34,7 +34,7 @@
 					v-if="!data.disabled"
 					:class="{ 'node-info-icon': true, 'shift-icon': shiftOutputCount }"
 				>
-					<div v-if="hasIssues" class="node-issues">
+					<div v-if="hasIssues" class="node-issues" data-test-id="node-issues">
 						<n8n-tooltip placement="bottom">
 							<template #content>
 								<titled-list :title="`${$locale.baseText('node.issues')}:`" :items="nodeIssues" />
diff --git a/packages/editor-ui/src/components/TriggerPanel.vue b/packages/editor-ui/src/components/TriggerPanel.vue
index 946ef46da87a4..a772ec66f0768 100644
--- a/packages/editor-ui/src/components/TriggerPanel.vue
+++ b/packages/editor-ui/src/components/TriggerPanel.vue
@@ -29,6 +29,7 @@
 						@copy="onTestLinkCopied"
 					></CopyInput>
 					<NodeExecuteButton
+						data-test-id="trigger-execute-button"
 						:nodeName="nodeName"
 						@execute="onNodeExecute"
 						size="medium"
@@ -49,6 +50,7 @@
 						</n8n-text>
 					</div>
 					<NodeExecuteButton
+						data-test-id="trigger-execute-button"
 						:nodeName="nodeName"
 						@execute="onNodeExecute"
 						size="medium"
@@ -72,6 +74,7 @@
 					</div>
 
 					<NodeExecuteButton
+						data-test-id="trigger-execute-button"
 						:nodeName="nodeName"
 						@execute="onNodeExecute"
 						size="medium"