[E2E] Command indicator and context saving for Workbench tests added

Author: elenaNaboko

redisinsight/ui/src/pages/workbench/components/enablament-area/EnablementArea/components/InternalPage/InternalPage.tsx

@@ -120,6 +120,7 @@ const InternalPage = (props: Props) => {
         </div>
       </EuiFlyoutHeader>
       <div
+        data-testid="enablement-area__page"
         ref={containerRef}
         className={cx(styles.content, 'enablement-area__page')}
         onScroll={handleScroll}

tests/e2e/pageObjects/workbench-page.ts

@@ -27,6 +27,7 @@ export class WorkbenchPage {
   preselectIndexInfo: Selector
   queryColumns: Selector
   preselectSearch: Selector
+  preselectHashCreate: Selector
   preselectManual: Selector
   scriptsLines: Selector
   queryInputScriptArea: Selector
@@ -41,6 +42,7 @@ export class WorkbenchPage {
   monacoCommandDetails: Selector
   monacoCloseCommandDetails: Selector
   monacoSuggestion: Selector
+  monacoCommandIndicator: Selector
   iframe: Selector
   internalLinkWorkingWithHashes: Selector
   preselectExactSearch: Selector
@@ -52,6 +54,7 @@ export class WorkbenchPage {
   noCommandHistoryIcon: Selector
   noCommandHistoryTitle: Selector
   noCommandHistoryText: Selector
+  scrolledEnablementArea: Selector
 
   constructor() {
       //CSS selectors
@@ -77,6 +80,7 @@ export class WorkbenchPage {
       this.selectViewType = Selector('[data-testid=select-view-type]');
       this.textViewTypeOption = Selector('[data-test-subj=view-type-option-Text]');
       this.preselectList = Selector('[data-testid*=preselect-List]');
+      this.preselectHashCreate = Selector('[data-testid=preselect-Create]');
       this.preselectIndexInfo = Selector('[data-testid*=preselect-Index]');
       this.preselectSearch = Selector('[data-testid=preselect-Search]');
       this.preselectExactSearch = Selector('[data-testid="preselect-Exact text search"]');
@@ -109,6 +113,8 @@ export class WorkbenchPage {
       this.noCommandHistoryIcon = Selector ('[data-testid=wb_no-results__icon]');
       this.noCommandHistoryTitle = Selector ('[data-testid=wb_no-results__title]');
       this.noCommandHistoryText = Selector ('[data-testid=wb_no-results__summary]');
+      this.monacoCommandIndicator = Selector('div.monaco-glyph-run-command');
+      this.scrolledEnablementArea = Selector('[data-testid=enablement-area__page]')
   }
 
   /**

tests/e2e/tests/regression/workbench/default-scripts-area.e2e.ts

@@ -54,3 +54,21 @@ test('Verify that user can see the [Manual] option in the Enablement area', asyn
         await t.expect(displayedOptions[i]).eql(optionsForCheck[i], `Option ${optionsForCheck} is in the Enablement area`);
     }
 });
+test('Verify that user can see saved article in Enablement area when he leaves Workbench page and goes back again', async t => {
+    //Open Working with Hashes section
+    await t.click(workbenchPage.internalLinkWorkingWithHashes);
+    //Check the button from Hash page is visible
+    await t.expect(workbenchPage.preselectHashCreate.visible).ok('The end of the page is visible');
+    //Go to Browser page
+    await t.click(myRedisDatabasePage.browserButton);
+    //Go back to Workbench page
+    await t.click(myRedisDatabasePage.workbenchButton);
+    //Verify that the same article is opened in Enablement area
+    await t.expect(workbenchPage.preselectHashCreate.visible).ok('The end of the page is visible');
+    //Go to list of DBs page
+    await t.click(myRedisDatabasePage.myRedisDBButton);
+    //Go back to active DB again
+    await myRedisDatabasePage.clickOnDBByName(ossStandaloneConfig.databaseName);
+    //Check that user is on Workbench page and "Working with Hashes" page is displayed
+    await t.expect(workbenchPage.preselectHashCreate.visible).ok('The end of the page is visible');
+});

tests/e2e/tests/regression/workbench/scripting-area.e2e.ts

@@ -1,3 +1,4 @@
+import { Selector } from 'testcafe';
 import { addNewStandaloneDatabase } from '../../../helpers/database';
 import {
     MyRedisDatabasePage,
@@ -67,3 +68,15 @@ test('Verify that user can use double slashes (//) wrapped in double quotes and
         await t.expect(resultCommand).contains(commandsForSend[commandsForSend.length - i], `The command ${commandsForSend[commandsForSend.length - i]} is in the result`);
     }
 });
+test('Verify that user can see an indication (green triangle) of commands from the left side of the line numbers', async t => {
+    //Open Working with Hashes page
+    await t.click(workbenchPage.internalLinkWorkingWithHashes);
+    //Put Create Hash commands into Editing area
+    await t.click(workbenchPage.preselectHashCreate);
+    //Maximize Scripting area to see all the commands
+    await t.drag(workbenchPage.resizeButtonForScriptingAndResults, 0, 300, { speed: 0.4 });
+    //Get number of commands in scripting area
+    const numberOfCommands = await Selector('span').withExactText('HSET').count;
+    //Compare number of indicator displayed and expected value
+    await t.expect(workbenchPage.monacoCommandIndicator.count).eql(numberOfCommands, 'Number of command indicator');
+});