diff --git a/packages/frontend/editor-ui/src/__tests__/data/canvas.ts b/packages/frontend/editor-ui/src/__tests__/data/canvas.ts index ed7a6dc670..520508fca1 100644 --- a/packages/frontend/editor-ui/src/__tests__/data/canvas.ts +++ b/packages/frontend/editor-ui/src/__tests__/data/canvas.ts @@ -56,7 +56,7 @@ export function createCanvasNodeData({ export function createCanvasNodeElement({ id = '1', - type = 'default', + type = 'canvas-node', label = 'Node', position = { x: 100, y: 100 }, data, diff --git a/packages/frontend/editor-ui/src/__tests__/mocks.ts b/packages/frontend/editor-ui/src/__tests__/mocks.ts index c59fa6f893..8ef9ad3637 100644 --- a/packages/frontend/editor-ui/src/__tests__/mocks.ts +++ b/packages/frontend/editor-ui/src/__tests__/mocks.ts @@ -23,6 +23,7 @@ import { MANUAL_TRIGGER_NODE_TYPE, NO_OP_NODE_TYPE, SET_NODE_TYPE, + SIMULATE_NODE_TYPE, STICKY_NODE_TYPE, } from '@/constants'; import type { INodeUi, IWorkflowDb } from '@/Interface'; @@ -50,6 +51,7 @@ export const mockNode = ({ export const mockNodeTypeDescription = ({ name = SET_NODE_TYPE, + icon = 'fa:pen', version = 1, credentials = [], inputs = [NodeConnectionTypes.Main], @@ -58,6 +60,7 @@ export const mockNodeTypeDescription = ({ properties = [], }: { name?: INodeTypeDescription['name']; + icon?: INodeTypeDescription['icon']; version?: INodeTypeDescription['version']; credentials?: INodeTypeDescription['credentials']; inputs?: INodeTypeDescription['inputs']; @@ -67,6 +70,7 @@ export const mockNodeTypeDescription = ({ } = {}) => mock({ name, + icon, displayName: name, description: '', version, @@ -102,6 +106,7 @@ export const mockNodes = [ mockNode({ name: 'Chat Trigger', type: CHAT_TRIGGER_NODE_TYPE }), mockNode({ name: 'Agent', type: AGENT_NODE_TYPE }), mockNode({ name: 'Sticky', type: STICKY_NODE_TYPE }), + mockNode({ name: 'Simulate', type: SIMULATE_NODE_TYPE }), mockNode({ name: CanvasNodeRenderType.AddNodes, type: CanvasNodeRenderType.AddNodes }), mockNode({ name: 'End', type: NO_OP_NODE_TYPE }), ]; diff --git a/packages/frontend/editor-ui/src/components/canvas/Canvas.test.ts b/packages/frontend/editor-ui/src/components/canvas/Canvas.test.ts index 1ef938faec..57e273aed6 100644 --- a/packages/frontend/editor-ui/src/components/canvas/Canvas.test.ts +++ b/packages/frontend/editor-ui/src/components/canvas/Canvas.test.ts @@ -8,6 +8,7 @@ import { createCanvasConnection, createCanvasNodeElement } from '@/__tests__/dat import { NodeConnectionTypes } from 'n8n-workflow'; import type { useDeviceSupport } from '@n8n/composables/useDeviceSupport'; import { useVueFlow } from '@vue-flow/core'; +import { SIMULATE_NODE_TYPE } from '@/constants'; const matchMedia = global.window.matchMedia; // @ts-expect-error Initialize window object @@ -273,4 +274,30 @@ describe('Canvas', () => { expect(patternCanvas?.innerHTML).not.toContain(' { + it('should render simulate node', async () => { + const nodes = [ + createCanvasNodeElement({ + id: '1', + label: 'Node', + position: { x: 200, y: 200 }, + data: { + type: SIMULATE_NODE_TYPE, + typeVersion: 1, + }, + }), + ]; + + const { container } = renderComponent({ + props: { + nodes, + }, + }); + + await waitFor(() => expect(container.querySelectorAll('.vue-flow__node')).toHaveLength(1)); + + expect(container.querySelector('.icon')).toBeInTheDocument(); + }); + }); }); diff --git a/packages/frontend/editor-ui/src/components/canvas/Canvas.vue b/packages/frontend/editor-ui/src/components/canvas/Canvas.vue index 5808e6ce9c..f538c0082d 100644 --- a/packages/frontend/editor-ui/src/components/canvas/Canvas.vue +++ b/packages/frontend/editor-ui/src/components/canvas/Canvas.vue @@ -1,10 +1,7 @@