fix(editor): Redirect to workflow editor after saving in debug mode (#7645)

cypress/e2e/28-debug.cy.ts

@@ -12,14 +12,11 @@ const ndv = new NDV();
 const executionsTab = new WorkflowExecutionsTab();
 
 describe('Debug', () => {
+	beforeEach(() => {
+		cy.enableFeature('debugInEditor');
+	});
+
 	it('should be able to debug executions', () => {
-		cy.intercept('GET', '/rest/settings', (req) => {
-			req.on('response', (res) => {
-				res.send({
-					data: { ...res.body.data, enterprise: { debugInEditor: true } },
-				});
-			});
-		}).as('loadSettings');
 		cy.intercept('GET', '/rest/executions?filter=*').as('getExecutions');
 		cy.intercept('GET', '/rest/executions/*').as('getExecution');
 		cy.intercept('GET', '/rest/executions-current?filter=*').as('getCurrentExecutions');
@@ -47,6 +44,7 @@ describe('Debug', () => {
 		cy.wait(['@getExecutions', '@getCurrentExecutions']);
 
 		executionsTab.getters.executionDebugButton().should('have.text', 'Debug in editor').click();
+		cy.url().should('include', '/debug');
 		cy.get('.el-notification').contains('Execution data imported').should('be.visible');
 		cy.get('.matching-pinned-nodes-confirmation').should('not.exist');
 
@@ -56,6 +54,8 @@ describe('Debug', () => {
 		ndv.actions.close();
 
 		workflowPage.actions.saveWorkflowUsingKeyboardShortcut();
+		cy.url().should('not.include', '/debug');
+
 		workflowPage.actions.executeWorkflow();
 
 		cy.wait(['@postWorkflowRun']);
@@ -87,6 +87,7 @@ describe('Debug', () => {
 		confirmDialog = cy.get('.matching-pinned-nodes-confirmation').filter(':visible');
 		confirmDialog.find('li').should('have.length', 2);
 		confirmDialog.get('.btn--confirm').click();
+		cy.url().should('include', '/debug');
 
 		workflowPage.getters.canvasNodes().first().should('have.descendants', '.node-pin-data-icon');
 		workflowPage.getters
@@ -104,6 +105,7 @@ describe('Debug', () => {
 		workflowPage.getters.canvasNodePlusEndpointByName(EDIT_FIELDS_SET_NODE_NAME).click();
 		workflowPage.actions.addNodeToCanvas(IF_NODE_NAME, false);
 		workflowPage.actions.saveWorkflowUsingKeyboardShortcut();
+		cy.url().should('not.include', '/debug');
 
 		executionsTab.actions.switchToExecutionsTab();
 		cy.wait(['@getExecutions', '@getCurrentExecutions']);
@@ -112,6 +114,8 @@ describe('Debug', () => {
 		confirmDialog = cy.get('.matching-pinned-nodes-confirmation').filter(':visible');
 		confirmDialog.find('li').should('have.length', 1);
 		confirmDialog.get('.btn--confirm').click();
+		cy.url().should('include', '/debug');
+
 		workflowPage.getters.canvasNodes().last().find('.node-info-icon').should('be.empty');
 
 		workflowPage.getters.canvasNodes().first().dblclick();
@@ -119,6 +123,8 @@ describe('Debug', () => {
 		ndv.actions.close();
 
 		workflowPage.actions.saveWorkflowUsingKeyboardShortcut();
+		cy.url().should('not.include', '/debug');
+
 		workflowPage.actions.executeWorkflow();
 		workflowPage.actions.deleteNode(IF_NODE_NAME);
 
@@ -128,5 +134,6 @@ describe('Debug', () => {
 		cy.wait(['@getExecution']);
 		executionsTab.getters.executionDebugButton().should('have.text', 'Copy to editor').click();
 		cy.get('.el-notification').contains("Some execution data wasn't imported").should('be.visible');
+		cy.url().should('include', '/debug');
 	});
 });

packages/editor-ui/src/components/MainHeader/WorkflowDetails.vue

@@ -379,7 +379,17 @@ export default defineComponent({
 				name: this.workflowName,
 				tags: this.currentWorkflowTagIds,
 			});
-			if (saved) await this.settingsStore.fetchPromptsData();
+
+			if (saved) {
+				await this.settingsStore.fetchPromptsData();
+
+				if (this.$route.name === VIEWS.EXECUTION_DEBUG) {
+					await this.$router.replace({
+						name: VIEWS.WORKFLOW,
+						params: { name: this.currentWorkflowId },
+					});
+				}
+			}
 		},
 		onShareButtonClick() {
 			this.uiStore.openModalWithData({

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

@@ -459,7 +459,11 @@ export default defineComponent({
 		},
 	},
 	async beforeRouteLeave(to, from, next) {
-		if (getNodeViewTab(to) === MAIN_HEADER_TABS.EXECUTIONS || from.name === VIEWS.TEMPLATE_IMPORT) {
+		if (
+			getNodeViewTab(to) === MAIN_HEADER_TABS.EXECUTIONS ||
+			from.name === VIEWS.TEMPLATE_IMPORT ||
+			(getNodeViewTab(to) === MAIN_HEADER_TABS.WORKFLOW && from.name === VIEWS.EXECUTION_DEBUG)
+		) {
 			next();
 			return;
 		}
@@ -793,7 +797,16 @@ export default defineComponent({
 		},
 		async onSaveKeyboardShortcut(e: KeyboardEvent) {
 			let saved = await this.saveCurrentWorkflow();
-			if (saved) await this.settingsStore.fetchPromptsData();
+			if (saved) {
+				await this.settingsStore.fetchPromptsData();
+
+				if (this.$route.name === VIEWS.EXECUTION_DEBUG) {
+					await this.$router.replace({
+						name: VIEWS.WORKFLOW,
+						params: { name: this.currentWorkflow },
+					});
+				}
+			}
 			if (this.activeNode) {
 				// If NDV is open, save will not work from editable input fields
 				// so don't show success message if this is true
@@ -3995,7 +4008,7 @@ export default defineComponent({
 
 					const node = tempWorkflow.nodes[nodeNameTable[nodeName]];
 					try {
-						this.setPinData(node, data.pinData![nodeName], 'add-nodes');
+						this.setPinData(node, data.pinData[nodeName], 'add-nodes');
 						pinDataSuccess = true;
 					} catch (error) {
 						pinDataSuccess = false;