test(editor): Move unit tests (no-changelog) (#5998)
* test(editor): Move unit tests (no-changelog) * trigger checks * trigger checks * trigger checks * trigger checks
This commit is contained in:
Csaba Tuncsik
GitHub
@@ -0,0 +1,81 @@
|
||||
import Vue from 'vue';
|
||||
import { PiniaVuePlugin } from 'pinia';
|
||||
import { createTestingPinia } from '@pinia/testing';
|
||||
import { render, screen, cleanup } from '@testing-library/vue';
|
||||
import RunDataJson from '@/components/RunDataJson.vue';
|
||||
|
||||
Vue.use(PiniaVuePlugin);
|
||||
|
||||
describe('RunDataJson.vue', () => {
|
||||
const DEFAULT_SETUP = {
|
||||
pinia: createTestingPinia(),
|
||||
props: {
|
||||
mappingEnabled: true,
|
||||
editMode: { enabled: false },
|
||||
inputData: [
|
||||
{
|
||||
json: {
|
||||
list: [1, 2, 3],
|
||||
record: { name: 'Joe' },
|
||||
myNumber: 123,
|
||||
myStringNumber: '456',
|
||||
myStringText: 'abc',
|
||||
nil: null,
|
||||
d: undefined,
|
||||
},
|
||||
},
|
||||
],
|
||||
node: {
|
||||
parameters: {
|
||||
keepOnlySet: false,
|
||||
values: {},
|
||||
options: {},
|
||||
},
|
||||
id: '820ea733-d8a6-4379-8e73-88a2347ea003',
|
||||
name: 'Set',
|
||||
type: 'n8n-nodes-base.set',
|
||||
typeVersion: 1,
|
||||
position: [380, 1060],
|
||||
disabled: false,
|
||||
},
|
||||
},
|
||||
mocks: {
|
||||
$locale: {
|
||||
baseText() {
|
||||
return '';
|
||||
},
|
||||
},
|
||||
$store: {
|
||||
getters: {},
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
beforeEach(cleanup);
|
||||
|
||||
it('renders json values properly', () => {
|
||||
const { container } = render(RunDataJson, DEFAULT_SETUP, (vue) => {
|
||||
vue.use(PiniaVuePlugin);
|
||||
});
|
||||
expect(container).toMatchSnapshot();
|
||||
|
||||
expect(screen.getByText('123')).toBeInTheDocument();
|
||||
expect(screen.getByText('"456"')).toBeInTheDocument();
|
||||
expect(screen.getByText('"abc"')).toBeInTheDocument();
|
||||
expect(screen.getByText('null')).toBeInTheDocument();
|
||||
expect(screen.queryByText('undefined')).not.toBeInTheDocument();
|
||||
});
|
||||
|
||||
it('sets ph-no-capture class correctly', () => {
|
||||
render(RunDataJson, DEFAULT_SETUP);
|
||||
|
||||
expect(screen.getByText('"list"')).not.toHaveClass('ph-no-capture');
|
||||
expect(screen.getByText('"record"')).not.toHaveClass('ph-no-capture');
|
||||
expect(screen.getByText('"myStringNumber"')).not.toHaveClass('ph-no-capture');
|
||||
|
||||
expect(screen.getByText('123')).toHaveClass('ph-no-capture');
|
||||
expect(screen.getByText('"456"')).toHaveClass('ph-no-capture');
|
||||
expect(screen.getByText('"abc"')).toHaveClass('ph-no-capture');
|
||||
expect(screen.getByText('null')).toHaveClass('ph-no-capture');
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,83 @@
|
||||
import { PiniaVuePlugin } from 'pinia';
|
||||
import { createTestingPinia } from '@pinia/testing';
|
||||
import { render, cleanup } from '@testing-library/vue';
|
||||
import RunDataJsonSchema from '@/components/RunDataSchema.vue';
|
||||
import { STORES } from '@/constants';
|
||||
|
||||
describe('RunDataJsonSchema.vue', () => {
|
||||
const renderOptions = {
|
||||
pinia: createTestingPinia({
|
||||
initialState: {
|
||||
[STORES.SETTINGS]: {
|
||||
settings: {
|
||||
templates: {
|
||||
enabled: true,
|
||||
host: 'https://api.n8n.io/api/',
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
}),
|
||||
stubs: ['font-awesome-icon'],
|
||||
props: {
|
||||
mappingEnabled: true,
|
||||
distanceFromActive: 1,
|
||||
runIndex: 1,
|
||||
totalRuns: 2,
|
||||
paneType: 'input',
|
||||
node: {
|
||||
parameters: {
|
||||
keepOnlySet: false,
|
||||
values: {},
|
||||
options: {},
|
||||
},
|
||||
id: '820ea733-d8a6-4379-8e73-88a2347ea003',
|
||||
name: 'Set',
|
||||
type: 'n8n-nodes-base.set',
|
||||
typeVersion: 1,
|
||||
position: [380, 1060],
|
||||
disabled: false,
|
||||
},
|
||||
data: [{}],
|
||||
},
|
||||
};
|
||||
|
||||
beforeEach(cleanup);
|
||||
|
||||
it('renders schema for empty data', () => {
|
||||
const { container } = render(RunDataJsonSchema, renderOptions, (vue) => {
|
||||
vue.use(PiniaVuePlugin);
|
||||
});
|
||||
expect(container).toMatchSnapshot();
|
||||
});
|
||||
|
||||
it('renders schema for data', () => {
|
||||
renderOptions.props.data = [
|
||||
{ name: 'John', age: 22, hobbies: ['surfing', 'traveling'] },
|
||||
{ name: 'Joe', age: 33, hobbies: ['skateboarding', 'gaming'] },
|
||||
];
|
||||
const { container } = render(RunDataJsonSchema, renderOptions, (vue) => {
|
||||
vue.use(PiniaVuePlugin);
|
||||
});
|
||||
expect(container).toMatchSnapshot();
|
||||
});
|
||||
|
||||
it('renders schema with spaces and dots', () => {
|
||||
renderOptions.props.data = [
|
||||
{
|
||||
'hello world': [
|
||||
{
|
||||
test: {
|
||||
'more to think about': 1,
|
||||
},
|
||||
'test.how': 'ignore',
|
||||
},
|
||||
],
|
||||
},
|
||||
];
|
||||
const { container } = render(RunDataJsonSchema, renderOptions, (vue) => {
|
||||
vue.use(PiniaVuePlugin);
|
||||
});
|
||||
expect(container).toMatchSnapshot();
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,700 @@
|
||||
// Vitest Snapshot v1
|
||||
|
||||
exports[`RunDataJson.vue > renders json values properly 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="jsonDisplay"
|
||||
>
|
||||
<!---->
|
||||
<div
|
||||
class=""
|
||||
>
|
||||
<div
|
||||
class="json-data vjs-tree"
|
||||
>
|
||||
<div
|
||||
class="vjs-tree-list"
|
||||
>
|
||||
<div
|
||||
class="vjs-tree-list-holder"
|
||||
>
|
||||
<div
|
||||
class="vjs-tree-list-holder-inner"
|
||||
>
|
||||
<div
|
||||
class="vjs-tree-node"
|
||||
collapsed-on-click-brackets="true"
|
||||
>
|
||||
<!---->
|
||||
<!---->
|
||||
<div
|
||||
class="vjs-indent"
|
||||
>
|
||||
<!---->
|
||||
</div>
|
||||
<!---->
|
||||
<span>
|
||||
<span
|
||||
class="vjs-tree-brackets"
|
||||
>
|
||||
[
|
||||
</span>
|
||||
<!---->
|
||||
<!---->
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="vjs-tree-node"
|
||||
collapsed-on-click-brackets="true"
|
||||
>
|
||||
<!---->
|
||||
<!---->
|
||||
<div
|
||||
class="vjs-indent"
|
||||
>
|
||||
<div
|
||||
class="vjs-indent-unit has-line"
|
||||
/>
|
||||
<!---->
|
||||
</div>
|
||||
<!---->
|
||||
<span>
|
||||
<span
|
||||
class="vjs-tree-brackets"
|
||||
>
|
||||
{
|
||||
</span>
|
||||
<!---->
|
||||
<!---->
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="vjs-tree-node"
|
||||
collapsed-on-click-brackets="true"
|
||||
>
|
||||
<!---->
|
||||
<!---->
|
||||
<div
|
||||
class="vjs-indent"
|
||||
>
|
||||
<div
|
||||
class="vjs-indent-unit has-line"
|
||||
/>
|
||||
<div
|
||||
class="vjs-indent-unit has-line"
|
||||
/>
|
||||
<!---->
|
||||
</div>
|
||||
<span
|
||||
class="vjs-key"
|
||||
>
|
||||
<span
|
||||
class="mappable"
|
||||
data-depth="2"
|
||||
data-name="list"
|
||||
data-path="[0].list"
|
||||
data-target="mappable"
|
||||
data-value="{{ $node.Set.json.list }}"
|
||||
>
|
||||
"list"
|
||||
</span>
|
||||
<span>
|
||||
:
|
||||
</span>
|
||||
</span>
|
||||
<span>
|
||||
<span
|
||||
class="vjs-tree-brackets"
|
||||
>
|
||||
[
|
||||
</span>
|
||||
<!---->
|
||||
<!---->
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="vjs-tree-node"
|
||||
collapsed-on-click-brackets="true"
|
||||
>
|
||||
<!---->
|
||||
<!---->
|
||||
<div
|
||||
class="vjs-indent"
|
||||
>
|
||||
<div
|
||||
class="vjs-indent-unit has-line"
|
||||
/>
|
||||
<div
|
||||
class="vjs-indent-unit has-line"
|
||||
/>
|
||||
<div
|
||||
class="vjs-indent-unit has-line"
|
||||
/>
|
||||
<!---->
|
||||
</div>
|
||||
<!---->
|
||||
<span>
|
||||
<span
|
||||
class="vjs-value vjs-value-number"
|
||||
>
|
||||
<span
|
||||
class="ph-no-capture mappable"
|
||||
data-depth="3"
|
||||
data-name="list[0]"
|
||||
data-path="[0].list[0]"
|
||||
data-target="mappable"
|
||||
data-value="{{ $node.Set.json.list[0] }}"
|
||||
>
|
||||
1
|
||||
</span>
|
||||
</span>
|
||||
<span>
|
||||
,
|
||||
</span>
|
||||
<!---->
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="vjs-tree-node"
|
||||
collapsed-on-click-brackets="true"
|
||||
>
|
||||
<!---->
|
||||
<!---->
|
||||
<div
|
||||
class="vjs-indent"
|
||||
>
|
||||
<div
|
||||
class="vjs-indent-unit has-line"
|
||||
/>
|
||||
<div
|
||||
class="vjs-indent-unit has-line"
|
||||
/>
|
||||
<div
|
||||
class="vjs-indent-unit has-line"
|
||||
/>
|
||||
<!---->
|
||||
</div>
|
||||
<!---->
|
||||
<span>
|
||||
<span
|
||||
class="vjs-value vjs-value-number"
|
||||
>
|
||||
<span
|
||||
class="ph-no-capture mappable"
|
||||
data-depth="3"
|
||||
data-name="list[1]"
|
||||
data-path="[0].list[1]"
|
||||
data-target="mappable"
|
||||
data-value="{{ $node.Set.json.list[1] }}"
|
||||
>
|
||||
2
|
||||
</span>
|
||||
</span>
|
||||
<span>
|
||||
,
|
||||
</span>
|
||||
<!---->
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="vjs-tree-node"
|
||||
collapsed-on-click-brackets="true"
|
||||
>
|
||||
<!---->
|
||||
<!---->
|
||||
<div
|
||||
class="vjs-indent"
|
||||
>
|
||||
<div
|
||||
class="vjs-indent-unit has-line"
|
||||
/>
|
||||
<div
|
||||
class="vjs-indent-unit has-line"
|
||||
/>
|
||||
<div
|
||||
class="vjs-indent-unit has-line"
|
||||
/>
|
||||
<!---->
|
||||
</div>
|
||||
<!---->
|
||||
<span>
|
||||
<span
|
||||
class="vjs-value vjs-value-number"
|
||||
>
|
||||
<span
|
||||
class="ph-no-capture mappable"
|
||||
data-depth="3"
|
||||
data-name="list[2]"
|
||||
data-path="[0].list[2]"
|
||||
data-target="mappable"
|
||||
data-value="{{ $node.Set.json.list[2] }}"
|
||||
>
|
||||
3
|
||||
</span>
|
||||
</span>
|
||||
<!---->
|
||||
<!---->
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="vjs-tree-node"
|
||||
collapsed-on-click-brackets="true"
|
||||
>
|
||||
<!---->
|
||||
<!---->
|
||||
<div
|
||||
class="vjs-indent"
|
||||
>
|
||||
<div
|
||||
class="vjs-indent-unit has-line"
|
||||
/>
|
||||
<div
|
||||
class="vjs-indent-unit has-line"
|
||||
/>
|
||||
<!---->
|
||||
</div>
|
||||
<!---->
|
||||
<span>
|
||||
<span
|
||||
class="vjs-tree-brackets"
|
||||
>
|
||||
]
|
||||
</span>
|
||||
<span>
|
||||
,
|
||||
</span>
|
||||
<!---->
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="vjs-tree-node"
|
||||
collapsed-on-click-brackets="true"
|
||||
>
|
||||
<!---->
|
||||
<!---->
|
||||
<div
|
||||
class="vjs-indent"
|
||||
>
|
||||
<div
|
||||
class="vjs-indent-unit has-line"
|
||||
/>
|
||||
<div
|
||||
class="vjs-indent-unit has-line"
|
||||
/>
|
||||
<!---->
|
||||
</div>
|
||||
<span
|
||||
class="vjs-key"
|
||||
>
|
||||
<span
|
||||
class="mappable"
|
||||
data-depth="2"
|
||||
data-name="record"
|
||||
data-path="[0].record"
|
||||
data-target="mappable"
|
||||
data-value="{{ $node.Set.json.record }}"
|
||||
>
|
||||
"record"
|
||||
</span>
|
||||
<span>
|
||||
:
|
||||
</span>
|
||||
</span>
|
||||
<span>
|
||||
<span
|
||||
class="vjs-tree-brackets"
|
||||
>
|
||||
{
|
||||
</span>
|
||||
<!---->
|
||||
<!---->
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="vjs-tree-node"
|
||||
collapsed-on-click-brackets="true"
|
||||
>
|
||||
<!---->
|
||||
<!---->
|
||||
<div
|
||||
class="vjs-indent"
|
||||
>
|
||||
<div
|
||||
class="vjs-indent-unit has-line"
|
||||
/>
|
||||
<div
|
||||
class="vjs-indent-unit has-line"
|
||||
/>
|
||||
<div
|
||||
class="vjs-indent-unit has-line"
|
||||
/>
|
||||
<!---->
|
||||
</div>
|
||||
<span
|
||||
class="vjs-key"
|
||||
>
|
||||
<span
|
||||
class="mappable"
|
||||
data-depth="3"
|
||||
data-name="name"
|
||||
data-path="[0].record.name"
|
||||
data-target="mappable"
|
||||
data-value="{{ $node.Set.json.record.name }}"
|
||||
>
|
||||
"name"
|
||||
</span>
|
||||
<span>
|
||||
:
|
||||
</span>
|
||||
</span>
|
||||
<span>
|
||||
<span
|
||||
class="vjs-value vjs-value-string"
|
||||
>
|
||||
<span
|
||||
class="ph-no-capture"
|
||||
>
|
||||
"Joe"
|
||||
</span>
|
||||
</span>
|
||||
<!---->
|
||||
<!---->
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="vjs-tree-node"
|
||||
collapsed-on-click-brackets="true"
|
||||
>
|
||||
<!---->
|
||||
<!---->
|
||||
<div
|
||||
class="vjs-indent"
|
||||
>
|
||||
<div
|
||||
class="vjs-indent-unit has-line"
|
||||
/>
|
||||
<div
|
||||
class="vjs-indent-unit has-line"
|
||||
/>
|
||||
<!---->
|
||||
</div>
|
||||
<!---->
|
||||
<span>
|
||||
<span
|
||||
class="vjs-tree-brackets"
|
||||
>
|
||||
}
|
||||
</span>
|
||||
<span>
|
||||
,
|
||||
</span>
|
||||
<!---->
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="vjs-tree-node"
|
||||
collapsed-on-click-brackets="true"
|
||||
>
|
||||
<!---->
|
||||
<!---->
|
||||
<div
|
||||
class="vjs-indent"
|
||||
>
|
||||
<div
|
||||
class="vjs-indent-unit has-line"
|
||||
/>
|
||||
<div
|
||||
class="vjs-indent-unit has-line"
|
||||
/>
|
||||
<!---->
|
||||
</div>
|
||||
<span
|
||||
class="vjs-key"
|
||||
>
|
||||
<span
|
||||
class="mappable"
|
||||
data-depth="2"
|
||||
data-name="myNumber"
|
||||
data-path="[0].myNumber"
|
||||
data-target="mappable"
|
||||
data-value="{{ $node.Set.json.myNumber }}"
|
||||
>
|
||||
"myNumber"
|
||||
</span>
|
||||
<span>
|
||||
:
|
||||
</span>
|
||||
</span>
|
||||
<span>
|
||||
<span
|
||||
class="vjs-value vjs-value-number"
|
||||
>
|
||||
<span
|
||||
class="ph-no-capture"
|
||||
>
|
||||
123
|
||||
</span>
|
||||
</span>
|
||||
<span>
|
||||
,
|
||||
</span>
|
||||
<!---->
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="vjs-tree-node"
|
||||
collapsed-on-click-brackets="true"
|
||||
>
|
||||
<!---->
|
||||
<!---->
|
||||
<div
|
||||
class="vjs-indent"
|
||||
>
|
||||
<div
|
||||
class="vjs-indent-unit has-line"
|
||||
/>
|
||||
<div
|
||||
class="vjs-indent-unit has-line"
|
||||
/>
|
||||
<!---->
|
||||
</div>
|
||||
<span
|
||||
class="vjs-key"
|
||||
>
|
||||
<span
|
||||
class="mappable"
|
||||
data-depth="2"
|
||||
data-name="myStringNumber"
|
||||
data-path="[0].myStringNumber"
|
||||
data-target="mappable"
|
||||
data-value="{{ $node.Set.json.myStringNumber }}"
|
||||
>
|
||||
"myStringNumber"
|
||||
</span>
|
||||
<span>
|
||||
:
|
||||
</span>
|
||||
</span>
|
||||
<span>
|
||||
<span
|
||||
class="vjs-value vjs-value-string"
|
||||
>
|
||||
<span
|
||||
class="ph-no-capture"
|
||||
>
|
||||
"456"
|
||||
</span>
|
||||
</span>
|
||||
<span>
|
||||
,
|
||||
</span>
|
||||
<!---->
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="vjs-tree-node"
|
||||
collapsed-on-click-brackets="true"
|
||||
>
|
||||
<!---->
|
||||
<!---->
|
||||
<div
|
||||
class="vjs-indent"
|
||||
>
|
||||
<div
|
||||
class="vjs-indent-unit has-line"
|
||||
/>
|
||||
<div
|
||||
class="vjs-indent-unit has-line"
|
||||
/>
|
||||
<!---->
|
||||
</div>
|
||||
<span
|
||||
class="vjs-key"
|
||||
>
|
||||
<span
|
||||
class="mappable"
|
||||
data-depth="2"
|
||||
data-name="myStringText"
|
||||
data-path="[0].myStringText"
|
||||
data-target="mappable"
|
||||
data-value="{{ $node.Set.json.myStringText }}"
|
||||
>
|
||||
"myStringText"
|
||||
</span>
|
||||
<span>
|
||||
:
|
||||
</span>
|
||||
</span>
|
||||
<span>
|
||||
<span
|
||||
class="vjs-value vjs-value-string"
|
||||
>
|
||||
<span
|
||||
class="ph-no-capture"
|
||||
>
|
||||
"abc"
|
||||
</span>
|
||||
</span>
|
||||
<span>
|
||||
,
|
||||
</span>
|
||||
<!---->
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="vjs-tree-node"
|
||||
collapsed-on-click-brackets="true"
|
||||
>
|
||||
<!---->
|
||||
<!---->
|
||||
<div
|
||||
class="vjs-indent"
|
||||
>
|
||||
<div
|
||||
class="vjs-indent-unit has-line"
|
||||
/>
|
||||
<div
|
||||
class="vjs-indent-unit has-line"
|
||||
/>
|
||||
<!---->
|
||||
</div>
|
||||
<span
|
||||
class="vjs-key"
|
||||
>
|
||||
<span
|
||||
class="mappable"
|
||||
data-depth="2"
|
||||
data-name="nil"
|
||||
data-path="[0].nil"
|
||||
data-target="mappable"
|
||||
data-value="{{ $node.Set.json.nil }}"
|
||||
>
|
||||
"nil"
|
||||
</span>
|
||||
<span>
|
||||
:
|
||||
</span>
|
||||
</span>
|
||||
<span>
|
||||
<span
|
||||
class="vjs-value vjs-value-null"
|
||||
>
|
||||
<span
|
||||
class="ph-no-capture"
|
||||
>
|
||||
null
|
||||
</span>
|
||||
</span>
|
||||
<span>
|
||||
,
|
||||
</span>
|
||||
<!---->
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="vjs-tree-node"
|
||||
collapsed-on-click-brackets="true"
|
||||
>
|
||||
<!---->
|
||||
<!---->
|
||||
<div
|
||||
class="vjs-indent"
|
||||
>
|
||||
<div
|
||||
class="vjs-indent-unit has-line"
|
||||
/>
|
||||
<div
|
||||
class="vjs-indent-unit has-line"
|
||||
/>
|
||||
<!---->
|
||||
</div>
|
||||
<span
|
||||
class="vjs-key"
|
||||
>
|
||||
<span
|
||||
class="mappable"
|
||||
data-depth="2"
|
||||
data-name="d"
|
||||
data-path="[0].d"
|
||||
data-target="mappable"
|
||||
data-value="{{ $node.Set.json.d }}"
|
||||
>
|
||||
"d"
|
||||
</span>
|
||||
<span>
|
||||
:
|
||||
</span>
|
||||
</span>
|
||||
<span>
|
||||
<span
|
||||
class="vjs-value vjs-value-undefined"
|
||||
>
|
||||
<span
|
||||
class="ph-no-capture"
|
||||
>
|
||||
|
||||
</span>
|
||||
</span>
|
||||
<!---->
|
||||
<!---->
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="vjs-tree-node"
|
||||
collapsed-on-click-brackets="true"
|
||||
>
|
||||
<!---->
|
||||
<!---->
|
||||
<div
|
||||
class="vjs-indent"
|
||||
>
|
||||
<div
|
||||
class="vjs-indent-unit has-line"
|
||||
/>
|
||||
<!---->
|
||||
</div>
|
||||
<!---->
|
||||
<span>
|
||||
<span
|
||||
class="vjs-tree-brackets"
|
||||
>
|
||||
}
|
||||
</span>
|
||||
<!---->
|
||||
<!---->
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="vjs-tree-node"
|
||||
collapsed-on-click-brackets="true"
|
||||
>
|
||||
<!---->
|
||||
<!---->
|
||||
<div
|
||||
class="vjs-indent"
|
||||
>
|
||||
<!---->
|
||||
</div>
|
||||
<!---->
|
||||
<span>
|
||||
<span
|
||||
class="vjs-tree-brackets"
|
||||
>
|
||||
]
|
||||
</span>
|
||||
<!---->
|
||||
<!---->
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="teleporter hidden"
|
||||
data-v-d4e6e290=""
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
@@ -0,0 +1,523 @@
|
||||
// Vitest Snapshot v1
|
||||
|
||||
exports[`RunDataJsonSchema.vue > renders schema for data 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="schemaWrapper"
|
||||
>
|
||||
<div
|
||||
class=""
|
||||
>
|
||||
<div
|
||||
class="schema"
|
||||
>
|
||||
<div
|
||||
class="item"
|
||||
data-test-id="run-data-schema-item"
|
||||
>
|
||||
<!---->
|
||||
<!---->
|
||||
<!---->
|
||||
<!---->
|
||||
<div
|
||||
class="sub"
|
||||
>
|
||||
<div
|
||||
class="item"
|
||||
data-test-id="run-data-schema-item"
|
||||
style="transition-delay: 0s;"
|
||||
>
|
||||
<div
|
||||
class="pill mappable"
|
||||
title="string"
|
||||
>
|
||||
<span
|
||||
class="label"
|
||||
data-depth="1"
|
||||
data-name="name"
|
||||
data-path=".name"
|
||||
data-target="mappable"
|
||||
data-value="{{ $json.name }}"
|
||||
>
|
||||
<font-awesome-icon-stub
|
||||
icon="font"
|
||||
size="sm"
|
||||
/>
|
||||
<!---->
|
||||
<span
|
||||
class=""
|
||||
>
|
||||
name
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
<span
|
||||
class="ph-no-capture text"
|
||||
>
|
||||
John
|
||||
</span>
|
||||
<!---->
|
||||
<!---->
|
||||
<!---->
|
||||
</div>
|
||||
<div
|
||||
class="item"
|
||||
data-test-id="run-data-schema-item"
|
||||
style="transition-delay: 0.033s;"
|
||||
>
|
||||
<div
|
||||
class="pill mappable"
|
||||
title="number"
|
||||
>
|
||||
<span
|
||||
class="label"
|
||||
data-depth="1"
|
||||
data-name="age"
|
||||
data-path=".age"
|
||||
data-target="mappable"
|
||||
data-value="{{ $json.age }}"
|
||||
>
|
||||
<font-awesome-icon-stub
|
||||
icon="hashtag"
|
||||
size="sm"
|
||||
/>
|
||||
<!---->
|
||||
<span
|
||||
class=""
|
||||
>
|
||||
age
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
<span
|
||||
class="ph-no-capture text"
|
||||
>
|
||||
22
|
||||
</span>
|
||||
<!---->
|
||||
<!---->
|
||||
<!---->
|
||||
</div>
|
||||
<div
|
||||
class="item"
|
||||
data-test-id="run-data-schema-item"
|
||||
style="transition-delay: 0.066s;"
|
||||
>
|
||||
<div
|
||||
class="pill mappable"
|
||||
title="array"
|
||||
>
|
||||
<span
|
||||
class="label"
|
||||
data-depth="1"
|
||||
data-name="hobbies"
|
||||
data-path=".hobbies"
|
||||
data-target="mappable"
|
||||
data-value="{{ $json.hobbies }}"
|
||||
>
|
||||
<font-awesome-icon-stub
|
||||
icon="list"
|
||||
size="sm"
|
||||
/>
|
||||
<!---->
|
||||
<span
|
||||
class=""
|
||||
>
|
||||
hobbies
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
<!---->
|
||||
<input
|
||||
checked="checked"
|
||||
id="input_array-0-2"
|
||||
type="checkbox"
|
||||
/>
|
||||
<label
|
||||
class="toggle"
|
||||
for="input_array-0-2"
|
||||
>
|
||||
<font-awesome-icon-stub
|
||||
icon="angle-up"
|
||||
/>
|
||||
</label>
|
||||
<div
|
||||
class="sub"
|
||||
>
|
||||
<div
|
||||
class="item"
|
||||
data-test-id="run-data-schema-item"
|
||||
style="transition-delay: 0s;"
|
||||
>
|
||||
<div
|
||||
class="pill mappable"
|
||||
title="string"
|
||||
>
|
||||
<span
|
||||
class="label"
|
||||
data-depth="2"
|
||||
data-name="string[0]"
|
||||
data-path=".hobbies[0]"
|
||||
data-target="mappable"
|
||||
data-value="{{ $json.hobbies[0] }}"
|
||||
>
|
||||
<font-awesome-icon-stub
|
||||
icon="font"
|
||||
size="sm"
|
||||
/>
|
||||
<span>
|
||||
hobbies
|
||||
</span>
|
||||
<span
|
||||
class="arrayIndex"
|
||||
>
|
||||
[0]
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
<span
|
||||
class="ph-no-capture text"
|
||||
>
|
||||
surfing
|
||||
</span>
|
||||
<!---->
|
||||
<!---->
|
||||
<!---->
|
||||
</div>
|
||||
<div
|
||||
class="item"
|
||||
data-test-id="run-data-schema-item"
|
||||
style="transition-delay: 0.033s;"
|
||||
>
|
||||
<div
|
||||
class="pill mappable"
|
||||
title="string"
|
||||
>
|
||||
<span
|
||||
class="label"
|
||||
data-depth="2"
|
||||
data-name="string[1]"
|
||||
data-path=".hobbies[1]"
|
||||
data-target="mappable"
|
||||
data-value="{{ $json.hobbies[1] }}"
|
||||
>
|
||||
<font-awesome-icon-stub
|
||||
icon="font"
|
||||
size="sm"
|
||||
/>
|
||||
<span>
|
||||
hobbies
|
||||
</span>
|
||||
<span
|
||||
class="arrayIndex"
|
||||
>
|
||||
[1]
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
<span
|
||||
class="ph-no-capture text"
|
||||
>
|
||||
traveling
|
||||
</span>
|
||||
<!---->
|
||||
<!---->
|
||||
<!---->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="teleporter hidden"
|
||||
data-v-d4e6e290=""
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
|
||||
exports[`RunDataJsonSchema.vue > renders schema for empty data 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="schemaWrapper"
|
||||
>
|
||||
<div
|
||||
class="n8n-info-tip info note bold"
|
||||
>
|
||||
<span
|
||||
class="iconText"
|
||||
>
|
||||
<span
|
||||
class="n8n-icon n8n-text compact size-medium regular"
|
||||
>
|
||||
<font-awesome-icon-stub
|
||||
class="medium"
|
||||
icon="info-circle"
|
||||
/>
|
||||
</span>
|
||||
<span>
|
||||
No data to show - item(s) exist, but they’re empty
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
|
||||
exports[`RunDataJsonSchema.vue > renders schema with spaces and dots 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="schemaWrapper"
|
||||
>
|
||||
<div
|
||||
class=""
|
||||
>
|
||||
<div
|
||||
class="schema"
|
||||
>
|
||||
<div
|
||||
class="item"
|
||||
data-test-id="run-data-schema-item"
|
||||
>
|
||||
<!---->
|
||||
<!---->
|
||||
<!---->
|
||||
<!---->
|
||||
<div
|
||||
class="sub"
|
||||
>
|
||||
<div
|
||||
class="item"
|
||||
data-test-id="run-data-schema-item"
|
||||
style="transition-delay: 0s;"
|
||||
>
|
||||
<div
|
||||
class="pill mappable"
|
||||
title="array"
|
||||
>
|
||||
<span
|
||||
class="label"
|
||||
data-depth="1"
|
||||
data-name="hello world"
|
||||
data-path="['hello world']"
|
||||
data-target="mappable"
|
||||
data-value="{{ $json['hello world'] }}"
|
||||
>
|
||||
<font-awesome-icon-stub
|
||||
icon="list"
|
||||
size="sm"
|
||||
/>
|
||||
<!---->
|
||||
<span
|
||||
class=""
|
||||
>
|
||||
hello world
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
<!---->
|
||||
<input
|
||||
checked="checked"
|
||||
id="input_array-0-0"
|
||||
type="checkbox"
|
||||
/>
|
||||
<label
|
||||
class="toggle"
|
||||
for="input_array-0-0"
|
||||
>
|
||||
<font-awesome-icon-stub
|
||||
icon="angle-up"
|
||||
/>
|
||||
</label>
|
||||
<div
|
||||
class="sub"
|
||||
>
|
||||
<div
|
||||
class="item"
|
||||
data-test-id="run-data-schema-item"
|
||||
style="transition-delay: 0s;"
|
||||
>
|
||||
<div
|
||||
class="pill mappable"
|
||||
title="object"
|
||||
>
|
||||
<span
|
||||
class="label"
|
||||
data-depth="2"
|
||||
data-name="object[0]"
|
||||
data-path="['hello world'][0]"
|
||||
data-target="mappable"
|
||||
data-value="{{ $json['hello world'][0] }}"
|
||||
>
|
||||
<font-awesome-icon-stub
|
||||
icon="cube"
|
||||
size="sm"
|
||||
/>
|
||||
<span>
|
||||
hello world
|
||||
</span>
|
||||
<span
|
||||
class="arrayIndex"
|
||||
>
|
||||
[0]
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
<!---->
|
||||
<input
|
||||
checked="checked"
|
||||
id="input_object-1-0"
|
||||
type="checkbox"
|
||||
/>
|
||||
<label
|
||||
class="toggle"
|
||||
for="input_object-1-0"
|
||||
>
|
||||
<font-awesome-icon-stub
|
||||
icon="angle-up"
|
||||
/>
|
||||
</label>
|
||||
<div
|
||||
class="sub"
|
||||
>
|
||||
<div
|
||||
class="item"
|
||||
data-test-id="run-data-schema-item"
|
||||
style="transition-delay: 0s;"
|
||||
>
|
||||
<div
|
||||
class="pill mappable"
|
||||
title="object"
|
||||
>
|
||||
<span
|
||||
class="label"
|
||||
data-depth="3"
|
||||
data-name="test"
|
||||
data-path="['hello world'][0].test"
|
||||
data-target="mappable"
|
||||
data-value="{{ $json['hello world'][0].test }}"
|
||||
>
|
||||
<font-awesome-icon-stub
|
||||
icon="cube"
|
||||
size="sm"
|
||||
/>
|
||||
<!---->
|
||||
<span
|
||||
class=""
|
||||
>
|
||||
test
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
<!---->
|
||||
<input
|
||||
checked="checked"
|
||||
id="input_object-2-0"
|
||||
type="checkbox"
|
||||
/>
|
||||
<label
|
||||
class="toggle"
|
||||
for="input_object-2-0"
|
||||
>
|
||||
<font-awesome-icon-stub
|
||||
icon="angle-up"
|
||||
/>
|
||||
</label>
|
||||
<div
|
||||
class="sub"
|
||||
>
|
||||
<div
|
||||
class="item"
|
||||
data-test-id="run-data-schema-item"
|
||||
style="transition-delay: 0s;"
|
||||
>
|
||||
<div
|
||||
class="pill mappable"
|
||||
title="number"
|
||||
>
|
||||
<span
|
||||
class="label"
|
||||
data-depth="4"
|
||||
data-name="more to think about"
|
||||
data-path="['hello world'][0].test['more to think about']"
|
||||
data-target="mappable"
|
||||
data-value="{{ $json['hello world'][0].test['more to think about'] }}"
|
||||
>
|
||||
<font-awesome-icon-stub
|
||||
icon="hashtag"
|
||||
size="sm"
|
||||
/>
|
||||
<!---->
|
||||
<span
|
||||
class=""
|
||||
>
|
||||
more to think about
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
<span
|
||||
class="ph-no-capture text"
|
||||
>
|
||||
1
|
||||
</span>
|
||||
<!---->
|
||||
<!---->
|
||||
<!---->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="item"
|
||||
data-test-id="run-data-schema-item"
|
||||
style="transition-delay: 0.033s;"
|
||||
>
|
||||
<div
|
||||
class="pill mappable"
|
||||
title="string"
|
||||
>
|
||||
<span
|
||||
class="label"
|
||||
data-depth="3"
|
||||
data-name="test.how"
|
||||
data-path="['hello world'][0]['test.how']"
|
||||
data-target="mappable"
|
||||
data-value="{{ $json['hello world'][0]['test.how'] }}"
|
||||
>
|
||||
<font-awesome-icon-stub
|
||||
icon="font"
|
||||
size="sm"
|
||||
/>
|
||||
<!---->
|
||||
<span
|
||||
class=""
|
||||
>
|
||||
test.how
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
<span
|
||||
class="ph-no-capture text"
|
||||
>
|
||||
ignore
|
||||
</span>
|
||||
<!---->
|
||||
<!---->
|
||||
<!---->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="teleporter hidden"
|
||||
data-v-d4e6e290=""
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
Reference in New Issue
Block a user