Merge pull request #1141 from RedisInsight/e2e/feature/pickle-formatter

vlad-dargel · web-flow · commit d8596df3b26c · 2022-09-11T15:07:00.000+02:00
e2e/feature/pickle-formatter
diff --git a/tests/e2e/pageObjects/browser-page.ts b/tests/e2e/pageObjects/browser-page.ts
@@ -114,7 +114,7 @@ export class BrowserPage {
     claimTimeOptionSelect = Selector('[data-testid=time-option-select]');
     relativeTimeOption = Selector('#idle');
     timestampOption = Selector('#time');
-    formatSwitcher = Selector('[data-testid=select-format-key-value]');
+    formatSwitcher = Selector('[data-testid=select-format-key-value]', { timeout: 2000 });
     formatSwitcherIcon = Selector('img[data-testid^=key-value-formatter-option-selected]');
     //TABS
     streamTabGroups = Selector('[data-testid=stream-tab-Groups]');
diff --git a/tests/e2e/test-data/formatters-data.ts b/tests/e2e/test-data/formatters-data.ts
@@ -5,23 +5,27 @@ export const formatters = [{
     format: 'JSON',
     fromText: '{ "field": "value" }',
     fromTextEdit: '{ "field": "value123" }'
-}, {
+},
+{
     format: 'Msgpack',
     fromHexText: 'DF00000001A56669656C64A576616C7565',
     fromText: '{ "field": "value" }',
     fromTextEdit: '{ "field": "value123" }',
     formattedText: '{ "field": "value" }'
-}, {
+},
+{
     format: 'Protobuf',
     fromHexText: '08d90f10d802',
     formattedText: '[ { "1": 2009 }, { "2": 344 } ]'
-}, {
-    format: 'PHP Unserialize',
+},
+{
+    format: 'PHP serialized',
     fromText: 'a:2:{i:0;s:12:"Sample array";i:1;a:2:{i:0;s:5:"Apple";i:1;s:6:"Orange";}}',
     fromTextEdit: '[ "Sample array", [ "Apple", "Orange15" ] ]',
     formattedText: '[ "Sample array", [ "Apple", "Orange" ] ]'
-}, {
-    format: 'Java Object',
+},
+{
+    format: 'Java serialized',
     fromHexText: 'aced000573720008456d706c6f796565025e743467c6123c0200034900066e756d6265724c0007616464726573737400124c6a6176612f6c616e672f537472696e673b4c00046e616d6571007e000178700000006574001950686f6b6b61204b75616e2c20416d62656874612050656572740009526579616e20416c69',
     formattedText: '{ "fields": [ { "number": 101 }, { "address": "Phokka Kuan, Ambehta Peer" }, { "name": "Reyan Ali" } ], "annotations": [], "className": "Employee", "serialVersionUid": "170701604314812988" }'
 },
@@ -45,10 +49,15 @@ export const formatters = [{
     fromTextEdit: '水山 рус bin 子',
     formattedText: '1110011010110000101101000010000011010001100000001101000110000011110100011000000100100000011000100110100101101110',
     formattedTextEdit: '111001101011000010110100111001011011000110110001001000001101000110000000110100011000001111010001100000010010000001100010011010010110111000100000111001011010110110010000'
+},
+{
+    format: 'Pickle',
+    fromHexText: '286470300a5327617272270a70310a286c70320a49310a6149320a617353276f626a270a70330a286470340a532761270a70350a532762270a70360a7373532748656c6c6f270a70370a5327776f726c64270a70380a732e',
+    formattedText: '{ "arr": [ 1, 2 ], "obj": { "a": "b" }, "Hello": "world" }'
 }];
 
 /**
- * PHP data for convertion including different php unserialize data types
+ * PHP data for convertion including different php serialized data types
  */
 export const phpData = [{
     dataType: 'Object',
diff --git a/tests/e2e/tests/critical-path/browser/formatters.e2e.ts b/tests/e2e/tests/critical-path/browser/formatters.e2e.ts
@@ -15,10 +15,11 @@ const keysData = keyTypes.map(object => ({ ...object })).filter((v, i) => i <= 6
 keysData.forEach(key => key.keyName = `${key.keyName}` + '-' + `${common.generateWord(keyLength)}`);
 const binaryFormattersSet = [formatters[5], formatters[6], formatters[7]];
 const formattersHighlightedSet = [formatters[0], formatters[3]];
-const fromBinaryFormattersSet = [formatters[1], formatters[2], formatters[4]];
+const fromBinaryFormattersSet = [formatters[1], formatters[2], formatters[4], formatters[8]];
 const formattersForEditSet = [formatters[0], formatters[1], formatters[3]];
-const formattersWithTooltipSet = [formatters[0], formatters[1], formatters[2], formatters[3], formatters[4]];
-const notEditableFormattersSet = [formatters[2], formatters[4]];
+const formattersWithTooltipSet = [formatters[0], formatters[1], formatters[2], formatters[3], formatters[4], formatters[8]];
+const notEditableFormattersSet = [formatters[2], formatters[4], formatters[8]];
+const defaultFormatter = 'Unicode';
 
 fixture `Formatters`
     .meta({
@@ -43,21 +44,22 @@ formattersHighlightedSet.forEach(formatter => {
             // Create new keys
             await addKeysViaCli(keysData, formatter.fromText, formatter.fromText);
         })(`Verify that user can see highlighted key details in ${formatter.format} format`, async t => {
-            // Verify for JSON and PHP Unserialize
+            // Verify for JSON and PHP serialized
             // Verify for Hash, List, Set, ZSet, String, Stream keys
             for (const key of keysData) {
                 const valueSelector = Selector(`[data-testid^=${key.keyName.split('-')[0]}-][data-testid*=${key.data}]`);
                 await browserPage.openKeyDetailsByKeyName(key.keyName);
                 // Verify that value not formatted with default formatter
+                await browserPage.selectFormatter(defaultFormatter);
                 await t.expect(valueSelector.find(browserPage.cssJsonValue).exists).notOk(`${key.textType} Value is formatted to ${formatter.format}`);
                 await browserPage.selectFormatter(formatter.format);
                 // Verify that value is formatted and highlighted
                 await t.expect(valueSelector.find(browserPage.cssJsonValue).exists).ok(`${key.textType} Value is not formatted to ${formatter.format}`);
-                // Verify that Hash field is formatted and highlighted for JSON and PHP Unserialize
+                // Verify that Hash field is formatted and highlighted for JSON and PHP serialized
                 if (key.keyName === 'hash') {
                     await t.expect(browserPage.hashField.find(browserPage.cssJsonValue).exists).ok(`Hash field is not formatted to ${formatter.format}`);
                 }
-                // Verify that Stream field is formatted and highlighted for JSON and PHP Unserialize
+                // Verify that Stream field is formatted and highlighted for JSON and PHP serialized
                 if (key.keyName === 'stream') {
                     await t.expect(Selector(browserPage.cssJsonValue).count).eql(2, `Hash field is not formatted to ${formatter.format}`);
                 }
@@ -66,7 +68,7 @@ formattersHighlightedSet.forEach(formatter => {
 });
 fromBinaryFormattersSet.forEach(formatter => {
     test(`Verify that user can see highlighted key details in ${formatter.format} format`, async t => {
-        // Verify for Msgpack, Protobuf, Java Object formats
+        // Verify for Msgpack, Protobuf, Java serialized, Pickle formats
         // Open Hash key details
         await browserPage.openKeyDetailsByKeyName(keysData[0].keyName);
         // Add valid value in HEX format for convertion
@@ -81,7 +83,7 @@ fromBinaryFormattersSet.forEach(formatter => {
 });
 formattersForEditSet.forEach(formatter => {
     test(`Verify that user can edit the values in the key regardless if they are valid in ${formatter.format} format or not`, async t => {
-        // Verify for JSON, Msgpack, PHP unserialise formatters
+        // Verify for JSON, Msgpack, PHP serialized formatters
         const invalidText = 'invalid text';
         // Open key details and select formatter
         await browserPage.openKeyDetails(keysData[0].keyName);
@@ -92,7 +94,7 @@ formattersForEditSet.forEach(formatter => {
         // Add valid value which can be converted
         await browserPage.editHashKeyValue(formatter.fromText ?? '');
         // Verify that valid value can be saved on edit
-        formatter.format === 'PHP Unserialize'
+        formatter.format === 'PHP serialized'
             ? await t.expect(browserPage.hashFieldValue.innerText).contains(formatter.formattedText ?? '', `Valid ${formatter.format} value is not saved`)
             : await t.expect(browserPage.hashFieldValue.innerText).contains(formatter.fromText ?? '', `Valid ${formatter.format} value is not saved`);
         await t.expect(browserPage.hashFieldValue.find(browserPage.cssJsonValue).exists).ok(`Value is not formatted to ${formatter.format}`);
@@ -104,7 +106,7 @@ formattersForEditSet.forEach(formatter => {
 });
 formattersWithTooltipSet.forEach(formatter => {
     test(`Verify that user can see tooltip with convertion failed message on hover when data is not valid ${formatter.format}`, async t => {
-        // Verify for JSON, Msgpack, Protobuf, PHP unserialise, Java serialized object formatters
+        // Verify for JSON, Msgpack, Protobuf, PHP serialized, Java serialized object, Pickle formatters
         const failedMessage = `Failed to convert to ${formatter.format}`;
         for (let i = 0; i < keysData.length; i++) {
             const valueSelector = Selector(`[data-testid^=${keysData[i].keyName.split('-')[0]}-][data-testid*=${keysData[i].data}]`);
@@ -132,6 +134,7 @@ binaryFormattersSet.forEach(formatter => {
                 const valueSelector = Selector(`[data-testid^=${keysData[i].keyName.split('-')[0]}-][data-testid*=${keysData[i].data}]`);
                 await browserPage.openKeyDetailsByKeyName(keysData[i].keyName);
                 // Verify that value not formatted with default formatter
+                await browserPage.selectFormatter(defaultFormatter);
                 await t.expect(valueSelector.innerText).contains(formatter.fromText ?? '', `Value is formatted as ${formatter.format} in Unicode`);
                 await browserPage.selectFormatter(formatter.format);
                 // Verify that value is formatted
@@ -163,7 +166,7 @@ binaryFormattersSet.forEach(formatter => {
         await t.expect(browserPage.hashFieldValue.innerText).contains(formatter.fromTextEdit ?? '', `${formatter.format} value is not converted to Unicode`);
     });
 });
-test('Verify that user can format different data types of PHP unserialize', async t => {
+test('Verify that user can format different data types of PHP serialized', async t => {
     // Open Hash key details
     await browserPage.openKeyDetailsByKeyName(keysData[0].keyName);
     for (const type of phpData) {
@@ -172,15 +175,15 @@ test('Verify that user can format different data types of PHP unserialize', asyn
         await browserPage.addFieldToHash(type.dataType, type.from);
         //Search the added field
         await browserPage.searchByTheValueInKeyDetails(type.dataType);
-        await browserPage.selectFormatter('PHP Unserialize');
-        // Verify that PHP Unserialize value is formatted and highlighted
+        await browserPage.selectFormatter('PHP serialized');
+        // Verify that PHP serialized value is formatted and highlighted
         await t.expect(browserPage.hashFieldValue.innerText).contains(type.converted, `Value is not saved as PHP ${type.dataType}`);
         await t.expect(browserPage.hashFieldValue.find(browserPage.cssJsonValue).exists).ok(`Value is not formatted to PHP ${type.dataType}`);
     }
 });
 notEditableFormattersSet.forEach(formatter => {
     test(`Verify that user see edit icon disabled for all keys when ${formatter.format} selected`, async t => {
-        // Verify for Protobuf and Java Object
+        // Verify for Protobuf, Java serialized, Pickle
         // Verify for Hash, List, ZSet, String keys
         for (const key of keysData) {
             if (key.keyName === 'hash' || key.keyName === 'list' || key.keyName === 'zset' || key.keyName === 'string') {
diff --git a/tests/e2e/tests/regression/browser/format-switcher.e2e.ts b/tests/e2e/tests/regression/browser/format-switcher.e2e.ts
@@ -1,17 +1,21 @@
 import { keyLength, rte } from '../../../helpers/constants';
 import { addKeysViaCli, deleteKeysViaCli, keyTypes } from '../../../helpers/keys';
-import { acceptLicenseTermsAndAddDatabaseApi } from '../../../helpers/database';
-import { BrowserPage } from '../../../pageObjects';
+import { acceptLicenseTerms, acceptLicenseTermsAndAddDatabaseApi } from '../../../helpers/database';
+import { BrowserPage, MyRedisDatabasePage } from '../../../pageObjects';
 import { commonUrl, ossStandaloneConfig } from '../../../helpers/conf';
-import { deleteStandaloneDatabaseApi } from '../../../helpers/api/api-database';
+import { addNewStandaloneDatabasesApi, deleteStandaloneDatabaseApi, deleteStandaloneDatabasesApi } from '../../../helpers/api/api-database';
 import { Common } from '../../../helpers/common';
 
 const browserPage = new BrowserPage();
 const common = new Common();
+const myRedisDatabasePage = new MyRedisDatabasePage();
 
 const keysData = keyTypes.map(object => ({ ...object }));
 keysData.forEach(key => key.keyName = `${key.keyName}` + '-' + `${common.generateWord(keyLength)}`);
-const defaultValue = 'Unicode';
+const databasesForAdding = [
+    { host: ossStandaloneConfig.host, port: ossStandaloneConfig.port, databaseName: 'testDB1' },
+    { host: ossStandaloneConfig.host, port: ossStandaloneConfig.port, databaseName: 'testDB2' }
+];
 
 fixture `Format switcher functionality`
     .meta({
@@ -29,26 +33,41 @@ fixture `Format switcher functionality`
         await deleteKeysViaCli(keysData);
         await deleteStandaloneDatabaseApi(ossStandaloneConfig);
     });
-test('Verify that user can see switcher changed to default for key when reopening key details', async t => {
-    // Open key details and select JSON formatter
-    await browserPage.openKeyDetails(keysData[0].keyName);
-    await browserPage.selectFormatter('JSON');
-    // Reopen key details
-    await t.click(browserPage.closeKeyButton);
-    await browserPage.openKeyDetailsByKeyName(keysData[0].keyName);
-    // Verify that formatter changed to default 'Unicode'
-    await t.expect(browserPage.formatSwitcher.withExactText(defaultValue).visible).ok('Formatter value is not default');
-});
-test('Verify that user can see switcher changed to default for key when switching between keys when details tab opened', async t => {
-    // Open key details and select HEX formatter
-    await t.click(browserPage.searchButton);
-    await browserPage.openKeyDetailsByKeyName(keysData[1].keyName);
-    await browserPage.selectFormatter('HEX');
-    // Open another key details
-    await browserPage.openKeyDetailsByKeyName(keysData[3].keyName);
-    // Verify that formatter changed to default 'Unicode'
-    await t.expect(browserPage.formatSwitcher.withExactText(defaultValue).visible).ok('Formatter value is not default');
-});
+test
+    .before(async() => {
+        // Add new databases using API
+        await acceptLicenseTerms();
+        await addNewStandaloneDatabasesApi(databasesForAdding);
+        // Reload Page
+        await common.reloadPage();
+        await myRedisDatabasePage.clickOnDBByName(databasesForAdding[0].databaseName);
+        // Create new keys
+        await addKeysViaCli(keysData);
+    })
+    .after(async() => {
+        // Clear keys and database
+        await deleteKeysViaCli(keysData);
+        await deleteStandaloneDatabasesApi(databasesForAdding);
+    })('Formatters saved selection', async t => {
+        // Open key details and select JSON formatter
+        await browserPage.openKeyDetails(keysData[0].keyName);
+        await browserPage.selectFormatter('JSON');
+        // Reopen key details
+        await t.click(browserPage.closeKeyButton);
+        await browserPage.openKeyDetailsByKeyName(keysData[0].keyName);
+        // Verify that formatters selection is saved when user switches between keys
+        await t.expect(browserPage.formatSwitcher.withExactText('JSON').visible).ok('Formatter value is not saved');
+        // Verify that formatters selection is saved when user reloads the page
+        await common.reloadPage();
+        await browserPage.openKeyDetailsByKeyName(keysData[1].keyName);
+        await t.expect(browserPage.formatSwitcher.withExactText('JSON').visible).ok('Formatter value is not saved');
+        // Go to another database
+        await t.click(myRedisDatabasePage.myRedisDBButton);
+        await myRedisDatabasePage.clickOnDBByName(databasesForAdding[1].databaseName);
+        await browserPage.openKeyDetailsByKeyName(keysData[2].keyName);
+        // Verify that formatters selection is saved when user switches between databases
+        await t.expect(browserPage.formatSwitcher.withExactText('JSON').visible).ok('Formatter value is not saved');
+    });
 test('Verify that user don`t see format switcher for JSON, GRAPH, TS keys', async t => {
     // Create array with JSON, GRAPH, TS keys
     const keysWithoutSwitcher = [keysData[5], keysData[7], keysData[8]];
