e2e/feature/RI-5462_dedicated_editor_for_sql_rdi

tests/e2e/common-actions/monaco-editor.ts

@@ -2,7 +2,7 @@ import { Selector, t } from 'testcafe';
 
 export class MonacoEditor {
     /**
-     * Send  commands in monacoEditor
+     * Send commands in monacoEditor
      * @param input The input locator
      * @param command command
      * @param clean if  field should be cleaned
@@ -19,7 +19,7 @@ export class MonacoEditor {
     }
 
     /**
-     * Get  text from monacoEditor
+     * Get text from monacoEditor
      */
     static async getTextFromMonaco(): Promise<string> {
         const textAreaMonaco = Selector('[class^=view-lines ]');

tests/e2e/pageObjects/base-overview-page.ts

@@ -1,11 +1,12 @@
 import { Selector, t } from 'testcafe';
 import { RedisOverviewPage } from '../helpers/constants';
-import { Toast } from './components/toast';
+import { Toast } from './components/common/toast';
 import { ShortcutsPanel } from './components/shortcuts-panel';
+import { EditorButton } from './components/common/editorButton';
 export class BaseOverviewPage {
-
     ShortcutsPanel = new ShortcutsPanel();
     Toast = new Toast();
+    EditorButton = new EditorButton();
 
     notification = Selector('[data-testid^=-notification]');
     deleteRowButton = Selector('[data-testid^=delete-instance-]');

tests/e2e/pageObjects/base-page.ts

@@ -1,14 +1,16 @@
 import { Selector, t } from 'testcafe';
 import { NavigationPanel } from './components/navigation-panel';
-import { Toast } from './components/toast';
+import { Toast } from './components/common/toast';
 import { ShortcutsPanel } from './components/shortcuts-panel';
+import { EditorButton } from './components/common/editorButton';
 
 export class BasePage {
     notification = Selector('[data-testid^=-notification]');
 
     NavigationPanel = new NavigationPanel();
     ShortcutsPanel = new ShortcutsPanel();
     Toast = new Toast();
+    EditorButton = new EditorButton();
 
     /**
      * Reload page

tests/e2e/pageObjects/browser-page.ts

@@ -29,13 +29,10 @@ export class BrowserPage extends InstancePage {
     hashDeleteButton = Selector('[data-testid=hash-delete-btn]');
     setDeleteButton = Selector('[data-testid=set-delete-btn]');
     streamDeleteButton = Selector('[data-testid=stream-delete-btn]');
-    applyButton = Selector('[data-testid=apply-btn]');
     deleteKeyButton = Selector('[data-testid=delete-key-btn]');
     submitDeleteKeyButton = Selector('[data-testid=submit-delete-key]');
     confirmDeleteKeyButton = Selector('[data-testid=delete-key-confirm-btn]');
     editKeyTTLButton = Selector('[data-testid=edit-ttl-btn]');
-    closeEditTTL = Selector('[data-testid=cancel-btn]');
-    saveTTLValue = Selector('[data-testid=apply-btn]');
     refreshKeysButton = Selector('[data-testid=refresh-keys-btn]');
     refreshKeyButton = Selector('[data-testid=refresh-key-btn]');
     editKeyNameButton = Selector('[data-testid=edit-key-btn]');
@@ -593,7 +590,7 @@ export class BrowserPage extends InstancePage {
         await t
             .click(this.editKeyNameButton)
             .typeText(this.keyNameInput, keyName, { replace: true, paste: true })
-            .click(this.applyButton);
+            .click(this.EditorButton.applyBtn);
     }
 
     /**
@@ -604,7 +601,7 @@ export class BrowserPage extends InstancePage {
         await t
             .click(this.stringKeyValueInput)
             .typeText(this.stringKeyValueInput, value, { replace: true, paste: true })
-            .click(this.applyButton);
+            .click(this.EditorButton.applyBtn);
     }
 
     //Get String key value from details
@@ -620,7 +617,7 @@ export class BrowserPage extends InstancePage {
         await t
             .click(this.editZsetButton)
             .typeText(this.inlineItemEditor, value, { replace: true, paste: true })
-            .click(this.applyButton);
+            .click(this.EditorButton.applyBtn);
     }
 
     //Get Zset key score from details
@@ -651,7 +648,7 @@ export class BrowserPage extends InstancePage {
         await t
             .click(this.editHashButton)
             .typeText(this.hashFieldValueEditor, value, { replace: true, paste: true })
-            .click(this.applyButton);
+            .click(this.EditorButton.applyBtn);
     }
 
     //Get Hash key value from details
@@ -667,7 +664,7 @@ export class BrowserPage extends InstancePage {
         await t
             .click(this.editListButton)
             .typeText(this.listKeyElementEditorInput, value, { replace: true, paste: true })
-            .click(this.applyButton);
+            .click(this.EditorButton.applyBtn);
     }
 
     //Get List key value from details
@@ -683,7 +680,7 @@ export class BrowserPage extends InstancePage {
         await t
             .click(this.jsonScalarValue)
             .typeText(this.inlineItemEditor, value, { replace: true, paste: true })
-            .click(this.applyButton);
+            .click(this.EditorButton.applyBtn);
     }
 
     //Get JSON key value from details
@@ -842,7 +839,7 @@ export class BrowserPage extends InstancePage {
         await t.click(this.addJsonObjectButton);
         await t.typeText(this.jsonKeyInput, jsonKey, { replace: true, paste: true });
         await t.typeText(this.jsonValueInput, jsonKeyValue, { replace: true, paste: true });
-        await t.click(this.applyButton);
+        await t.click(this.EditorButton.applyBtn);
     }
 
     /**
@@ -855,7 +852,7 @@ export class BrowserPage extends InstancePage {
         await t.click(this.addJsonFieldButton);
         await t.typeText(this.jsonKeyInput, jsonKey, { replace: true, paste: true });
         await t.typeText(this.jsonValueInput, jsonKeyValue, { replace: true, paste: true });
-        await t.click(this.applyButton);
+        await t.click(this.EditorButton.applyBtn);
     }
 
     /**

tests/e2e/pageObjects/components/common/editorButton.ts

@@ -0,0 +1,6 @@
+import { Selector } from 'testcafe';
+
+export class EditorButton {
+    cancelBtn = Selector('[data-testid=cancel-btn]');
+    applyBtn = Selector('[data-testid=apply-btn]');
+}

tests/e2e/pageObjects/components/explore-tab.ts

@@ -1,7 +1,6 @@
 import { Selector, t } from 'testcafe';
 
 export class ExploreTab {
-
     dataStructureAccordionTutorialButton = Selector('[data-testid=accordion-button-ds]');
     triggersFunctionsAccordionTutorialButton = Selector('[data-testid=accordion-button-tf]');
     internalLinkWorkingWithHashes = Selector('[data-testid=internal-link-ds-hashes]');

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

@@ -1,8 +1,7 @@
-import { Selector, t } from 'testcafe';
+import { Selector } from 'testcafe';
 import { BaseNavigationPanel } from './base-navigation-panel';
 
 export class RdiNavigationPanel extends BaseNavigationPanel{
     managementPageButton = Selector('[data-testid=pipeline-management-page-btn]');
     statusPageButton = Selector('[data-testid=pipeline-status-page-btn]');
-
 }

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

@@ -1,6 +1,8 @@
 import { Selector, t } from 'testcafe';
+import { EditorButton } from './common/editorButton';
 
 export class OverviewPanel {
+    EditorButton = new EditorButton();
     // TEXT ELEMENTS
     overviewTotalKeys = Selector('[data-test-subj=overview-total-keys]');
     overviewTotalMemory = Selector('[data-test-subj=overview-total-memory]');
@@ -15,7 +17,6 @@ export class OverviewPanel {
     overviewRedisStackLogo = Selector('[data-testid=redis-stack-logo]');
     overviewMoreInfo = Selector('[data-testid=overview-more-info-button]');
     changeIndexBtn = Selector('[data-testid=change-index-btn]');
-    applyButton = Selector('[data-testid=apply-btn]');
     databaseInfoIcon = Selector('[data-testid=db-info-icon]');
     // PANEL
     overviewTooltip = Selector('[data-testid=overview-more-info-tooltip]');
@@ -30,7 +31,7 @@ export class OverviewPanel {
     async changeDbIndex(dbIndex: number): Promise<void> {
         await t.click(this.changeIndexBtn)
             .typeText(this.changeIndexInput, dbIndex.toString(), { replace: true, paste: true })
-            .click(this.applyButton)
+            .click(this.EditorButton.applyBtn)
             .expect(this.changeIndexBtn.textContent).contains(dbIndex.toString());
     }
 

tests/e2e/pageObjects/components/rdi/pipeline-management-panel.ts

@@ -1,6 +1,8 @@
 import { Selector, t } from 'testcafe';
+import { EditorButton } from '../common/editorButton';
 
 export class PipelineManagementPanel {
+    EditorButton = new EditorButton();
     configurationTab = Selector('[data-testid=rdi-nav-btn-config] div');
 
     refreshPipelineIcon = Selector('[data-testid=refresh-pipeline-btn]');
@@ -12,8 +14,6 @@ export class PipelineManagementPanel {
     //Jobs
     addJobBtn = Selector('[data-testid=add-new-job]');
     jobNameInput = Selector('[data-testid^=job-name-input-]');
-    applyJobNameBtn = Selector('[data-testid=apply-btn]');
-    cancelJobNameBtn = Selector('[data-testid=cancel-btn]');
     jobItem = Selector('[data-testid*=rdi-nav-job-actions]');
     confirmBtn  = Selector('[data-testid=confirm-btn]');
     jobsPipelineTitle = Selector('[class*=rdi__title]');
@@ -35,7 +35,7 @@ export class PipelineManagementPanel {
     async addJob(name: string): Promise<void> {
         await t.click(this.addJobBtn);
         await t.typeText(this.jobNameInput, name);
-        await t.click(this.applyJobNameBtn);
+        await t.click(this.EditorButton.applyBtn);
     }
     /**
      * Open Job by name
@@ -64,7 +64,6 @@ export class PipelineManagementPanel {
         const jobBtnSelector = Selector(`[data-testid=edit-job-name-${name}]`);
         await t.click(jobBtnSelector)
             .typeText(this.jobNameInput, newName, { replace: true })
-            .click(this.applyJobNameBtn);
+            .click(this.EditorButton.applyBtn);
     }
-
 }

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

@@ -31,7 +31,6 @@ export class MyRedisDatabasePage extends BaseOverviewPage {
     confirmDeleteAllDbButton = Selector('[data-testid=delete-selected-dbs]');
     editDatabaseButton = Selector('[data-testid^=edit-instance]');
     editAliasButton = Selector('[data-testid=edit-alias-btn]');
-    applyButton = Selector('[data-testid=apply-btn]');
     submitChangesButton = Selector('[data-testid=btn-submit]');
     promoButton = Selector('[data-testid=promo-btn]');
     sortByDatabaseAlias = Selector('span').withAttribute('title', 'Database Alias');

tests/e2e/pageObjects/rdi-instance-page.ts

@@ -30,6 +30,8 @@ export class RdiInstancePage extends BaseOverviewPage {
     configurationLink = Selector('[data-testid=rdi-pipeline-config-link]');
 
     jobsInput = Selector('[data-testid=wrapper-rdi-monaco-jobs]');
+    draggableArea = Selector('[data-testid=draggable-area]');
+    dedicatedLanguageSelect = Selector('[data-testid=dedicated-editor-language-select]');
 
     successDeployNotification = Selector('[data-testid=success-deploy-pipeline-notification]');
     errorDeployNotification = Selector('[data-test-subj=toast-error-deploy]');

tests/e2e/pageObjects/settings-page.ts

@@ -18,7 +18,6 @@ export class SettingsPage extends BasePage {
     submitConsentsPopupButton = Selector('[data-testid=consents-settings-popup] [data-testid=btn-submit]');
     switchNotificationsOption = Selector('[data-testid=switch-option-notifications]');
     switchEditorCleanupOption = Selector('[data-testid=switch-workbench-cleanup]');
-    applyButton = Selector('[data-testid=apply-btn]');
     //TEXT INPUTS (also referred to as 'Text fields')
     keysToScanValue = Selector('[data-testid=keys-to-scan-value]');
     keysToScanInput = Selector('[data-testid=keys-to-scan-input]');
@@ -35,7 +34,7 @@ export class SettingsPage extends BasePage {
             .hover(this.keysToScanValue)
             .click(this.keysToScanInput)
             .typeText(this.keysToScanInput, value, { replace: true, paste: true })
-            .click(this.applyButton);
+            .click(this.EditorButton.applyBtn);
     }
 
     /**
@@ -46,7 +45,7 @@ export class SettingsPage extends BasePage {
         await t.hover(this.commandsInPipelineValue)
             .click(this.commandsInPipelineInput)
             .typeText(this.commandsInPipelineInput, value, { replace: true, paste: true })
-            .click(this.applyButton);
+            .click(this.EditorButton.applyBtn);
     }
 
     /**

tests/e2e/pageObjects/triggers-and-functions-libraries-page.ts

@@ -7,7 +7,6 @@ import { InstancePage } from './instance-page';
 export class TriggersAndFunctionsLibrariesPage extends InstancePage {
     //Buttons
     editMonacoButton = Selector('[data-testid=edit-monaco-value]');
-    acceptButton = Selector('[data-testid=apply-btn]');
     addLibraryButton = Selector('[data-testid=btn-add-library]');
     uploadFileButton = Selector('[data-testid=upload-file-btn]');
     addLibrarySubmitButton = Selector('[data-testid=add-library-btn-submit]');

tests/e2e/pageObjects/workbench-page.ts

@@ -39,8 +39,6 @@ export class WorkbenchPage extends InstancePage {
     reRunCommandButton = Selector('[data-testid=re-run-command]');
     preselectManual = Selector('[data-testid=preselect-Manual]');
     fullScreenButton = Selector('[data-testid=toggle-full-screen]');
-    cancelButton = Selector('[data-testid=cancel-btn]');
-    applyButton = Selector('[data-testid=apply-btn]');
     queryCardNoModuleButton = Selector('[data-testid=query-card-no-module-button] a');
     rawModeBtn = Selector('[data-testid="btn-change-mode"]');
     closeEnablementPage = Selector('[data-testid=enablement-area__page-close]');

tests/e2e/tests/web/critical-path/rdi/add-job.e2e.ts

@@ -33,7 +33,6 @@ fixture.skip `Add job`
         await rdiApiRequests.addNewRdiApi(rdiInstance);
         await rdiInstancesListPage.reloadPage();
         await rdiInstancesListPage.clickRdiByName(rdiInstance.name);
-
     })
     .afterEach(async() => {
         await rdiApiRequests.deleteAllRdiApi();
@@ -49,11 +48,11 @@ test('Verify that user can add, edit and delete job', async() => {
     await t.expect(placeholder).eql('Enter job name');
 
     await t
-        .expect(rdiInstancePage.PipelineManagementPanel.applyJobNameBtn.hasAttribute('disabled')).ok('the button is not disabled');
-    await t.hover(rdiInstancePage.PipelineManagementPanel.applyJobNameBtn);
+        .expect(rdiInstancePage.PipelineManagementPanel.EditorButton.applyBtn.hasAttribute('disabled')).ok('the button is not disabled');
+    await t.hover(rdiInstancePage.PipelineManagementPanel.EditorButton.applyBtn);
     await browserActions.verifyTooltipContainsText('Job name is required', true);
 
-    await t.click(rdiInstancePage.PipelineManagementPanel.cancelJobNameBtn);
+    await t.click(rdiInstancePage.EditorButton.cancelBtn);
     await rdiInstancePage.PipelineManagementPanel.addJob(jobName);
 
     const elementItem = await rdiInstancePage.PipelineManagementPanel.jobItem.count;
@@ -62,10 +61,10 @@ test('Verify that user can add, edit and delete job', async() => {
     await t.click(rdiInstancePage.PipelineManagementPanel.addJobBtn);
     await t.typeText(rdiInstancePage.PipelineManagementPanel.jobNameInput, jobName);
     await t
-        .expect(rdiInstancePage.PipelineManagementPanel.applyJobNameBtn.hasAttribute('disabled')).ok('the button is not disabled');
-    await t.hover(rdiInstancePage.PipelineManagementPanel.applyJobNameBtn);
+        .expect(rdiInstancePage.PipelineManagementPanel.EditorButton.applyBtn.hasAttribute('disabled')).ok('the button is not disabled');
+    await t.hover(rdiInstancePage.PipelineManagementPanel.EditorButton.applyBtn);
     await browserActions.verifyTooltipContainsText('Job name is already in use', true);
-    await t.click(rdiInstancePage.PipelineManagementPanel.cancelJobNameBtn);
+    await t.click(rdiInstancePage.EditorButton.cancelBtn);
 
     await rdiInstancePage.PipelineManagementPanel.addJob(jobName2);
     let elementItem2 = await rdiInstancePage.PipelineManagementPanel.jobItem.count;
@@ -80,7 +79,7 @@ test('Verify that user can add, edit and delete job', async() => {
 
     await t.expect(rdiInstancePage.PipelineManagementPanel.jobsPipelineTitle.textContent).eql(jobName2);
 });
-test('Verify that user can add, edit and delete job', async() => {
+test('Verify that user can change job config', async() => {
     const jobName = 'testJob';
     const textForMonaco = 'here should be a job';
 
@@ -91,3 +90,30 @@ test('Verify that user can add, edit and delete job', async() => {
     text = await MonacoEditor.getTextFromMonaco();
     await t.expect(text).eql(textForMonaco, 'user can not enter a text');
 });
+test('Verify that user can open an additional editor to work with SQL and JMESPath expressions', async() => {
+    const jobName = 'testJob';
+    const sqlText = 'SELECT test FROM test1';
+
+    await rdiInstancePage.PipelineManagementPanel.addJob(jobName);
+    await t.click(rdiInstancePage.jobsInput);
+    // Verify that editor is not displayed by default
+    await t.expect(rdiInstancePage.draggableArea.exists).notOk('SQL/JMESPath editor is displayed by default');
+
+    await t.pressKey('shift+space');
+    // Verify that user can open an additional editor to work with SQL and JMESPath expressions
+    await t.expect(rdiInstancePage.draggableArea.exists).ok('SQL/JMESPath editor is not displayed');
+
+    // Verify that user can see SQL(set by default) and JMESPath editor options
+    await t.expect(rdiInstancePage.dedicatedLanguageSelect.textContent).eql('SQL', 'SQL is not set by default');
+
+    // Verify that user can close the additional editor
+    await MonacoEditor.sendTextToMonaco(rdiInstancePage.draggableArea, sqlText, false);
+    await t.click(rdiInstancePage.EditorButton.cancelBtn);
+    await t.expect(rdiInstancePage.draggableArea.exists).notOk('SQL/JMESPath editor is displayed after closing');
+    await t.expect(await MonacoEditor.getTextFromMonaco()).eql('', 'Text from canceled SQL editor applied');
+
+    await t.pressKey('shift+space');
+    await MonacoEditor.sendTextToMonaco(rdiInstancePage.draggableArea, sqlText, false);
+    await t.click(rdiInstancePage.EditorButton.applyBtn);
+    await t.expect(await MonacoEditor.getTextFromMonaco()).eql(sqlText, 'Text from SQL editor not applied');
+});

tests/e2e/tests/web/regression/database/edit-db.e2e.ts

@@ -38,7 +38,7 @@ test('Verify that user can edit DB alias of Standalone DB', async t => {
 
     await t.click(myRedisDatabasePage.editAliasButton);
     await t.typeText(myRedisDatabasePage.aliasInput, newDatabaseName, { replace: true });
-    await t.click(myRedisDatabasePage.applyButton);
+    await t.click(myRedisDatabasePage.EditorButton.applyBtn);
     await t.click(myRedisDatabasePage.submitChangesButton);
     // Verify that database has new alias
     await t.expect(myRedisDatabasePage.dbNameList.withExactText(newDatabaseName).exists).ok('The database with new alias is in not the list', { timeout: 10000 });

tests/e2e/tests/web/regression/triggers-and-functions/libraries.e2e.ts

@@ -100,14 +100,14 @@ test('Verify that user can modify  code', async t => {
     await t.click(await triggersAndFunctionsLibrariesPage.getLibraryNameSelector(libraryName));
     await t.click(triggersAndFunctionsLibrariesPage.editMonacoButton);
     await triggersAndFunctionsLibrariesPage.sendTextToMonaco(MonacoEditorInputs.Library, commandUpdatedPart1, commandUpdatedPart2);
-    await t.click(triggersAndFunctionsLibrariesPage.acceptButton);
+    await t.click(triggersAndFunctionsLibrariesPage.EditorButton.applyBtn);
     await t.expect(
         (await MonacoEditor.getTextFromMonaco())).eql(commandUpdatedPart1 + commandUpdatedPart2), 'code was not updated';
 
     await t.click(await triggersAndFunctionsLibrariesPage.configurationLink);
     await t.click(triggersAndFunctionsLibrariesPage.editMonacoButton);
     await triggersAndFunctionsLibrariesPage.sendTextToMonaco(MonacoEditorInputs.LibraryConfiguration, configuration);
-    await t.click(triggersAndFunctionsLibrariesPage.acceptButton);
+    await t.click(triggersAndFunctionsLibrariesPage.EditorButton.applyBtn);
     await t.expect(
         (await MonacoEditor.getTextFromMonaco())).eql(configuration, 'configuration was not added');
 });