fix(editor): Handle disabled nodes in schema view (#10052)

Co-authored-by: Shireen Missi <94372015+ShireenMissi@users.noreply.github.com>
This commit is contained in:
Elias Meire 2024-07-17 11:18:13 +02:00 committed by GitHub
parent 9cbbb6335d
commit ab5688c582
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
5 changed files with 45 additions and 9 deletions

View file

@ -253,11 +253,14 @@
<NodeErrorView :error="subworkflowExecutionError" :class="$style.errorDisplay" />
</div>
<div v-else-if="!hasNodeRun" :class="$style.center">
<div v-else-if="!hasNodeRun && !(isInputSchemaView && node?.disabled)" :class="$style.center">
<slot name="node-not-run"></slot>
</div>
<div v-else-if="paneType === 'input' && node?.disabled" :class="$style.center">
<div
v-else-if="paneType === 'input' && !isInputSchemaView && node?.disabled"
:class="$style.center"
>
<n8n-text>
{{ $locale.baseText('ndv.input.disabled', { interpolate: { nodeName: node.name } }) }}
<n8n-link @click="enableNode">

View file

@ -285,6 +285,7 @@ watch(
<div :class="$style.title">
{{ currentNode.node.name }}
<span v-if="currentNode.node.disabled">({{ $locale.baseText('node.disabled') }})</span>
</div>
<font-awesome-icon
v-if="currentNode.nodeType.group.includes('trigger')"
@ -329,8 +330,16 @@ watch(
>
<div :class="$style.innerSchema" @transitionstart.stop>
<div
v-if="isDataEmpty(currentNode.schema)"
:class="$style.empty"
v-if="currentNode.node.disabled"
:class="$style.notice"
data-test-id="run-data-schema-disabled"
>
{{ i18n.baseText('dataMapping.schemaView.disabled') }}
</div>
<div
v-else-if="isDataEmpty(currentNode.schema)"
:class="$style.notice"
data-test-id="run-data-schema-empty"
>
{{ i18n.baseText('dataMapping.schemaView.emptyData') }}
@ -421,7 +430,7 @@ watch(
scroll-margin-top: var(--header-height);
}
.empty {
.notice {
padding-left: var(--spacing-l);
}
}
@ -443,7 +452,7 @@ watch(
}
}
.empty {
.notice {
font-size: var(--font-size-2xs);
color: var(--color-text-light);
}

View file

@ -14,12 +14,21 @@ const mockNode1 = createTestNode({
name: 'Set1',
type: SET_NODE_TYPE,
typeVersion: 1,
disabled: false,
});
const mockNode2 = createTestNode({
name: 'Set2',
type: SET_NODE_TYPE,
typeVersion: 1,
disabled: false,
});
const disabledNode = createTestNode({
name: 'Disabled Node',
type: SET_NODE_TYPE,
typeVersion: 1,
disabled: true,
});
async function setupStore() {
@ -28,7 +37,7 @@ async function setupStore() {
name: 'Test Workflow',
connections: {},
active: true,
nodes: [mockNode1, mockNode2],
nodes: [mockNode1, mockNode2, disabledNode],
});
const pinia = createPinia();
@ -162,6 +171,18 @@ describe('RunDataSchema.vue', () => {
expect(getAllByTestId('run-data-schema-empty').length).toBe(1);
});
it('renders disabled nodes correctly', () => {
const { getByTestId } = renderComponent({
props: {
nodes: [{ name: disabledNode.name, indicies: [], depth: 1 }],
},
});
expect(getByTestId('run-data-schema-disabled')).toBeInTheDocument();
expect(getByTestId('run-data-schema-node-name')).toHaveTextContent(
`${disabledNode.name} (Deactivated)`,
);
});
test.each([[[{ tx: false }, { tx: false }]], [[{ tx: '' }, { tx: '' }]], [[{ tx: [] }]]])(
'renders schema instead of showing no data for %o',
(data) => {

View file

@ -1383,6 +1383,7 @@ exports[`RunDataSchema.vue > renders schema with spaces and dots 1`] = `
data-v-46dade00=""
>
Set1
<!--v-if-->
</div>
<!--v-if-->
</div>
@ -1933,6 +1934,7 @@ exports[`RunDataSchema.vue > renders schema with spaces and dots 1`] = `
data-v-46dade00=""
>
Set2
<!--v-if-->
</div>
<!--v-if-->
</div>

View file

@ -606,6 +606,7 @@
"dataMapping.tableView.tableColumnsExceeded.tooltip": "Your data has more than {columnLimit} columns so some are hidden. Switch to {link} to see all data.",
"dataMapping.tableView.tableColumnsExceeded.tooltip.link": "JSON view",
"dataMapping.schemaView.emptyData": "No fields - item(s) exist, but they're empty",
"dataMapping.schemaView.disabled": "This node is disabled and will just pass data through",
"dataMapping.schemaView.noMatches": "No results for '{search}'",
"displayWithChange.cancelEdit": "Cancel Edit",
"displayWithChange.clickToChange": "Click to Change",