refactor(editor): Move editor-ui and design-system to frontend dir (no-changelog) (#13564)

2025-12-17 18:12:04 +00:00 · 2025-02-28 14:28:30 +02:00
parent 684353436d
commit f5743176e5
1635 changed files with 805 additions and 1079 deletions
--- a/packages/frontend/editor-ui/src/components/NDVSubConnections.test.ts
+++ b/packages/frontend/editor-ui/src/components/NDVSubConnections.test.ts
@@ -0,0 +1,126 @@
+import { render, waitFor } from '@testing-library/vue';
+import NDVSubConnections from '@/components/NDVSubConnections.vue';
+import { setActivePinia } from 'pinia';
+import { createTestingPinia } from '@pinia/testing';
+import type { INodeUi } from '@/Interface';
+import type { INodeTypeDescription, WorkflowParameters } from 'n8n-workflow';
+import { NodeConnectionType, Workflow } from 'n8n-workflow';
+
+const nodeType: INodeTypeDescription = {
+	displayName: 'OpenAI',
+	name: '@n8n/n8n-nodes-langchain.openAi',
+	version: [1],
+	inputs: [
+		{ type: NodeConnectionType.Main },
+		{ type: NodeConnectionType.AiTool, displayName: 'Tools' },
+	],
+	outputs: [NodeConnectionType.Main],
+	credentials: [
+		{
+			name: 'openAiApi',
+			required: true,
+		},
+	],
+	properties: [],
+	defaults: { color: '', name: '' },
+	group: [],
+	description: '',
+};
+
+const node: INodeUi = {
+	parameters: {
+		resource: 'assistant',
+		assistantId: {
+			__rl: true,
+			mode: 'list',
+			value: '',
+		},
+		options: {},
+	},
+	id: 'f30c2cbc-c1b1-4014-87f7-22e6ae7afcc8',
+	name: 'OpenAI',
+	type: '@n8n/n8n-nodes-langchain.openAi',
+	typeVersion: 1.6,
+	position: [1300, 540],
+};
+
+const workflow: WorkflowParameters = {
+	nodes: [node],
+	connections: {},
+	pinData: {},
+	active: false,
+	nodeTypes: {
+		getByName: vi.fn(),
+		getByNameAndVersion: vi.fn(),
+		getKnownTypes: vi.fn(),
+	},
+};
+
+const getNodeType = vi.fn();
+
+vi.mock('@/stores/nodeTypes.store', () => ({
+	useNodeTypesStore: vi.fn(() => ({
+		getNodeType,
+	})),
+}));
+
+vi.mock('@/stores/workflows.store', () => ({
+	useWorkflowsStore: vi.fn(() => ({
+		getCurrentWorkflow: vi.fn(() => new Workflow(workflow)),
+		getNodeByName: vi.fn(() => node),
+	})),
+}));
+
+describe('NDVSubConnections', () => {
+	beforeAll(() => {
+		vi.useFakeTimers();
+		setActivePinia(createTestingPinia());
+		vi.restoreAllMocks();
+	});
+
+	it('should render container if possible connections', async () => {
+		getNodeType.mockReturnValue(nodeType);
+		const { getByTestId, html } = render(NDVSubConnections, {
+			props: {
+				rootNode: node,
+			},
+		});
+		vi.advanceTimersByTime(1000); // Event debounce time
+
+		await waitFor(() => {});
+		expect(getByTestId('subnode-connection-group-ai_tool')).toBeVisible();
+		expect(html()).toEqual(
+			`<div class="container">
+  <div class="connections" style="--possible-connections: 1;">
+    <div data-test-id="subnode-connection-group-ai_tool">
+      <div class="connectionType"><span class="connectionLabel">Tools</span>
+        <div>
+          <div class="connectedNodesWrapper" style="--nodes-length: 0;">
+            <div class="plusButton">
+              <n8n-tooltip placement="top" teleported="true" offset="10" show-after="300" disabled="false">
+                <n8n-icon-button size="medium" icon="plus" type="tertiary" data-test-id="add-subnode-ai_tool"></n8n-icon-button>
+              </n8n-tooltip>
+            </div>
+            <!--v-if-->
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>`,
+		);
+	});
+
+	it('should not render container if no possible connections', async () => {
+		getNodeType.mockReturnValue(null);
+		const component = render(NDVSubConnections, {
+			props: {
+				rootNode: node,
+			},
+		});
+		vi.advanceTimersByTime(1000); // Event debounce time
+
+		await waitFor(() => {});
+		expect(component.html()).toEqual('<!--v-if-->');
+	});
+});