Skip to content

Commit

Permalink
feat(editor): Updating node reference pattern in expression editor (#…
Browse files Browse the repository at this point in the history 
…6228)

* feat(editor): Updating node reference pattern in expression editor
* ⚡ Updated node ref when dragging data, telemetry and some comments
* ✔️ Updating tests
* 🔨 Removing old telemetry code, updating the current one based on the review feedback
* ✔️ Updating mapping e2e tests
  • Loading branch information
@MiloradFilipovic
MiloradFilipovic committed May 12, 2023
1 parent fc181ff commit 13bcec1
Show file tree
Hide file tree
Showing 6 changed files with 44 additions and 46 deletions.
8 changes: 4 additions & 4 deletions cypress/e2e/14-mapping.cy.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -194,7 +194,7 @@ describe('Data mapping', () => {
ndv.actions.mapToParameter('value');
ndv.getters
.inlineExpressionEditorInput()
.should('have.text', `{{ $node['${SCHEDULE_TRIGGER_NODE_NAME}'].json.input[0].count }}`);
.should('have.text', `{{ $('${SCHEDULE_TRIGGER_NODE_NAME}').item.json.input[0].count }}`);
ndv.getters.parameterExpressionPreview('value').should('not.exist');

ndv.actions.switchInputMode('Table');
Expand All @@ -203,7 +203,7 @@ describe('Data mapping', () => {
.inlineExpressionEditorInput()
.should(
'have.text',
`{{ $node['${SCHEDULE_TRIGGER_NODE_NAME}'].json.input[0].count }} {{ $node['${SCHEDULE_TRIGGER_NODE_NAME}'].json.input }}`,
`{{ $('${SCHEDULE_TRIGGER_NODE_NAME}').item.json.input[0].count }} {{ $('${SCHEDULE_TRIGGER_NODE_NAME}').item.json.input }}`,
);
ndv.actions.validateExpressionPreview('value', ' ');

Expand Down Expand Up @@ -311,12 +311,12 @@ describe('Data mapping', () => {
ndv.getters.parameterInput('keepOnlySet').find('input[type="text"]')
.should('exist')
.invoke('css', 'border')
.then((border) => expect(border).to.include('1.5px dashed rgb(90, 76, 194)'));
.then((border) => expect(border).to.include('dashed rgb(90, 76, 194)'));

ndv.getters.parameterInput('value').find('input[type="text"]')
.should('exist')
.invoke('css', 'border')
.then((border) => expect(border).to.include('1.5px dashed rgb(90, 76, 194)'));
.then((border) => expect(border).to.include('dashed rgb(90, 76, 194)'));
});

});
31 changes: 16 additions & 15 deletions packages/editor-ui/src/components/ExpressionEdit.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -181,21 +181,22 @@ export default mixins(externalHooks, genericHelpers, debounceHelper).extend({
trackProperties.variable_type = 'Raw value';
}
if (splitVar[0].startsWith('$node')) {
const sourceNodeName = splitVar[0].split('"')[1];
trackProperties.node_type_source =
this.workflowsStore.getNodeByName(sourceNodeName)?.type;
const nodeConnections: Array<Array<{ node: string }>> =
this.workflowsStore.outgoingConnectionsByNodeName(sourceNodeName).main;
trackProperties.is_immediate_input =
nodeConnections &&
nodeConnections[0] &&
!!nodeConnections[0].find(({ node }) => node === this.ndvStore.activeNode?.name || '')
? true
: false;
if (splitVar[1].startsWith('parameter')) {
trackProperties.parameter_name_source = splitVar[1].split('"')[1];
if (splitVar[0].startsWith("$('")) {
const match = /\$\('(.*?)'\)/.exec(splitVar[0]);
if (match && match.length > 1) {
const sourceNodeName = match[1];
trackProperties.node_type_source =
this.workflowsStore.getNodeByName(sourceNodeName)?.type;
const nodeConnections: Array<Array<{ node: string }>> =
this.workflowsStore.outgoingConnectionsByNodeName(sourceNodeName).main;
trackProperties.is_immediate_input =
nodeConnections &&
nodeConnections[0] &&
nodeConnections[0].some(({ node }) => node === this.ndvStore.activeNode?.name || '');
if (splitVar[1].startsWith('parameter')) {
trackProperties.parameter_name_source = splitVar[1].split('"')[1];
}
}
} else {
trackProperties.is_immediate_input = true;
Expand Down
18 changes: 7 additions & 11 deletions packages/editor-ui/src/components/VariableSelector.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -290,7 +290,7 @@ export default mixins(workflowHelpers).extend({
* @param {number} [runIndex=0] The index of the run
* @param {string} [inputName='main'] The name of the input
* @param {number} [outputIndex=0] The index of the output
* @param {boolean} [useShort=false] Use short notation $json vs. $node[NodeName].json
* @param {boolean} [useShort=false] Use short notation $json vs. $('NodeName').json
*/
getNodeRunDataOutput(
nodeName: string,
Expand Down Expand Up @@ -351,7 +351,7 @@ export default mixins(workflowHelpers).extend({
* @param {string} nodeName The name of the node to get the data of
* @param {IPinData[string]} pinData The node's pin data
* @param {string} filterText Filter text for parameters
* @param {boolean} [useShort=false] Use short notation $json vs. $node[NodeName].json
* @param {boolean} [useShort=false] Use short notation $json vs. $('NodeName').json
*/
getNodePinDataOutput(
nodeName: string,
Expand Down Expand Up @@ -382,7 +382,7 @@ export default mixins(workflowHelpers).extend({
// Get json data
if (outputData.hasOwnProperty('json')) {
const jsonPropertyPrefix = useShort === true ? '$json' : `$node["${nodeName}"].json`;
const jsonPropertyPrefix = useShort === true ? '$json' : `$('${nodeName}').item.json`;
const jsonDataOptions: IVariableSelectorOption[] = [];
for (const propertyName of Object.keys(outputData.json)) {
Expand All @@ -407,7 +407,7 @@ export default mixins(workflowHelpers).extend({
// Get binary data
if (outputData.hasOwnProperty('binary')) {
const binaryPropertyPrefix = useShort === true ? '$binary' : `$node["${nodeName}"].binary`;
const binaryPropertyPrefix = useShort === true ? '$binary' : `$('${nodeName}').item.binary`;
const binaryData = [];
let binaryPropertyData = [];
Expand Down Expand Up @@ -523,7 +523,7 @@ export default mixins(workflowHelpers).extend({
returnData.push({
name: key,
key: `$node["${nodeName}"].context["${key}"]`,
key: `$('${nodeName}').context["${key}"]`,
// @ts-ignore
value: nodeContext[key],
});
Expand Down Expand Up @@ -604,6 +604,7 @@ export default mixins(workflowHelpers).extend({
const currentNodeData: IVariableSelectorOption[] = [];
let tempOptions: IVariableSelectorOption[];
if (executionData !== null && executionData.data !== undefined) {
const runExecutionData: IRunExecutionData = executionData.data;
Expand Down Expand Up @@ -774,12 +775,7 @@ export default mixins(workflowHelpers).extend({
{
name: this.$locale.baseText('variableSelector.parameters'),
options: this.sortOptions(
this.getNodeParameters(
nodeName,
`$node["${nodeName}"].parameter`,
undefined,
filterText,
),
this.getNodeParameters(nodeName, `$('${nodeName}').params`, undefined, filterText),
),
} as IVariableSelectorOption,
];
Expand Down
22 changes: 11 additions & 11 deletions packages/editor-ui/src/components/__tests__/__snapshots__/RunDataJson.test.ts.snap
View file
Original file line number Diff line number Diff line change
Expand Up @@ -94,7 +94,7 @@ exports[`RunDataJson.vue > renders json values properly 1`] = `
data-name="list"
data-path="[0].list"
data-target="mappable"
data-value="{{ $node.Set.json.list }}"
data-value="{{ $('Set').item.json.list }}"
>
"list"
</span>
Expand Down Expand Up @@ -143,7 +143,7 @@ exports[`RunDataJson.vue > renders json values properly 1`] = `
data-name="list[0]"
data-path="[0].list[0]"
data-target="mappable"
data-value="{{ $node.Set.json.list[0] }}"
data-value="{{ $('Set').item.json.list[0] }}"
>
1
</span>
Expand Down Expand Up @@ -185,7 +185,7 @@ exports[`RunDataJson.vue > renders json values properly 1`] = `
data-name="list[1]"
data-path="[0].list[1]"
data-target="mappable"
data-value="{{ $node.Set.json.list[1] }}"
data-value="{{ $('Set').item.json.list[1] }}"
>
2
</span>
Expand Down Expand Up @@ -227,7 +227,7 @@ exports[`RunDataJson.vue > renders json values properly 1`] = `
data-name="list[2]"
data-path="[0].list[2]"
data-target="mappable"
data-value="{{ $node.Set.json.list[2] }}"
data-value="{{ $('Set').item.json.list[2] }}"
>
3
</span>
Expand Down Expand Up @@ -292,7 +292,7 @@ exports[`RunDataJson.vue > renders json values properly 1`] = `
data-name="record"
data-path="[0].record"
data-target="mappable"
data-value="{{ $node.Set.json.record }}"
data-value="{{ $('Set').item.json.record }}"
>
"record"
</span>
Expand Down Expand Up @@ -339,7 +339,7 @@ exports[`RunDataJson.vue > renders json values properly 1`] = `
data-name="name"
data-path="[0].record.name"
data-target="mappable"
data-value="{{ $node.Set.json.record.name }}"
data-value="{{ $('Set').item.json.record.name }}"
>
"name"
</span>
Expand Down Expand Up @@ -417,7 +417,7 @@ exports[`RunDataJson.vue > renders json values properly 1`] = `
data-name="myNumber"
data-path="[0].myNumber"
data-target="mappable"
data-value="{{ $node.Set.json.myNumber }}"
data-value="{{ $('Set').item.json.myNumber }}"
>
"myNumber"
</span>
Expand Down Expand Up @@ -467,7 +467,7 @@ exports[`RunDataJson.vue > renders json values properly 1`] = `
data-name="myStringNumber"
data-path="[0].myStringNumber"
data-target="mappable"
data-value="{{ $node.Set.json.myStringNumber }}"
data-value="{{ $('Set').item.json.myStringNumber }}"
>
"myStringNumber"
</span>
Expand Down Expand Up @@ -517,7 +517,7 @@ exports[`RunDataJson.vue > renders json values properly 1`] = `
data-name="myStringText"
data-path="[0].myStringText"
data-target="mappable"
data-value="{{ $node.Set.json.myStringText }}"
data-value="{{ $('Set').item.json.myStringText }}"
>
"myStringText"
</span>
Expand Down Expand Up @@ -567,7 +567,7 @@ exports[`RunDataJson.vue > renders json values properly 1`] = `
data-name="nil"
data-path="[0].nil"
data-target="mappable"
data-value="{{ $node.Set.json.nil }}"
data-value="{{ $('Set').item.json.nil }}"
>
"nil"
</span>
Expand Down Expand Up @@ -617,7 +617,7 @@ exports[`RunDataJson.vue > renders json values properly 1`] = `
data-name="d"
data-path="[0].d"
data-target="mappable"
data-value="{{ $node.Set.json.d }}"
data-value="{{ $('Set').item.json.d }}"
>
"d"
</span>
Expand Down
8 changes: 4 additions & 4 deletions packages/editor-ui/src/utils/__tests__/mappingUtils.test.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -207,7 +207,7 @@ describe('Mapping Utils', () => {
path: ['sample', 'path'],
};
const result = getMappedExpression(input);
expect(result).toBe('{{ $node.nodeName.json.sample.path }}');
expect(result).toBe("{{ $('nodeName').item.json.sample.path }}");
});

it('should generate a mapped expression with mixed array path', () => {
Expand All @@ -217,7 +217,7 @@ describe('Mapping Utils', () => {
path: ['sample', 0, 'path'],
};
const result = getMappedExpression(input);
expect(result).toBe('{{ $node.nodeName.json.sample[0].path }}');
expect(result).toBe("{{ $('nodeName').item.json.sample[0].path }}");
});

it('should generate a mapped expression with special characters in array path', () => {
Expand All @@ -228,7 +228,7 @@ describe('Mapping Utils', () => {
};
const result = getMappedExpression(input);
expect(result).toBe(
"{{ $node.nodeName.json.sample['path with-space']['path-with-hyphen'] }}",
"{{ $('nodeName').item.json.sample['path with-space']['path-with-hyphen'] }}",
);
});

Expand All @@ -251,7 +251,7 @@ describe('Mapping Utils', () => {
};
const result = getMappedExpression(input);
expect(result).toBe(
"{{ $node.nodeName.json.sample['\"Execute\"']['`Execute`']['\\'Execute\\'']['[Execute]']['{Execute}']['execute?']['test,']['test:']['path.'] }}",
"{{ $('nodeName').item.json.sample['\"Execute\"']['`Execute`']['\\'Execute\\'']['[Execute]']['{Execute}']['execute?']['test,']['test:']['path.'] }}",
);
});

Expand Down
3 changes: 2 additions & 1 deletion packages/editor-ui/src/utils/mappingUtils.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,8 @@ export function getMappedExpression({
distanceFromActive: number;
path: Array<string | number> | string;
}) {
const root = distanceFromActive === 1 ? '$json' : generatePath('$node', [nodeName, 'json']);
const root =
distanceFromActive === 1 ? '$json' : generatePath(`$('${nodeName}')`, ['item', 'json']);

if (typeof path === 'string') {
return `{{ ${root}${path} }}`;
Expand Down

0 comments on commit 13bcec1

Please sign in to comment.