mudhorn/n8n
1
0
Fork 0
mirror of https://github.com/n8n-io/n8n.git synced 2024-11-12 15:44:06 -08:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

fix(editor): Show placeholder nodes when no trigger nodes available on new canvas (no-changelog) (#11106)

Browse source
This commit is contained in:
Alex Grozav 2024-10-21 13:09:03 +03:00 committed by GitHub
parent 3b2f63e248
commit f78a7dd3e1
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 15 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
packages/editor-ui/src/components/canvas/WorkflowCanvas.spec.ts
View file

@ -100,6 +100,7 @@ describe('WorkflowCanvas', () => {
workflow,
workflowObject,
fallbackNodes,
showFallbackNodes: true,
},
});
@ -109,9 +110,8 @@ describe('WorkflowCanvas', () => {
expect(container.querySelector(`[data-id="${fallbackNodes[0].id}"]`)).toBeInTheDocument();
});
it('should not render fallback nodes when non-sticky nodes are present', async () => {
const nonStickyNodes = [createTestNode({ id: '1', name: 'Non-Sticky Node 1' })];
const stickyNodes = [createTestNode({ id: '2', name: 'Sticky Node', type: STICKY_NODE_TYPE })];
it('should not render fallback nodes when showFallbackNodes is false', async () => {
const nodes = [createTestNode({ id: '1', name: 'Non-Sticky Node 1' })];
const fallbackNodes = [
createTestNode({
id: CanvasNodeRenderType.AddNodes,
@ -123,7 +123,7 @@ describe('WorkflowCanvas', () => {
const workflow = createTestWorkflow({
id: '1',
name: 'Test Workflow',
nodes: [...nonStickyNodes, ...stickyNodes],
nodes,
connections: {},
});
@ -134,13 +134,13 @@ describe('WorkflowCanvas', () => {
workflow,
workflowObject,
fallbackNodes,
showFallbackNodes: false,
},
});
await waitFor(() => expect(container.querySelectorAll('.vue-flow__node')).toHaveLength(2));
await waitFor(() => expect(container.querySelectorAll('.vue-flow__node')).toHaveLength(1));
expect(container.querySelector(`[data-id="${nonStickyNodes[0].id}"]`)).toBeInTheDocument();
expect(container.querySelector(`[data-id="${stickyNodes[0].id}"]`)).toBeInTheDocument();
expect(container.querySelector(`[data-id="${nodes[0].id}"]`)).toBeInTheDocument();
expect(container.querySelector(`[data-id="${fallbackNodes[0].id}"]`)).not.toBeInTheDocument();
});
});

11
packages/editor-ui/src/components/canvas/WorkflowCanvas.vue
View file

@ -7,7 +7,6 @@ import { useCanvasMapping } from '@/composables/useCanvasMapping';
import type { EventBus } from 'n8n-design-system';
import { createEventBus } from 'n8n-design-system';
import type { CanvasEventBusEvents } from '@/types';
import { STICKY_NODE_TYPE } from '@/constants';
defineOptions({
inheritAttrs: false,
@ -19,6 +18,7 @@ const props = withDefaults(
workflow: IWorkflowDb;
workflowObject: Workflow;
fallbackNodes?: IWorkflowDb['nodes'];
showFallbackNodes?: boolean;
eventBus?: EventBus<CanvasEventBusEvents>;
readOnly?: boolean;
executing?: boolean;
@ -27,6 +27,7 @@ const props = withDefaults(
id: 'canvas',
eventBus: () => createEventBus<CanvasEventBusEvents>(),
fallbackNodes: () => [],
showFallbackNodes: true,
},
);
@ -36,11 +37,9 @@ const workflow = toRef(props, 'workflow');
const workflowObject = toRef(props, 'workflowObject');
const nodes = computed(() => {
const stickyNoteNodes = props.workflow.nodes.filter((node) => node.type === STICKY_NODE_TYPE);
return props.workflow.nodes.length > stickyNoteNodes.length
? props.workflow.nodes
: [...props.fallbackNodes, ...stickyNoteNodes];
return props.showFallbackNodes
? [...props.workflow.nodes, ...props.fallbackNodes]
: props.workflow.nodes;
});
const connections = computed(() => props.workflow.connections);

3
packages/editor-ui/src/views/NodeView.v2.vue
View file

@ -241,6 +241,8 @@ const fallbackNodes = computed<INodeUi[]>(() =>
],
);
const showFallbackNodes = computed(() => triggerNodes.value.length === 0);
const keyBindingsEnabled = computed(() => {
return !ndvStore.activeNode && uiStore.activeModals.length === 0;
});
@ -1566,6 +1568,7 @@ onBeforeUnmount(() => {
:workflow="editableWorkflow"
:workflow-object="editableWorkflowObject"
:fallback-nodes="fallbackNodes"
:show-fallback-nodes="showFallbackNodes"
:event-bus="canvasEventBus"
:read-only="isCanvasReadOnly"
:executing="isWorkflowRunning"