From c0ea2b0a04d82e7235fc9c59a3142658da8c3f60 Mon Sep 17 00:00:00 2001 From: Sooraj Date: Wed, 18 Aug 2021 14:07:45 +0530 Subject: [PATCH] console: oss test optimisation https://github.com/hasura/graphql-engine-mono/pull/1837 GitOrigin-RevId: e638ca400a275a2cba7fec64f157c989b2147b8e --- console/cypress/helpers/constants.ts | 6 ++ .../cypress/integration/_onboarding/spec.ts | 25 +++++++++ .../cypress/integration/_onboarding/test.ts | 30 ++++++++++ console/cypress/integration/actions/spec.ts | 56 ++++++------------- console/cypress/integration/actions/test.ts | 2 +- .../integration/api-explorer/graphql/test.ts | 1 - console/cypress/integration/data/404/test.ts | 1 - .../integration/data/computed-fields/test.ts | 2 +- .../integration/data/create-table/test.ts | 1 - .../integration/data/custom-functions/test.ts | 2 +- .../integration/data/insert-browse/test.ts | 2 +- .../data/materialized-views/test.ts | 1 - .../integration/data/migration-mode/test.ts | 1 - .../cypress/integration/data/modify/test.ts | 1 - .../integration/data/permissions/test.ts | 1 - .../cypress/integration/data/raw-sql/test.ts | 1 - .../integration/data/relationships/test.ts | 2 +- .../cypress/integration/data/views/test.ts | 1 - .../integration/events/create-trigger/spec.ts | 7 ++- .../integration/events/create-trigger/test.ts | 1 - .../events/one-off-trigger/test.ts | 1 - .../create-remote-schema/test.ts | 3 +- .../integration/settings/metadata/test.ts | 10 ++-- .../components/Common/Onboarding/index.tsx | 14 ++++- 24 files changed, 104 insertions(+), 68 deletions(-) create mode 100644 console/cypress/integration/_onboarding/spec.ts create mode 100644 console/cypress/integration/_onboarding/test.ts diff --git a/console/cypress/helpers/constants.ts b/console/cypress/helpers/constants.ts index 993d3c7008429..5395f78a1d0b7 100644 --- a/console/cypress/helpers/constants.ts +++ b/console/cypress/helpers/constants.ts @@ -1 +1,7 @@ export const ADMIN_SECRET_HEADER_KEY = 'x-hasura-admin-secret'; + +// TODO cypress default timeout is 4000, we can remove this `AWAIT_SHORT` after verifying that this is followed by a test command that works with timeout +// https://docs.cypress.io/guides/references/configuration#Timeouts +export const AWAIT_SHORT = 2000; +export const AWAIT_MODERATE = 5000; +export const AWAIT_LONG = 7000; diff --git a/console/cypress/integration/_onboarding/spec.ts b/console/cypress/integration/_onboarding/spec.ts new file mode 100644 index 0000000000000..24c42fe7f98d0 --- /dev/null +++ b/console/cypress/integration/_onboarding/spec.ts @@ -0,0 +1,25 @@ +import { getElementFromAlias } from '../../helpers/dataHelpers'; + +export const viewOnboarding = () => { + // Click on create + cy.get(getElementFromAlias('onboarding-popup')) + .should('be.visible') + .should('contain.text', `Hi there, let's get started with Hasura!`); + // cy.get(getElementFromAlias('btn-hide-for-now')).click(); +}; +export const hideNow = () => { + // Click on create + cy.get(getElementFromAlias('btn-hide-for-now')).click(); + cy.get(getElementFromAlias('onboarding-popup')).should('not.exist'); +}; + +export const dontShowAgain = () => { + // Click on create + cy.reload(); + cy.get(getElementFromAlias('onboarding-popup')).should('be.visible'); + + cy.get(getElementFromAlias('btn-ob-dont-show-again')).click(); + cy.get(getElementFromAlias('onboarding-popup')).should('not.exist'); + cy.reload(); + cy.get(getElementFromAlias('onboarding-popup')).should('not.exist'); +}; diff --git a/console/cypress/integration/_onboarding/test.ts b/console/cypress/integration/_onboarding/test.ts new file mode 100644 index 0000000000000..0756a2a46eed3 --- /dev/null +++ b/console/cypress/integration/_onboarding/test.ts @@ -0,0 +1,30 @@ +import { + viewOnboarding, + hideNow, + dontShowAgain, +} from './spec'; +import { testMode } from '../../helpers/common'; +import { setMetaData } from '../validators/validators'; +import { getIndexRoute } from '../../helpers/dataHelpers'; + +const setup = () => { + describe('Setup route', () => { + it('Visit the index route', () => { + cy.visit(getIndexRoute()); + setMetaData(); + }); + }); +}; + +export const runActionsTests = () => { + describe('onboarding', () => { + it('should show onboarding guide', viewOnboarding); + it('should hide when user click on Hide Now', hideNow); + it('should hide forever when user click on Dont Show again', dontShowAgain); + }); +}; + +if (testMode !== 'cli') { + setup(); + runActionsTests(); +} diff --git a/console/cypress/integration/actions/spec.ts b/console/cypress/integration/actions/spec.ts index 586ee8ce5a3d2..6060b6ca6472e 100644 --- a/console/cypress/integration/actions/spec.ts +++ b/console/cypress/integration/actions/spec.ts @@ -4,6 +4,7 @@ import { getElementFromClassName, } from '../../helpers/dataHelpers'; import { setPromptValue } from '../../helpers/common'; +import { AWAIT_LONG } from '../../helpers/constants'; import { getTimeoutSeconds } from '../../helpers/eventHelpers'; const statements = { @@ -44,7 +45,6 @@ const clearActionDef = () => { which: 46, force: true, }); - cy.wait(2000); }; const clearActionTypes = () => { @@ -54,17 +54,14 @@ const clearActionTypes = () => { which: 46, force: true, }); - cy.wait(2000); }; const typeIntoActionDef = (content: string) => { cy.get('textarea').first().type(content, { force: true }); - cy.wait(2000); }; const typeIntoActionTypes = (content: string) => { cy.get('textarea').eq(1).type(content, { force: true }); - cy.wait(2000); }; const clearHandler = () => { @@ -80,34 +77,29 @@ const clearHandler = () => { force: true, } ); - cy.wait(2000); }; const typeIntoHandler = (content: string) => { cy.get(getElementFromAlias('action-create-handler-input')).type(content, { force: true, }); - cy.wait(2000); }; const clickOnCreateAction = () => { cy.get(getElementFromAlias('create-action-btn')).click({ force: true }); - cy.get('.notification', { timeout: 5000 }) + cy.get('.notification', { timeout: AWAIT_LONG }) .should('be.visible') .and('contain', 'Created action successfully'); - cy.wait(5000); }; export const routeToGraphiql = () => { cy.visit('/api/api-explorer'); - cy.wait(7000); - cy.url().should('eq', `${baseUrl}/api/api-explorer`); + cy.url({ timeout: AWAIT_LONG }).should('eq', `${baseUrl}/api/api-explorer`); }; export const createMutationAction = () => { // Click on create cy.get(getElementFromAlias('data-create-actions')).click(); - cy.wait(7000); // Clear default text on clearActionDef(); // type statement @@ -145,27 +137,24 @@ export const verifyMutation = () => { .type(`{enter}{uparrow}${statements.createMutationGQLQuery}`, { force: true, }); - cy.wait(3000); cy.get('textarea') .eq(1) .type(`{enter}{uparrow}${statements.createMutationQueryVars}`, { force: true, }); - cy.wait(3000); cy.get(getElementFromClassName('execute-button')).click(); // FIXME: NOT GOOD! - cy.wait(30000); cy.get('.cm-property').contains('login'); cy.get('.cm-property').contains('accessToken'); cy.get('.cm-string').contains('Ew8jkGCNDGAo7p35RV72e0Lk3RGJoJKB'); - - cy.wait(2000); }; export const modifyMutationAction = () => { cy.visit('/actions/manage/login/modify'); - cy.wait(7000); - cy.url().should('eq', `${baseUrl}/actions/manage/login/modify`); + cy.url({ timeout: AWAIT_LONG }).should( + 'eq', + `${baseUrl}/actions/manage/login/modify` + ); clearHandler(); typeIntoHandler(statements.changeHandlerText); @@ -177,36 +166,29 @@ export const modifyMutationAction = () => { .clear() .type('50'); cy.get(getElementFromAlias('save-modify-action-changes')).click(); - cy.get('.notification', { timeout: 5000 }) + cy.get('.notification', { timeout: AWAIT_LONG }) .should('be.visible') .and('contain', 'Action saved successfully'); cy.get(getElementFromAlias('modify-action-timeout-seconds')).should( 'have.value', '50' ); - cy.wait(5000); // permissions part cy.get(getElementFromAlias('actions-permissions')).click(); - cy.wait(2000); cy.get(getElementFromAlias('role-textbox')).type('hakuna_matata'); - cy.wait(1000); cy.get(getElementFromAlias('hakuna_matata-Permission')).click(); - cy.wait(1000); cy.get(getElementFromAlias('save-permissions-for-action')).click(); cy.get(getElementFromAlias('actions-modify')).click(); - - cy.wait(3000); }; const deleteAction = (promptValue: string) => { setPromptValue(promptValue); cy.get(getElementFromAlias('delete-action')).click(); cy.window().its('prompt').should('be.called'); - cy.wait(7000); }; export const deleteMutationAction = () => deleteAction('login'); @@ -214,11 +196,12 @@ export const deleteMutationAction = () => deleteAction('login'); export const createQueryAction = () => { // Routing to the index page cy.visit('/actions/manage/actions'); - cy.wait(7000); - cy.url().should('eq', `${baseUrl}/actions/manage/actions`); + cy.url({ timeout: AWAIT_LONG }).should( + 'eq', + `${baseUrl}/actions/manage/actions` + ); // Click on create cy.get(getElementFromAlias('data-create-actions')).click(); - cy.wait(7000); // Clear default text on clearActionDef(); // type statement @@ -248,39 +231,32 @@ export const verifyQuery = () => { .type(`{enter}{uparrow}${statements.createQueryGQLQuery}`, { force: true }) .wait(4000); cy.get(getElementFromClassName('execute-button')).click(); - cy.wait(30000); cy.get('.cm-property').contains('addNumbers'); cy.get('.cm-property').contains('sum'); cy.get('.cm-number').contains('10'); - - cy.wait(2000); }; export const modifyQueryAction = () => { cy.visit('/actions/manage/addNumbers/modify'); - cy.wait(7000); - cy.url().should('eq', `${baseUrl}/actions/manage/addNumbers/modify`); + cy.url({ timeout: AWAIT_LONG }).should( + 'eq', + `${baseUrl}/actions/manage/addNumbers/modify` + ); clearHandler(); typeIntoHandler(statements.changeHandlerText); cy.get(getElementFromAlias('save-modify-action-changes')).click(); - cy.wait(5000); // permissions part cy.get(getElementFromAlias('actions-permissions')).click(); - cy.wait(2000); cy.get(getElementFromAlias('role-textbox')).type('MANAGER'); - cy.wait(1000); cy.get(getElementFromAlias('MANAGER-Permission')).click(); - cy.wait(1000); cy.get(getElementFromAlias('save-permissions-for-action')).click(); cy.get(getElementFromAlias('actions-modify')).click(); - - cy.wait(3000); }; export const deleteQueryAction = () => deleteAction('addNumbers'); diff --git a/console/cypress/integration/actions/test.ts b/console/cypress/integration/actions/test.ts index 004cbe3f8c22f..8f82e92eb83e8 100644 --- a/console/cypress/integration/actions/test.ts +++ b/console/cypress/integration/actions/test.ts @@ -13,7 +13,7 @@ const setup = () => { describe('Setup route', () => { it('Visit the index route', () => { cy.visit('/actions/manage/actions'); - cy.wait(7000); + // Get and set validation metadata setMetaData(); }); }); diff --git a/console/cypress/integration/api-explorer/graphql/test.ts b/console/cypress/integration/api-explorer/graphql/test.ts index 369fde119ee1a..1282b0cff3e16 100644 --- a/console/cypress/integration/api-explorer/graphql/test.ts +++ b/console/cypress/integration/api-explorer/graphql/test.ts @@ -16,7 +16,6 @@ const setup = () => { it('Visit the index route', () => { // Visit the index route cy.visit('/'); - cy.wait(7000); // Get and set validation metadata setMetaData(); }); diff --git a/console/cypress/integration/data/404/test.ts b/console/cypress/integration/data/404/test.ts index 2de5affcbdc5f..a103044fe0260 100644 --- a/console/cypress/integration/data/404/test.ts +++ b/console/cypress/integration/data/404/test.ts @@ -7,7 +7,6 @@ const setup = () => { it('Visit the index route', () => { // Visit the index route cy.visit(getIndexRoute()); - cy.wait(7000); // Get and set validation metadata setMetaData(); }); diff --git a/console/cypress/integration/data/computed-fields/test.ts b/console/cypress/integration/data/computed-fields/test.ts index dc51dd24bed9b..a2b77637dd62e 100644 --- a/console/cypress/integration/data/computed-fields/test.ts +++ b/console/cypress/integration/data/computed-fields/test.ts @@ -18,7 +18,7 @@ const setup = () => { describe('Setup route', () => { it('Visit the index route', () => { cy.visit(getIndexRoute()); - cy.wait(7000); + // Get and set validation metadata setMetaData(); }); }); diff --git a/console/cypress/integration/data/create-table/test.ts b/console/cypress/integration/data/create-table/test.ts index fb5c784a36960..90f9912bc2b7c 100644 --- a/console/cypress/integration/data/create-table/test.ts +++ b/console/cypress/integration/data/create-table/test.ts @@ -19,7 +19,6 @@ const setup = () => { it('Visit the index route', () => { // Visit the index route cy.visit(getIndexRoute()); - cy.wait(7000); // Get and set validation metadata setMetaData(); }); diff --git a/console/cypress/integration/data/custom-functions/test.ts b/console/cypress/integration/data/custom-functions/test.ts index 93a7f078a0358..1d5580e857ad4 100644 --- a/console/cypress/integration/data/custom-functions/test.ts +++ b/console/cypress/integration/data/custom-functions/test.ts @@ -17,7 +17,7 @@ const setup = () => { describe('Setup route', () => { it('Visit the index route', () => { cy.visit(getIndexRoute()); - cy.wait(7000); + // Get and set validation metadata setMetaData(); }); }); diff --git a/console/cypress/integration/data/insert-browse/test.ts b/console/cypress/integration/data/insert-browse/test.ts index a7f59b9e376de..b2fb1e12bcadd 100644 --- a/console/cypress/integration/data/insert-browse/test.ts +++ b/console/cypress/integration/data/insert-browse/test.ts @@ -29,7 +29,7 @@ const setup = () => { describe('Setup route', () => { it('Visit the index route', () => { cy.visit(getIndexRoute()); - cy.wait(7000); + // Get and set validation metadata setMetaData(); }); }); diff --git a/console/cypress/integration/data/materialized-views/test.ts b/console/cypress/integration/data/materialized-views/test.ts index 7d108820c4e97..7478c049359b1 100644 --- a/console/cypress/integration/data/materialized-views/test.ts +++ b/console/cypress/integration/data/materialized-views/test.ts @@ -21,7 +21,6 @@ const setup = () => { it('Visit the index route', () => { // Visit the index route cy.visit(getIndexRoute()); - cy.wait(7000); // Get and set validation metadata setMetaData(); }); diff --git a/console/cypress/integration/data/migration-mode/test.ts b/console/cypress/integration/data/migration-mode/test.ts index c401d4d987956..d38d4f3dac1d8 100644 --- a/console/cypress/integration/data/migration-mode/test.ts +++ b/console/cypress/integration/data/migration-mode/test.ts @@ -9,7 +9,6 @@ const setup = () => { it('Visit the index route', () => { // Visit the index route cy.visit(getIndexRoute()); - cy.wait(7000); // Get and set validation metadata setMetaData(); }); diff --git a/console/cypress/integration/data/modify/test.ts b/console/cypress/integration/data/modify/test.ts index 81dc0ffedae8e..aba409744cb75 100644 --- a/console/cypress/integration/data/modify/test.ts +++ b/console/cypress/integration/data/modify/test.ts @@ -31,7 +31,6 @@ const setup = () => { it('Clicking on Data tab opens the correct route', () => { // Visit the index route cy.visit(getIndexRoute()); - cy.wait(7000); // Get and set validation metadata setMetaData(); }); diff --git a/console/cypress/integration/data/permissions/test.ts b/console/cypress/integration/data/permissions/test.ts index 7229ef7c1acd8..994fb3c03760f 100644 --- a/console/cypress/integration/data/permissions/test.ts +++ b/console/cypress/integration/data/permissions/test.ts @@ -19,7 +19,6 @@ const setup = () => { it('Clicking on Data tab opens the correct route', () => { // Visit the index route cy.visit(getIndexRoute()); - cy.wait(7000); // Get and set validation metadata setMetaData(); }); diff --git a/console/cypress/integration/data/raw-sql/test.ts b/console/cypress/integration/data/raw-sql/test.ts index 8f10b11b7b287..a52ca24697f2f 100644 --- a/console/cypress/integration/data/raw-sql/test.ts +++ b/console/cypress/integration/data/raw-sql/test.ts @@ -16,7 +16,6 @@ const setup = () => { it('Visit the index route', () => { // Visit the index route cy.visit(getIndexRoute()); - cy.wait(7000); // Get and set validation metadata setMetaData(); }); diff --git a/console/cypress/integration/data/relationships/test.ts b/console/cypress/integration/data/relationships/test.ts index 54d93231784de..330835dcd32f0 100644 --- a/console/cypress/integration/data/relationships/test.ts +++ b/console/cypress/integration/data/relationships/test.ts @@ -16,7 +16,7 @@ const setup = () => { describe('Check Data Tab', () => { it('Clicking on Data tab opens the correct route', () => { cy.visit(getIndexRoute()); - cy.wait(7000); + // Get and set validation metadata setMetaData(); }); }); diff --git a/console/cypress/integration/data/views/test.ts b/console/cypress/integration/data/views/test.ts index ac521d3540c06..1a8b7d9e99ab8 100644 --- a/console/cypress/integration/data/views/test.ts +++ b/console/cypress/integration/data/views/test.ts @@ -21,7 +21,6 @@ const setup = () => { it('Visit the index route', () => { // Visit the index route cy.visit(getIndexRoute()); - cy.wait(7000); // Get and set validation metadata setMetaData(); }); diff --git a/console/cypress/integration/events/create-trigger/spec.ts b/console/cypress/integration/events/create-trigger/spec.ts index 3d760ef81e0bd..8198ae3b52519 100644 --- a/console/cypress/integration/events/create-trigger/spec.ts +++ b/console/cypress/integration/events/create-trigger/spec.ts @@ -221,13 +221,16 @@ export const deleteCTTestTable = () => { cy.visit( `/data/default/schema/public/tables/${getTableName(0, testName)}/browse` ); - cy.get(getElementFromAlias('table-modify')).click(); + cy.get(getElementFromAlias('table-modify'), { timeout: 5000 }).click(); // Click on delete setPromptValue(getTableName(0, testName)); cy.get(getElementFromAlias('delete-table')).click(); // Confirm cy.window().its('prompt').should('be.called'); - cy.wait(7000); + cy.get(getElementFromAlias('data-create-table'), { timeout: 5000 }).should( + 'exist' + ); + // Match the URL cy.url().should('eq', `${baseUrl}/data/default/schema/public`); // Validate diff --git a/console/cypress/integration/events/create-trigger/test.ts b/console/cypress/integration/events/create-trigger/test.ts index a0f2ee23eba64..65e8c498ae432 100644 --- a/console/cypress/integration/events/create-trigger/test.ts +++ b/console/cypress/integration/events/create-trigger/test.ts @@ -20,7 +20,6 @@ const setup = () => { it('Clicking on Data tab opens the correct route', () => { // Visit the index route cy.visit(getIndexRoute()); - cy.wait(7000); // Get and set validation metadata setMetaData(); }); diff --git a/console/cypress/integration/events/one-off-trigger/test.ts b/console/cypress/integration/events/one-off-trigger/test.ts index 2e9c1f34f2b38..8402ed9de4de3 100644 --- a/console/cypress/integration/events/one-off-trigger/test.ts +++ b/console/cypress/integration/events/one-off-trigger/test.ts @@ -15,7 +15,6 @@ const setup = () => { it('Clicking on Data tab opens the correct route', () => { // Visit the index route cy.visit(getIndexRoute()); - cy.wait(7000); // Get and set validation metadata setMetaData(); }); diff --git a/console/cypress/integration/remote-schemas/create-remote-schema/test.ts b/console/cypress/integration/remote-schemas/create-remote-schema/test.ts index 74f2e97e080e2..bdca5ee889a83 100644 --- a/console/cypress/integration/remote-schemas/create-remote-schema/test.ts +++ b/console/cypress/integration/remote-schemas/create-remote-schema/test.ts @@ -17,7 +17,7 @@ import { deleteRemoteSchema, visitRemoteSchemaPermissionsTab, createSimpleRemoteSchemaPermission, - passWithUpdateRemoteSchema + passWithUpdateRemoteSchema, } from './spec'; const setup = () => { @@ -25,7 +25,6 @@ const setup = () => { it('Visit the index route', () => { // Visit the index route cy.visit('/remote-schemas/manage/schemas'); - cy.wait(7000); // Get and set validation metadata setMetaData(); }); diff --git a/console/cypress/integration/settings/metadata/test.ts b/console/cypress/integration/settings/metadata/test.ts index c0d2f116fcfbb..c337e2f7aa217 100644 --- a/console/cypress/integration/settings/metadata/test.ts +++ b/console/cypress/integration/settings/metadata/test.ts @@ -1,13 +1,13 @@ import { testMode } from '../../../helpers/common'; -import { - inconsistentMetadataPage, -} from './spec'; - +import { inconsistentMetadataPage } from './spec'; export const testInconsistentMetadatapage = () => { describe('Inconsistent Metadata', () => { - it('should render inconsistent metadata table with fake data', inconsistentMetadataPage); + it( + 'should render inconsistent metadata table with fake data', + inconsistentMetadataPage + ); }); }; diff --git a/console/src/components/Common/Onboarding/index.tsx b/console/src/components/Common/Onboarding/index.tsx index be9adb11bb0d8..cc29ada64ddb4 100644 --- a/console/src/components/Common/Onboarding/index.tsx +++ b/console/src/components/Common/Onboarding/index.tsx @@ -172,8 +172,11 @@ const Onboarding: React.FC = ({ )} {visible && ( -
-
+
+
Hasura Logo Hi there, let's get started with Hasura!
@@ -188,12 +191,17 @@ const Onboarding: React.FC = ({
-