From 6817abe47facd7ff0e42a66599827d42c4df757c Mon Sep 17 00:00:00 2001
From: Csaba Tuncsik <csaba@n8n.io>
Date: Wed, 19 Mar 2025 06:02:58 +0100
Subject: [PATCH] fix(editor): Fix routing between workflow editing and new
 workflow pages (#14031)

---
 cypress/composables/create.ts                 | 19 +++++++++++++
 cypress/e2e/39-projects.cy.ts                 | 27 +++++++++++++++++++
 .../frontend/editor-ui/src/views/NodeView.vue |  6 +++--
 3 files changed, 50 insertions(+), 2 deletions(-)
 create mode 100644 cypress/composables/create.ts

diff --git a/cypress/composables/create.ts b/cypress/composables/create.ts
new file mode 100644
index 0000000000..4b58adf4c6
--- /dev/null
+++ b/cypress/composables/create.ts
@@ -0,0 +1,19 @@
+export const universalAddButton = () => cy.getByTestId('universal-add');
+
+export const createResource = (
+	resourceType: 'project' | 'workflow' | 'credential',
+	projectName: string,
+) => {
+	universalAddButton().click();
+	cy.getByTestId('navigation-submenu')
+		.contains(new RegExp(resourceType, 'i'))
+		.should('be.visible')
+		.click();
+
+	if (resourceType !== 'project') {
+		cy.getByTestId('navigation-submenu-item')
+			.contains(new RegExp(projectName))
+			.should('be.visible')
+			.click();
+	}
+};
diff --git a/cypress/e2e/39-projects.cy.ts b/cypress/e2e/39-projects.cy.ts
index e617507ba6..b6dcb449da 100644
--- a/cypress/e2e/39-projects.cy.ts
+++ b/cypress/e2e/39-projects.cy.ts
@@ -1,7 +1,9 @@
+import { createResource } from '../composables/create';
 import { setCredentialValues } from '../composables/modals/credential-modal';
 import { clickCreateNewCredential, selectResourceLocatorItem } from '../composables/ndv';
 import * as projects from '../composables/projects';
 import {
+	EDIT_FIELDS_SET_NODE_NAME,
 	INSTANCE_ADMIN,
 	INSTANCE_MEMBERS,
 	INSTANCE_OWNER,
@@ -360,6 +362,31 @@ describe('Projects', { disableAutoLogin: true }, () => {
 			projects.getIconPickerButton().should('contain', '😀');
 			projects.getMenuItems().contains(NEW_PROJECT_NAME).should('contain', '😀');
 		});
+
+		it('should be able to create a workflow when in the workflow editor', () => {
+			cy.signinAsOwner();
+			workflowPage.actions.visit();
+			workflowPage.actions.addInitialNodeToCanvas(MANUAL_TRIGGER_NODE_NAME);
+			workflowPage.actions.addNodeToCanvas(EDIT_FIELDS_SET_NODE_NAME);
+			workflowPage.actions.saveWorkflowOnButtonClick();
+
+			cy.url().then((url) => {
+				createResource('workflow', 'Personal');
+				cy.get('body').click();
+				workflowPage.getters.canvasNodes().should('not.have.length');
+				cy.go('back');
+
+				cy.url().should('eq', url);
+				workflowPage.getters.canvasNodes().should('have.length', 2);
+
+				createResource('workflow', 'Personal');
+				cy.url().then((url) => {
+					const urlObj = new URL(url);
+					expect(urlObj.pathname).to.include('/workflow/new');
+					workflowPage.getters.canvasNodes().should('not.have.length');
+				});
+			});
+		});
 	});
 
 	describe('when moving resources between projects', () => {
diff --git a/packages/frontend/editor-ui/src/views/NodeView.vue b/packages/frontend/editor-ui/src/views/NodeView.vue
index bb9524f261..02b5f50535 100644
--- a/packages/frontend/editor-ui/src/views/NodeView.vue
+++ b/packages/frontend/editor-ui/src/views/NodeView.vue
@@ -1612,8 +1612,10 @@ function showAddFirstStepIfEnabled() {
 watch(
 	() => route.name,
 	async (newRouteName, oldRouteName) => {
-		// it's navigating from and existing workflow to a new workflow
-		const force = newRouteName === VIEWS.NEW_WORKFLOW && oldRouteName === VIEWS.WORKFLOW;
+		// When navigating from an existing workflow to a new workflow or the other way around we should load the new workflow
+		const force =
+			(newRouteName === VIEWS.NEW_WORKFLOW && oldRouteName === VIEWS.WORKFLOW) ||
+			(newRouteName === VIEWS.WORKFLOW && oldRouteName === VIEWS.NEW_WORKFLOW);
 		await initializeRoute(force);
 	},
 );