From c5f06d638b50c804d4f388a8fffe6092fd5f1b0c Mon Sep 17 00:00:00 2001 From: Alex Grozav Date: Tue, 25 Jul 2023 17:58:51 +0300 Subject: [PATCH] fix: fix tags manager --- cypress/e2e/17-workflow-tags.cy.ts | 17 +++++--- cypress/pages/workflow.ts | 43 ++++++++++--------- .../editor-ui/src/components/TagsDropdown.vue | 18 +++++++- .../components/TagsManager/TagsManager.vue | 1 + 4 files changed, 49 insertions(+), 30 deletions(-) diff --git a/cypress/e2e/17-workflow-tags.cy.ts b/cypress/e2e/17-workflow-tags.cy.ts index 56b548747d..83ff48c6a9 100644 --- a/cypress/e2e/17-workflow-tags.cy.ts +++ b/cypress/e2e/17-workflow-tags.cy.ts @@ -30,7 +30,7 @@ describe('Workflow tags', () => { } cy.contains('Done').click(); - wf.getters.createTagButton().click(); + wf.getters.tagsDropdown().click(); wf.getters.tagsInDropdown().should('have.length', 5); wf.getters.tagPills().should('have.length', 0); // none attached }); @@ -45,7 +45,7 @@ describe('Workflow tags', () => { }); cy.contains('Done').click(); - wf.getters.createTagButton().click(); + wf.getters.tagsDropdown().click(); wf.getters.tagsInDropdown().should('have.length', 0); // none stored wf.getters.tagPills().should('have.length', 0); // none attached }); @@ -57,7 +57,8 @@ describe('Workflow tags', () => { cy.contains('Create a tag').click(); cy.getByTestId('tags-table').find('input').type(first).type('{enter}'); - cy.getByTestId('edit-tag-button').click({ force: true }); + cy.getByTestId('tags-table').should('contain.text', first); + cy.getByTestId('edit-tag-button').eq(-1).click({ force: true }); cy.wait(300); cy.getByTestId('tags-table') .find('.el-input--large') @@ -65,7 +66,7 @@ describe('Workflow tags', () => { .type(' Updated') .type('{enter}'); cy.contains('Done').click(); - wf.getters.createTagButton().click(); + wf.getters.tagsDropdown().click(); wf.getters.tagsInDropdown().should('have.length', 1); // one stored wf.getters.tagsInDropdown().contains('Updated').should('exist'); wf.getters.tagPills().should('have.length', 0); // none attached @@ -76,16 +77,18 @@ describe('Workflow tags', () => { wf.actions.addTags(TEST_TAGS); wf.getters.nthTagPill(1).click(); wf.getters.tagsDropdown().find('.el-tag__close').first().click(); - cy.get('body').type('{enter}'); + cy.get('body').click(0, 0); wf.getters.tagPills().should('have.length', TEST_TAGS.length - 1); }); - it('should detach a tag inline by clicking on dropdown list item', () => { + it.only('should detach a tag inline by clicking on dropdown list item', () => { wf.getters.createTagButton().click(); wf.actions.addTags(TEST_TAGS); wf.getters.nthTagPill(1).click(); + cy.wait(300); + wf.getters.tagsDropdown().click(0, 0); wf.getters.tagsDropdown().find('li.selected').first().click(); - cy.get('body').type('{enter}'); + cy.get('body').click(0, 0); wf.getters.tagPills().should('have.length', TEST_TAGS.length - 1); }); }); diff --git a/cypress/pages/workflow.ts b/cypress/pages/workflow.ts index 31f509e3a8..7e40ace0cd 100644 --- a/cypress/pages/workflow.ts +++ b/cypress/pages/workflow.ts @@ -1,5 +1,6 @@ import { META_KEY } from '../constants'; import { BasePage } from './base'; +import { getVisibleSelect } from '../utils'; export class WorkflowPage extends BasePage { url = '/workflow/new'; @@ -84,7 +85,8 @@ export class WorkflowPage extends BasePage { duplicateWorkflowModal: () => cy.getByTestId('duplicate-modal'), nodeViewBackground: () => cy.getByTestId('node-view-background'), nodeView: () => cy.getByTestId('node-view'), - inlineExpressionEditorInput: () => cy.getByTestId('inline-expression-editor-input').find('[role=textbox]'), + inlineExpressionEditorInput: () => + cy.getByTestId('inline-expression-editor-input').find('[role=textbox]'), inlineExpressionEditorOutput: () => cy.getByTestId('inline-expression-editor-output'), zoomInButton: () => cy.getByTestId('zoom-in-button'), zoomOutButton: () => cy.getByTestId('zoom-out-button'), @@ -92,7 +94,8 @@ export class WorkflowPage extends BasePage { executeWorkflowButton: () => cy.getByTestId('execute-workflow-button'), clearExecutionDataButton: () => cy.getByTestId('clear-execution-data-button'), stopExecutionButton: () => cy.getByTestId('stop-execution-button'), - stopExecutionWaitingForWebhookButton: () => cy.getByTestId('stop-execution-waiting-for-webhook-button'), + stopExecutionWaitingForWebhookButton: () => + cy.getByTestId('stop-execution-waiting-for-webhook-button'), nodeCredentialsSelect: () => cy.getByTestId('node-credentials-select'), nodeCredentialsCreateOption: () => cy.getByTestId('node-credentials-select-item-new'), nodeCredentialsEditButton: () => cy.getByTestId('credential-edit-button'), @@ -138,17 +141,17 @@ export class WorkflowPage extends BasePage { this.getters.nodeCreatorSearchBar().type(nodeDisplayName); this.getters.nodeCreatorSearchBar().type('{enter}'); - cy.wait(500) + cy.wait(500); cy.get('body').then((body) => { - if(body.find('[data-test-id=node-creator]').length > 0) { - if(action) { - cy.contains(action).click() + if (body.find('[data-test-id=node-creator]').length > 0) { + if (action) { + cy.contains(action).click(); } else { // Select the first action - cy.get('[data-keyboard-nav-type="action"]').eq(0).click() + cy.get('[data-keyboard-nav-type="action"]').eq(0).click(); } } - }) + }); if (!preventNdvClose) cy.get('body').type('{esc}'); }, @@ -161,7 +164,8 @@ export class WorkflowPage extends BasePage { }, openTagManagerModal: () => { this.getters.createTagButton().click(); - this.getters.tagsDropdown().find('li.manage-tags').first().click(); + this.getters.tagsDropdown().click(); + getVisibleSelect().find('li.manage-tags').first().click(); }, openInlineExpressionEditor: () => { cy.contains('Expression').invoke('show').click(); @@ -213,7 +217,7 @@ export class WorkflowPage extends BasePage { this.getters.workflowTagsInput().type(tag); this.getters.workflowTagsInput().type('{enter}'); }); - cy.get('body').type('{enter}'); + cy.get('body').click(0, 0); // For a brief moment the Element UI tag component shows the tags as(+X) string // so we need to wait for it to disappear this.getters.workflowTagsContainer().should('not.contain', `+${tags.length}`); @@ -245,7 +249,12 @@ export class WorkflowPage extends BasePage { executeWorkflow: () => { this.getters.executeWorkflowButton().click(); }, - addNodeBetweenNodes: (sourceNodeName: string, targetNodeName: string, newNodeName: string, action?: string) => { + addNodeBetweenNodes: ( + sourceNodeName: string, + targetNodeName: string, + newNodeName: string, + action?: string, + ) => { this.getters.getConnectionBetweenNodes(sourceNodeName, targetNodeName).first().realHover(); this.getters .getConnectionActionsBetweenNodes(sourceNodeName, targetNodeName) @@ -272,18 +281,10 @@ export class WorkflowPage extends BasePage { this.getters.addStickyButton().click(); }, deleteSticky: () => { - this.getters.stickies().eq(0) - .realHover() - .find('[data-test-id="delete-sticky"]') - .click(); + this.getters.stickies().eq(0).realHover().find('[data-test-id="delete-sticky"]').click(); }, editSticky: (content: string) => { - this.getters.stickies() - .dblclick() - .find('textarea') - .clear() - .type(content) - .type('{esc}'); + this.getters.stickies().dblclick().find('textarea').clear().type(content).type('{esc}'); }, }; } diff --git a/packages/editor-ui/src/components/TagsDropdown.vue b/packages/editor-ui/src/components/TagsDropdown.vue index 62c4589422..6821aa32d3 100644 --- a/packages/editor-ui/src/components/TagsDropdown.vue +++ b/packages/editor-ui/src/components/TagsDropdown.vue @@ -1,7 +1,11 @@