-
Notifications
You must be signed in to change notification settings - Fork 10.2k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat(editor): Filter component + implement in If node (#7490)
New Filter component + implementation in If node (v2) <img width="3283" alt="image" src="https://github.com/n8n-io/n8n/assets/8850410/35c379ef-4b62-4d06-82e7-673d4edcd652"> --------- Co-authored-by: Giulio Andreini <[email protected]> Co-authored-by: Michael Kret <[email protected]>
- Loading branch information
3 people
authored
Dec 13, 2023
1 parent
09a5729
commit 8a53434
Showing
56 changed files
with
5,064 additions
and
904 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,58 @@ | ||
| import { IF_NODE_NAME } from '../constants'; | ||
| import { WorkflowPage, NDV } from '../pages'; | ||
|
|
||
| const workflowPage = new WorkflowPage(); | ||
| const ndv = new NDV(); | ||
|
|
||
| const FILTER_PARAM_NAME = 'conditions'; | ||
|
|
||
| describe('If Node (filter component)', () => { | ||
| beforeEach(() => { | ||
| workflowPage.actions.visit(); | ||
| }); | ||
|
|
||
| it('should be able to create and delete multiple conditions', () => { | ||
| workflowPage.actions.addInitialNodeToCanvas(IF_NODE_NAME, { keepNdvOpen: true }); | ||
|
|
||
| // Default state | ||
| ndv.getters.filterComponent(FILTER_PARAM_NAME).should('exist'); | ||
| ndv.getters.filterConditions(FILTER_PARAM_NAME).should('have.length', 1); | ||
| ndv.getters | ||
| .filterConditionOperator(FILTER_PARAM_NAME) | ||
| .find('input') | ||
| .should('have.value', 'is equal to'); | ||
|
|
||
| // Add | ||
| ndv.actions.addFilterCondition(FILTER_PARAM_NAME); | ||
| ndv.getters.filterConditionLeft(FILTER_PARAM_NAME, 0).find('input').type('first left'); | ||
| ndv.getters.filterConditionLeft(FILTER_PARAM_NAME, 1).find('input').type('second left'); | ||
| ndv.actions.addFilterCondition(FILTER_PARAM_NAME); | ||
| ndv.getters.filterConditions(FILTER_PARAM_NAME).should('have.length', 3); | ||
|
|
||
| // Delete | ||
| ndv.actions.removeFilterCondition(FILTER_PARAM_NAME, 0); | ||
| ndv.getters.filterConditions(FILTER_PARAM_NAME).should('have.length', 2); | ||
| ndv.getters | ||
| .filterConditionLeft(FILTER_PARAM_NAME, 0) | ||
| .find('input') | ||
| .should('have.value', 'second left'); | ||
| ndv.actions.removeFilterCondition(FILTER_PARAM_NAME, 1); | ||
| ndv.getters.filterConditions(FILTER_PARAM_NAME).should('have.length', 1); | ||
| }); | ||
|
|
||
| it('should correctly evaluate conditions', () => { | ||
| cy.fixture('Test_workflow_filter.json').then((data) => { | ||
| cy.get('body').paste(JSON.stringify(data)); | ||
| }); | ||
|
|
||
| workflowPage.actions.zoomToFit(); | ||
| workflowPage.actions.executeWorkflow(); | ||
|
|
||
| workflowPage.actions.openNode('Then'); | ||
| ndv.getters.outputPanel().contains('3 items').should('exist'); | ||
| ndv.actions.close(); | ||
|
|
||
| workflowPage.actions.openNode('Else'); | ||
| ndv.getters.outputPanel().contains('1 item').should('exist'); | ||
| }); | ||
| }); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,153 @@ | ||
| { | ||
| "name": "Filter test", | ||
| "nodes": [ | ||
| { | ||
| "parameters": {}, | ||
| "id": "f332a7d1-31b4-4e78-b31e-9e8db945bf3f", | ||
| "name": "When clicking \"Execute Workflow\"", | ||
| "type": "n8n-nodes-base.manualTrigger", | ||
| "typeVersion": 1, | ||
| "position": [ | ||
| -60, | ||
| 480 | ||
| ] | ||
| }, | ||
| { | ||
| "parameters": { | ||
| "jsCode": "return [\n {\n \"label\": \"Apple\",\n tags: [],\n meta: {foo: 'bar'}\n },\n {\n \"label\": \"Banana\",\n tags: ['exotic'],\n meta: {}\n },\n {\n \"label\": \"Pear\",\n tags: ['other'],\n meta: {}\n },\n {\n \"label\": \"Orange\",\n meta: {}\n }\n]" | ||
| }, | ||
| "id": "60697c7f-3948-4790-97ba-8aba03d02ac2", | ||
| "name": "Code", | ||
| "type": "n8n-nodes-base.code", | ||
| "typeVersion": 2, | ||
| "position": [ | ||
| 160, | ||
| 480 | ||
| ] | ||
| }, | ||
| { | ||
| "parameters": { | ||
| "conditions": { | ||
| "options": { | ||
| "caseSensitive": true, | ||
| "leftValue": "" | ||
| }, | ||
| "conditions": [ | ||
| { | ||
| "leftValue": "={{ $json.tags }}", | ||
| "rightValue": "exotic", | ||
| "operator": { | ||
| "type": "array", | ||
| "operation": "contains", | ||
| "rightType": "any" | ||
| } | ||
| }, | ||
| { | ||
| "leftValue": "={{ $json.meta }}", | ||
| "rightValue": "", | ||
| "operator": { | ||
| "type": "object", | ||
| "operation": "notEmpty", | ||
| "singleValue": true | ||
| } | ||
| }, | ||
| { | ||
| "leftValue": "={{ $json.label }}", | ||
| "rightValue": "Pea", | ||
| "operator": { | ||
| "type": "string", | ||
| "operation": "startsWith", | ||
| "rightType": "string" | ||
| } | ||
| } | ||
| ], | ||
| "combinator": "or" | ||
| }, | ||
| "options": {} | ||
| }, | ||
| "id": "7531191b-5ac3-45dc-8afb-27ae83d8f33a", | ||
| "name": "If", | ||
| "type": "n8n-nodes-base.if", | ||
| "typeVersion": 2, | ||
| "position": [ | ||
| 380, | ||
| 480 | ||
| ] | ||
| }, | ||
| { | ||
| "parameters": {}, | ||
| "id": "d8c614ea-0bbf-4b12-ad7d-c9ebe09ce583", | ||
| "name": "Then", | ||
| "type": "n8n-nodes-base.noOp", | ||
| "typeVersion": 1, | ||
| "position": [ | ||
| 600, | ||
| 400 | ||
| ] | ||
| }, | ||
| { | ||
| "parameters": {}, | ||
| "id": "69364770-60d2-4ef4-9f29-9570718a9a10", | ||
| "name": "Else", | ||
| "type": "n8n-nodes-base.noOp", | ||
| "typeVersion": 1, | ||
| "position": [ | ||
| 600, | ||
| 580 | ||
| ] | ||
| } | ||
| ], | ||
| "pinData": {}, | ||
| "connections": { | ||
| "When clicking \"Execute Workflow\"": { | ||
| "main": [ | ||
| [ | ||
| { | ||
| "node": "Code", | ||
| "type": "main", | ||
| "index": 0 | ||
| } | ||
| ] | ||
| ] | ||
| }, | ||
| "Code": { | ||
| "main": [ | ||
| [ | ||
| { | ||
| "node": "If", | ||
| "type": "main", | ||
| "index": 0 | ||
| } | ||
| ] | ||
| ] | ||
| }, | ||
| "If": { | ||
| "main": [ | ||
| [ | ||
| { | ||
| "node": "Then", | ||
| "type": "main", | ||
| "index": 0 | ||
| } | ||
| ], | ||
| [ | ||
| { | ||
| "node": "Else", | ||
| "type": "main", | ||
| "index": 0 | ||
| } | ||
| ] | ||
| ] | ||
| } | ||
| }, | ||
| "active": false, | ||
| "settings": { | ||
| "executionOrder": "v1" | ||
| }, | ||
| "versionId": "a6249f48-d88f-4b80-9ed9-79555e522d48", | ||
| "id": "BWUTRs5RHxVgQ4uT", | ||
| "meta": { | ||
| "instanceId": "78577815012af39cf16dad7a787b0898c42fb7514b8a7f99b2136862c2af502c" | ||
| }, | ||
| "tags": [] | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.