[refactoring] - move nav panel and profiler to components, fix part of eslint errors

Author: mariasergeenko

tests/e2e/.eslintrc

@@ -52,7 +52,7 @@
         // ******************** NOT README STANDARDS ********************
         //Limits the length of a row to 400
         "max-len": ["error", 400],
-        
+
         //Forcing that all of the comments are with spaces.
         "spaced-comment": "off",
         //Forcing not to have random spaces.
@@ -128,6 +128,7 @@
         ],
         //Enforce a convention in module import order
         "import/order": "error",
+        "object-curly-spacing": ["error", "always"],
         //Disallow duplicate imports
         "import/no-duplicates": "error",
         /* Below are extended rules regarding the recommended typescript rule package...*/

tests/e2e/helpers/database.ts

@@ -228,7 +228,7 @@ export async function acceptLicenseAndConnectToRedisStack(): Promise<void> {
     await acceptLicenseTerms();
     //Connect to DB
     await t
-        .click(myRedisDatabasePage.myRedisDBButton)
+        .click(myRedisDatabasePage.NavigationPanel.myRedisDBButton)
         .click(addRedisDatabasePage.connectToRedisStackButton);
 }
 
@@ -247,7 +247,7 @@ export async function clearDatabaseInCli(): Promise<void> {
  * @param databaseName The database name
 */
 export async function deleteDatabase(databaseName: string): Promise<void> {
-    await t.click(myRedisDatabasePage.myRedisDBButton);
+    await t.click(myRedisDatabasePage.NavigationPanel.myRedisDBButton);
     if (await addRedisDatabasePage.addDatabaseButton.exists) {
         await deleteDatabaseByNameApi(databaseName);
     }
@@ -258,7 +258,7 @@ export async function deleteDatabase(databaseName: string): Promise<void> {
  * @param databaseName The database name
 */
 export async function deleteCustomDatabase(databaseName: string): Promise<void> {
-    await t.click(myRedisDatabasePage.myRedisDBButton);
+    await t.click(myRedisDatabasePage.NavigationPanel.myRedisDBButton);
     if (await addRedisDatabasePage.addDatabaseButton.exists) {
         await myRedisDatabasePage.deleteDatabaseByName(databaseName);
     }
@@ -301,4 +301,4 @@ export async function deleteDatabaseByNameApi(databaseName: string): Promise<voi
     await t.expect(databaseDeleteBtn.exists).ok(`"${databaseName}" database not displayed`);
     await t.click(databaseDeleteBtn);
     await t.click(myRedisDatabasePage.confirmDeleteButton);
-}
+}

tests/e2e/pageObjects/add-redis-database-page.ts

@@ -1,4 +1,4 @@
-import {t, Selector} from 'testcafe';
+import { t, Selector } from 'testcafe';
 
 export class AddRedisDatabasePage {
     //-------------------------------------------------------------------------------------------
@@ -58,13 +58,13 @@ export class AddRedisDatabasePage {
     buildFromDocker = Selector('a').withExactText('Docker');
     buildFromHomebrew = Selector('a').withExactText('Homebrew');
     // DROPDOWNS
-    caCertField = Selector('[data-testid=select-ca-cert]', {timeout: 500});
-    clientCertField = Selector('[data-testid=select-cert]', {timeout: 500});
+    caCertField = Selector('[data-testid=select-ca-cert]', { timeout: 500 });
+    clientCertField = Selector('[data-testid=select-cert]', { timeout: 500 });
     // CHECKBOXES
-    useSSHCheckbox = Selector('[data-testid=use-ssh]~div', {timeout: 500});
+    useSSHCheckbox = Selector('[data-testid=use-ssh]~div', { timeout: 500 });
     // RADIO BUTTONS
-    sshPasswordRadioBtn = Selector('#password~div', {timeout: 500});
-    sshPrivateKeyRadioBtn = Selector('#privateKey~div', {timeout: 500});
+    sshPasswordRadioBtn = Selector('#password~div', { timeout: 500 });
+    sshPrivateKeyRadioBtn = Selector('#privateKey~div', { timeout: 500 });
 
     /**
      * Adding a new redis database
@@ -108,11 +108,11 @@ export class AddRedisDatabasePage {
         }
         // Enter logical index
         await t.click(this.databaseIndexCheckbox);
-        await t.typeText(this.databaseIndexInput, index, { replace: true, paste: true});
+        await t.typeText(this.databaseIndexInput, index, { replace: true, paste: true });
         // Click for saving
         await t.click(this.addRedisDatabaseButton);
     }
-    
+
     /**
      * Adding a new standalone database with SSH
      * @param databaseParameters the parameters of the database
@@ -140,18 +140,18 @@ export class AddRedisDatabasePage {
             .typeText(this.sshPortInput, sshParameters.sshPort, { replace: true, paste: true })
             .typeText(this.sshUsernameInput, sshParameters.sshUsername, { replace: true, paste: true });
         if (!!sshParameters.sshPassword) {
-                await t.typeText(this.sshPasswordInput, sshParameters.sshPassword, { replace: true, paste: true });
+            await t.typeText(this.sshPasswordInput, sshParameters.sshPassword, { replace: true, paste: true });
         }
         if (!!sshParameters.sshPrivateKey) {
             await t
-            .click(this.sshPrivateKeyRadioBtn)
-            .typeText(this.sshPrivateKeyInput, sshParameters.sshPrivateKey, { replace: true, paste: true });
+                .click(this.sshPrivateKeyRadioBtn)
+                .typeText(this.sshPrivateKeyInput, sshParameters.sshPrivateKey, { replace: true, paste: true });
         }
         if (!!sshParameters.sshPassphrase) {
             await t
-            .click(this.sshPrivateKeyRadioBtn)
-            .typeText(this.sshPrivateKeyInput, sshParameters.sshPrivateKey!, { replace: true, paste: true })
-            .typeText(this.sshPassphraseInput, sshParameters.sshPassphrase, { replace: true, paste: true });
+                .click(this.sshPrivateKeyRadioBtn)
+                .typeText(this.sshPrivateKeyInput, sshParameters.sshPrivateKey!, { replace: true, paste: true })
+                .typeText(this.sshPassphraseInput, sshParameters.sshPassphrase, { replace: true, paste: true });
         }
         // Click for saving
         await t.click(this.addRedisDatabaseButton);
@@ -249,7 +249,7 @@ export type AddNewDatabaseParameters = {
         name?: string,
         certificate?: string,
         key?: string
-    },
+    }
 };
 
 /**
@@ -265,7 +265,7 @@ export type SentinelParameters = {
         alias?: string,
         db?: string,
         name?: string,
-        password?: string,
+        password?: string
     }[],
     sentinelPassword?: string,
     name?: string[]

tests/e2e/pageObjects/base-page.ts

@@ -0,0 +1,6 @@
+import { NavigationPanel } from './components/navigation-panel';
+
+export class BasePage {
+    NavigationPanel = new NavigationPanel();
+
+}

tests/e2e/pageObjects/browser-page.ts

@@ -1,9 +1,10 @@
 import { t, Selector } from 'testcafe';
 import { Common } from '../helpers/common';
+import { InstancePage } from './instance-page';
 
 const common = new Common();
 
-export class BrowserPage {
+export class BrowserPage extends InstancePage {
     //CSS Selectors
     cssSelectorGrid = '[aria-label="grid"]';
     cssSelectorRows = '[aria-label="row"]';
@@ -100,7 +101,6 @@ export class BrowserPage {
     editHashButton = Selector('[data-testid^=edit-hash-button-]');
     editZsetButton = Selector('[data-testid^=zset-edit-button-]');
     editListButton = Selector('[data-testid^=edit-list-button-]');
-    workbenchLinkButton = Selector('[data-test-subj=workbench-page-btn]');
     cancelStreamGroupBtn = Selector('[data-testid=cancel-stream-groups-btn]');
     submitTooltipBtn = Selector('[data-testid=submit-tooltip-btn]');
     patternModeBtn = Selector('[data-testid=search-mode-pattern-btn]');

tests/e2e/pageObjects/components/instance/index.ts

@@ -0,0 +1,5 @@
+import { Profiler } from './profiler';
+
+export {
+    Profiler
+};

tests/e2e/pageObjects/monitor-page.ts renamed to tests/e2e/pageObjects/components/instance/profiler.ts

@@ -1,12 +1,6 @@
-import {Selector, t} from 'testcafe';
+import { Selector, t } from 'testcafe';
 
-export class MonitorPage {
-    //-------------------------------------------------------------------------------------------
-    //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.).
-    //-------------------------------------------------------------------------------------------
+export class Profiler {
     //BUTTONS
     expandMonitor = Selector('[data-testid=expand-monitor]');
     runMonitorToggle = Selector('[data-testid=toggle-run-monitor]');
@@ -39,11 +33,11 @@ export class MonitorPage {
     async checkCommandInMonitorResults(command: string, parameters?: string[]): Promise<void> {
         const commandArray = command.split(' ');
         for (const value of commandArray) {
-            await t.expect(this.monitorCommandLinePart.withText(value).exists).ok({timeout: 6000});
+            await t.expect(this.monitorCommandLinePart.withText(value).exists).ok({ timeout: 6000 });
         }
         if (!!parameters) {
             for (const argument of parameters) {
-                await t.expect(this.monitorCommandLinePart.withText(argument).exists).ok({timeout: 6000});
+                await t.expect(this.monitorCommandLinePart.withText(argument).exists).ok({ timeout: 6000 });
             }
         }
     }

tests/e2e/pageObjects/components/navigation-panel.ts

@@ -0,0 +1,14 @@
+import { Selector } from 'testcafe';
+
+export class NavigationPanel {
+    workbenchButton = Selector('[data-testid=workbench-page-btn]');
+    analysisPageButton = Selector('[data-testid=analytics-page-btn]');
+    browserButton = Selector('[data-testid=browser-page-btn]');
+    pubSubButton = Selector('[data-testid=pub-sub-page-btn]');
+    myRedisDBButton = Selector('[data-test-subj=home-page-btn]', { timeout: 1000 });
+
+    notificationCenterButton = Selector('[data-testid=notification-menu-button]');
+    settingsButton = Selector('[data-testid=settings-page-btn]');
+    helpCenterButton = Selector('[data-testid=help-menu-button]');
+    githubButton = Selector('[data-testid=github-repo-icon]');
+}

tests/e2e/pageObjects/index.ts

@@ -11,12 +11,13 @@ import { DatabaseOverviewPage } from './database-overview-page';
 import { HelpCenterPage } from './help-center-page';
 import { ShortcutsPage } from './shortcuts-page';
 import { MemoryEfficiencyPage } from './memory-efficiency-page';
-import { MonitorPage } from './monitor-page';
 import { OverviewPage } from './overview-page';
 import { PubSubPage } from './pub-sub-page';
 import { SlowLogPage } from './slow-log-page';
 import { NotificationPage } from './notification-page';
 import { OnboardingPage} from './onboarding-page';
+import { BasePage} from './base-page';
+import { InstancePage} from './instance-page';
 
 export {
     AddRedisDatabasePage,
@@ -32,10 +33,11 @@ export {
     HelpCenterPage,
     ShortcutsPage,
     MemoryEfficiencyPage,
-    MonitorPage,
     OverviewPage,
     PubSubPage,
     SlowLogPage,
     NotificationPage,
-    OnboardingPage
+    OnboardingPage,
+    BasePage,
+    InstancePage
 };

tests/e2e/pageObjects/instance-page.ts

@@ -0,0 +1,7 @@
+import { BasePage } from './base-page';
+import { Profiler } from './components/instance';
+
+export class InstancePage extends BasePage {
+    Profiler = new Profiler();
+
+}