From 14f81c27252d94ed7153b9e439c4811c0aea5d1b Mon Sep 17 00:00:00 2001 From: Alex Grozav Date: Mon, 28 Nov 2022 12:11:39 +0200 Subject: [PATCH] test: Update getters, add search and sort tests for credentials (no-changelog) (#4716) * test(e2e): Update getters, add search and sort tests for credentials * fix: Refactor sortOptions getter * fix: fix merge conflict * fix: removed double key * fix: Add db and session reset for every credentials suite run --- cypress/e2e/2-credentials.cy.ts | 49 ++++++++++++++++++- cypress/pages/credentials.ts | 36 ++++++++++++-- cypress/pages/modals/credentials-modal.ts | 5 +- cypress/pages/workflows.ts | 6 +-- .../src/components/CredentialCard.vue | 1 - .../editor-ui/src/components/WorkflowCard.vue | 1 - .../forms/ResourceFiltersDropdown.vue | 6 ++- .../layouts/ResourcesListLayout.vue | 7 +-- 8 files changed, 94 insertions(+), 17 deletions(-) diff --git a/cypress/e2e/2-credentials.cy.ts b/cypress/e2e/2-credentials.cy.ts index a42ba1ee98..dad6f4e283 100644 --- a/cypress/e2e/2-credentials.cy.ts +++ b/cypress/e2e/2-credentials.cy.ts @@ -1,7 +1,6 @@ import { DEFAULT_USER_EMAIL, DEFAULT_USER_PASSWORD } from "../constants"; import { randFirstName, randLastName } from "@ngneat/falso"; import { CredentialsPage, CredentialsModal } from '../pages'; -// import { v4 as uuid } from 'uuid'; const username = DEFAULT_USER_EMAIL; const password = DEFAULT_USER_PASSWORD; @@ -11,6 +10,11 @@ const credentialsPage = new CredentialsPage(); const credentialsModal = new CredentialsModal(); describe('Credentials', () => { + before(() => { + cy.task('db:reset'); + Cypress.session.clearAllSavedSessions(); + }); + beforeEach(() => { cy.signup(username, firstName, lastName, password); @@ -37,5 +41,48 @@ describe('Credentials', () => { credentialsModal.actions.setName('My awesome Notion account'); credentialsModal.actions.save(); + credentialsModal.actions.close(); + + credentialsPage.getters.credentialCards().should('have.length', 1); + }); + + it('should create a new credential using Add Credential button', () => { + credentialsPage.getters.createCredentialButton().click(); + + credentialsModal.getters.newCredentialModal().should('be.visible'); + credentialsModal.getters.newCredentialTypeSelect().should('be.visible'); + credentialsModal.getters.newCredentialTypeOption('Airtable API').click(); + + credentialsModal.getters.newCredentialTypeButton().click(); + + credentialsModal.getters.connectionParameter('API Key').type('1234567890'); + + credentialsModal.actions.setName('Airtable Account'); + credentialsModal.actions.save(); + credentialsModal.actions.close(); + + credentialsPage.getters.credentialCards().should('have.length', 2); + }); + + it('should search credentials', () => { + // Search by name + credentialsPage.actions.search('Notion'); + credentialsPage.getters.credentialCards().should('have.length', 1); + + // Search by Credential type + credentialsPage.actions.search('Airtable API'); + credentialsPage.getters.credentialCards().should('have.length', 1); + + // No results + credentialsPage.actions.search('Google'); + credentialsPage.getters.credentialCards().should('have.length', 0); + credentialsPage.getters.emptyList().should('be.visible'); + }); + + it('should sort credentials', () => { + credentialsPage.actions.search(''); + credentialsPage.actions.sortBy('nameDesc'); + credentialsPage.getters.credentialCards().eq(0).should('contain.text', 'Notion'); + credentialsPage.actions.sortBy('nameAsc'); }); }); diff --git a/cypress/pages/credentials.ts b/cypress/pages/credentials.ts index 920dffdee4..33a7d38491 100644 --- a/cypress/pages/credentials.ts +++ b/cypress/pages/credentials.ts @@ -5,13 +5,39 @@ export class CredentialsPage extends BasePage { getters = { emptyListCreateCredentialButton: () => cy.getByTestId('empty-resources-list').find('button'), createCredentialButton: () => cy.getByTestId('resources-list-add'), - searchBar: () => cy.getByTestId('resources-list-search'), - credentialCards: () => cy.getByTestId('credential-card'), - credentialCard: (credentialName: string) => cy.getByTestId('credential-card') + searchInput: () => cy.getByTestId('resources-list-search'), + emptyList: () => cy.getByTestId('resources-list-empty'), + credentialCards: () => cy.getByTestId('resources-list-item'), + credentialCard: (credentialName: string) => this.getters.credentialCards() .contains(credentialName) - .parents('[data-test-id="credential-card"]'), + .parents('[data-test-id="resources-list-item"]'), credentialCardActions: (credentialName: string) => this.getters.credentialCard(credentialName) .findChildByTestId('credential-card-actions'), - credentialDeleteButton: () => cy.getByTestId('action-toggle-dropdown').filter(':visible').contains('Delete') + credentialDeleteButton: () => cy.getByTestId('action-toggle-dropdown').filter(':visible').contains('Delete'), + sort: () => cy.getByTestId('resources-list-sort'), + sortOption: (label: string) => this.getters.sort().contains(label).first(), + filtersTrigger: () => cy.getByTestId('resources-list-filters-trigger'), + filtersDropdown: () => cy.getByTestId('resources-list-filters-dropdown'), + }; + actions = { + search: (searchString: string) => { + const searchInput = this.getters.searchInput(); + searchInput.clear(); + + if (searchString) { + searchInput.type(searchString); + } + }, + sortBy: (type: 'nameAsc' | 'nameDesc' | 'lastUpdated' | 'lastCreated') => { + const sortTypes = { + nameAsc: 'Sort by name (A-Z)', + nameDesc: 'Sort by name (Z-A)', + lastUpdated: 'Sort by last updated', + lastCreated: 'Sort by last created', + }; + + this.getters.sort().click(); + this.getters.sortOption(sortTypes[type]).click(); + }, }; } diff --git a/cypress/pages/modals/credentials-modal.ts b/cypress/pages/modals/credentials-modal.ts index 92d3aaa871..2d2bc1a5c1 100644 --- a/cypress/pages/modals/credentials-modal.ts +++ b/cypress/pages/modals/credentials-modal.ts @@ -3,10 +3,10 @@ import { BasePage } from "../base"; export class CredentialsModal extends BasePage { getters = { newCredentialModal: () => cy.getByTestId('selectCredential-modal', { timeout: 5000 }), + editCredentialModal: () => cy.getByTestId('editCredential-modal', { timeout: 5000 }), newCredentialTypeSelect: () => cy.getByTestId('new-credential-type-select'), newCredentialTypeOption: (credentialType: string) => cy.getByTestId('new-credential-type-select-option').contains(credentialType), newCredentialTypeButton: () => cy.getByTestId('new-credential-type-button'), - editCredentialModal: () => cy.getByTestId('editCredential-modal', { timeout: 5000 }), connectionParameters: () => cy.getByTestId('credential-connection-parameter'), connectionParameter: (fieldName: string) => this.getters.connectionParameters().contains(fieldName) .parents('[data-test-id="credential-connection-parameter"]') @@ -14,7 +14,7 @@ export class CredentialsModal extends BasePage { name: () => cy.getByTestId('credential-name'), nameInput: () => cy.getByTestId('credential-name').find('input'), saveButton: () => cy.getByTestId('credential-save-button'), - closeButton: () => this.getters.editCredentialModal().find('.el-dialog__close'), + closeButton: () => this.getters.editCredentialModal().find('.el-dialog__close').first(), }; actions = { setName: (name: string) => { @@ -23,6 +23,7 @@ export class CredentialsModal extends BasePage { }, save: () => { this.getters.saveButton().click(); + this.getters.saveButton().should('contain.text', 'Saved'); }, close: () => { this.getters.closeButton().click(); diff --git a/cypress/pages/workflows.ts b/cypress/pages/workflows.ts index 783d45bd22..023e2d1821 100644 --- a/cypress/pages/workflows.ts +++ b/cypress/pages/workflows.ts @@ -7,10 +7,10 @@ export class WorkflowsPage extends BasePage { newWorkflowTemplateCard: () => cy.getByTestId('new-workflow-template-card'), searchBar: () => cy.getByTestId('resources-list-search'), createWorkflowButton: () => cy.getByTestId('resources-list-add'), - workflowCards: () => cy.getByTestId(`workflow-card`), - workflowCard: (workflowName: string) => cy.getByTestId(`workflow-card`) + workflowCards: () => cy.getByTestId('resources-list-item'), + workflowCard: (workflowName: string) => this.getters.workflowCards() .contains(workflowName) - .parents('[data-test-id="workflow-card"]'), + .parents('[data-test-id="resources-list-item"]'), workflowTags: (workflowName: string) => this.getters.workflowCard(workflowName) .findChildByTestId('workflow-card-tags'), workflowActivator: (workflowName: string) => this.getters.workflowCard(workflowName) diff --git a/packages/editor-ui/src/components/CredentialCard.vue b/packages/editor-ui/src/components/CredentialCard.vue index 5d5759d90d..fe16ce0c15 100644 --- a/packages/editor-ui/src/components/CredentialCard.vue +++ b/packages/editor-ui/src/components/CredentialCard.vue @@ -2,7 +2,6 @@