Merge pull request #97 from RedisInsight/feature/e2e-shortcuts

E2E test with Shortcuts is added

Author: elenaNaboko

tests/e2e/pageObjects/help-center-page.ts

@@ -0,0 +1,28 @@
+import { Selector } from 'testcafe';
+
+export class HelpCenterPage {
+
+    //------------------------------------------------------------------------------------------
+    //DECLARATION OF TYPES: DOM ELEMENTS and UI COMPONENTS
+    //*Assign the 'Selector' type to any element/component nested within the constructor.
+    //------------------------------------------------------------------------------------------
+    helpCenterPanel: Selector
+    helpCenterSubmitBugButton: Selector
+    helpCenterShortcutButton: Selector
+    helpCenterReleaseNotesButton: Selector
+
+    constructor() {
+        //-------------------------------------------------------------------------------------------
+        //DECLARATION OF SELECTORS
+        //*Declare all elements/components of the relevant page.
+        //*Target any element/component via data-id, if possible!
+        //*The following categories are ordered alphabetically (Alerts, Buttons, Checkboxes, etc.).
+        //-------------------------------------------------------------------------------------------
+        // BUTTONS
+        this.helpCenterSubmitBugButton = Selector('[data-testid=submit-bug-btn]');
+        this.helpCenterShortcutButton = Selector('[data-testid=shortcuts-btn]');
+        this.helpCenterReleaseNotesButton = Selector('[data-testid=release-notes-btn]');
+        // Panel
+        this.helpCenterPanel = Selector('[data-testid=help-center]')
+    }
+}

tests/e2e/pageObjects/index.ts

@@ -7,6 +7,8 @@ import { SettingsPage } from './settings-page';
 import { UserAgreementPage } from './user-agreement-page';
 import { WorkbenchPage } from './workbench-page';
 import { DatabaseOverviewPage } from './database-overview-page';
+import { HelpCenterPage } from './help-center-page';
+import { ShortcutsPage } from './shortcuts-page';
 
 export {
     AddRedisDatabasePage,
@@ -17,5 +19,7 @@ export {
     SettingsPage,
     UserAgreementPage,
     WorkbenchPage,
-    DatabaseOverviewPage
+    DatabaseOverviewPage,
+    HelpCenterPage,
+    ShortcutsPage
 }

tests/e2e/pageObjects/my-redis-databases-page.ts

@@ -10,6 +10,7 @@ export class MyRedisDatabasePage {
   dbNameList: Selector
   settingsButton: Selector
   workbenchButton: Selector
+  helpCenterButton: Selector
   myRedisDBButton: Selector
   toastCloseButton: Selector
   deleteDatabaseButton: Selector
@@ -32,6 +33,7 @@ export class MyRedisDatabasePage {
       //BUTTONS
       this.settingsButton = Selector('[data-testid=settings-page-btn]');
       this.workbenchButton = Selector('[data-testid=workbench-page-btn]');
+      this.helpCenterButton = Selector('[data-testid=help-menu-button]');
       this.browserButton = Selector('[data-testid=browser-page-btn]');
       this.myRedisDBButton = Selector('[data-test-subj=home-page-btn]');
       this.deleteDatabaseButton = Selector('[data-testid^=delete-instance-]');
@@ -70,7 +72,7 @@ export class MyRedisDatabasePage {
           await t.click(this.confirmDeleteButton);
       }
       if (await this.toastCloseButton.exists) {
-        await t.click(this.toastCloseButton);
+          await t.click(this.toastCloseButton);
       }
   }
 

tests/e2e/pageObjects/shortcuts-page.ts

@@ -0,0 +1,33 @@
+import { Selector } from 'testcafe';
+
+export class ShortcutsPage {
+
+    //------------------------------------------------------------------------------------------
+    //DECLARATION OF TYPES: DOM ELEMENTS and UI COMPONENTS
+    //*Assign the 'Selector' type to any element/component nested within the constructor.
+    //------------------------------------------------------------------------------------------
+
+    shortcutsPanel: Selector
+    shortcutsTitle: Selector
+    shortcutsDesktopApplicationSection: Selector
+    shortcutsCLISection: Selector
+    shortcutsWorkbenchSection: Selector
+    shortcutsCloseButton: Selector
+
+    constructor() {
+        //-------------------------------------------------------------------------------------------
+        //DECLARATION OF SELECTORS
+        //*Declare all elements/components of the relevant page.
+        //*Target any element/component via data-id, if possible!
+        //*The following categories are ordered alphabetically (Alerts, Buttons, Checkboxes, etc.).
+        //-------------------------------------------------------------------------------------------
+        // BUTTONS
+        this.shortcutsTitle = Selector('[data-testid=shortcuts-title]');
+        this.shortcutsDesktopApplicationSection = Selector('[data-test-subj="shortcuts-section-Desktop application"]');
+        this.shortcutsCLISection = Selector('[data-test-subj=shortcuts-section-CLI]');
+        this.shortcutsWorkbenchSection = Selector('[data-test-subj=shortcuts-section-Workbench]');
+        this.shortcutsCloseButton = Selector('[data-test-subj=euiFlyoutCloseButton]')
+        // Panel
+        this.shortcutsPanel = Selector('[data-test-subj=shortcuts-flyout]');
+    }
+}

tests/e2e/tests/regression/shortcuts/shortcuts.e2e.ts

@@ -0,0 +1,43 @@
+import {
+    UserAgreementPage,
+    MyRedisDatabasePage,
+    HelpCenterPage,
+    ShortcutsPage
+} from '../../../pageObjects';
+import {
+    commonUrl
+} from '../../../helpers/conf';
+
+const userAgreementPage = new UserAgreementPage();
+const myRedisDatabasePage = new MyRedisDatabasePage();
+const helpCenterPage = new HelpCenterPage();
+const shortcutsPage = new ShortcutsPage();
+
+fixture `Shortcuts`
+    .meta({ type: 'regression' })
+    .page(commonUrl)
+    .beforeEach(async t => {
+        await t.maximizeWindow();
+        await userAgreementPage.acceptLicenseTerms();
+    })
+
+test('Verify that user can see a summary of Shortcuts by clicking "Keyboard Shortcuts" button in Help Center', async t => {
+    // Click on help center icon
+    await t.click(myRedisDatabasePage.helpCenterButton);
+    // Verify that Help Center panel is opened
+    await t.expect(helpCenterPage.helpCenterPanel.exists).ok('Help Center panel is opened');
+    // Click on Shortcuts option
+    await t.click(helpCenterPage.helpCenterShortcutButton);
+    // Validate that Shortcuts panel is opened
+    await t.expect(shortcutsPage.shortcutsPanel.exists).ok('Shortcuts panel is opened');
+    // Validate Title and sections of Shortcuts
+    await t.expect(shortcutsPage.shortcutsPanel.exists).ok('Shortcuts panel is opened');
+    await t.expect(shortcutsPage.shortcutsTitle.exists).ok('shortcutsTitle is opened');
+    await t.expect(shortcutsPage.shortcutsDesktopApplicationSection.exists).ok('shortcutsDesktopApplicationSection is opened');
+    await t.expect(shortcutsPage.shortcutsCLISection.exists).ok('shortcutsCLISection is displayed');
+    await t.expect(shortcutsPage.shortcutsWorkbenchSection.exists).ok('shortcutsWorkbenchSection is displayed');
+    // Verify that user can close the Shortcuts
+    await t.click(shortcutsPage.shortcutsCloseButton);
+    // Verify that Shortcuts panel is not displayed
+    await t.expect(shortcutsPage.shortcutsPanel.exists).notOk('Shortcuts panel is not displayed');
+})