Skip to content

Commit e2e6b11

Browse files
authored
Merge pull request #4111 from RedisInsight/e2e/feature/RI-6300_multiple-delimiters-in-tree-view
e2e/feature/RI-6300_multiple-delimiters-in-tree-view
2 parents 48420ba + ad3c9aa commit e2e6b11

File tree

6 files changed

+143
-32
lines changed

6 files changed

+143
-32
lines changed

tests/e2e/common-actions/browser-actions.ts

Lines changed: 7 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -88,9 +88,8 @@ export class BrowserActions {
8888
* @param folderName name of folder
8989
* @param delimiter string with delimiter value
9090
*/
91-
getNodeName(startFolder: string, folderName: string, delimiter: string): string {
92-
return startFolder + folderName + delimiter;
93-
91+
getNodeName(startFolder: string, folderName: string, delimiters: string[]): string {
92+
return `${startFolder}${folderName}${delimiters.join('|')}`;
9493
}
9594

9695
/**
@@ -106,9 +105,9 @@ export class BrowserActions {
106105
* @param folders name of folders for tree view build
107106
* @param delimiter string with delimiter value
108107
*/
109-
async checkTreeViewFoldersStructure(folders: string[][], delimiter: string): Promise<void> {
108+
async checkTreeViewFoldersStructure(folders: string[][], delimiters: string[]): Promise<void> {
110109
// Verify not patterned keys
111-
await this.verifyNotPatternedKeys(delimiter);
110+
await this.verifyNotPatternedKeys(delimiters[0]);
112111

113112
const foldersNumber = folders.length;
114113

@@ -117,7 +116,7 @@ export class BrowserActions {
117116
let prevNodeSelector = '';
118117

119118
for (let j = 0; j < innerFoldersNumber; j++) {
120-
const nodeName = this.getNodeName(prevNodeSelector, folders[i][j], delimiter);
119+
const nodeName = this.getNodeName(prevNodeSelector, folders[i][j], delimiters);
121120
const node = this.getNodeSelector(nodeName);
122121
const fullTestIdSelector = await node.getAttribute('data-testid');
123122
if (!fullTestIdSelector?.includes('expanded')) {
@@ -127,8 +126,8 @@ export class BrowserActions {
127126
}
128127

129128
// Verify that the last folder level contains required keys
130-
const foundKeyName = `${folders[i].join(delimiter)}`;
131-
const firstFolderName = this.getNodeName('', folders[i][0], delimiter);
129+
const foundKeyName = `${folders[i].join(delimiters.join('|'))}`;
130+
const firstFolderName = this.getNodeName('', folders[i][0], delimiters);
132131
const firstFolder = this.getNodeSelector(firstFolderName);
133132
await t
134133
.expect(Selector(`[data-testid*="node-item_${foundKeyName}"]`).find('[data-testid^="key-"]').exists).ok('Specific key not found')

tests/e2e/pageObjects/components/browser/tree-view.ts

Lines changed: 11 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,10 @@
11
import { Selector, t } from 'testcafe';
22
import { Common } from '../../../helpers/common';
3+
import { FiltersDialog } from '../../dialogs';
34

45
export class TreeView {
6+
FiltersDialog = new FiltersDialog();
7+
58
//-------------------------------------------------------------------------------------------
69
//DECLARATION OF SELECTORS
710
//*Declare all elements/components of the relevant page.
@@ -10,17 +13,10 @@ export class TreeView {
1013
//-------------------------------------------------------------------------------------------
1114
//BUTTONS
1215
treeViewSettingsBtn = Selector('[data-testid=tree-view-settings-btn]');
13-
treeViewDelimiterValueSave = Selector('[data-testid=tree-view-apply-btn]');
14-
treeViewDelimiterValueCancel = Selector('[data-testid=tree-view-cancel-btn]');
15-
sortingBtn = Selector('[data-testid=tree-view-sorting-select]');
16-
sortingASCoption = Selector('[id=ASC]');
17-
sortingDESCoption = Selector('[id=DESC]');
1816
sortingProgressBar = Selector('[data-testid=progress-key-tree]');
1917
// TEXT ELEMENTS
2018
treeViewKeysNumber = Selector('[data-testid^=count_]');
2119
treeViewDeviceFolder = Selector('[data-testid^=node-item_device] div');
22-
//INPUTS
23-
treeViewDelimiterInput = Selector('[data-testid=tree-view-delimiter-input]');
2420

2521
/**
2622
* Get folder selector by folder name
@@ -51,15 +47,16 @@ export class TreeView {
5147

5248
/**
5349
* Change delimiter value
54-
* @delimiter string with delimiter value
50+
* @param delimiter string with delimiter value
5551
*/
5652
async changeDelimiterInTreeView(delimiter: string): Promise<void> {
5753
// Open delimiter popup
5854
await t.click(this.treeViewSettingsBtn);
55+
await this.FiltersDialog.clearDelimiterCombobox();
5956
// Apply new value to the field
60-
await t.typeText(this.treeViewDelimiterInput, delimiter, { replace: true, paste: true });
57+
await this.FiltersDialog.addDelimiterItem(delimiter);
6158
// Click on save button
62-
await t.click(this.treeViewDelimiterValueSave);
59+
await t.click(this.FiltersDialog.treeViewDelimiterValueSave);
6360
}
6461

6562
/**
@@ -69,13 +66,13 @@ export class TreeView {
6966
async changeOrderingInTreeView(order: string): Promise<void> {
7067
// Open settings popup
7168
await t.click(this.treeViewSettingsBtn);
72-
await t.click(this.sortingBtn);
69+
await t.click(this.FiltersDialog.sortingBtn);
7370
order === 'ASC'
74-
? await t.click(this.sortingASCoption)
75-
: await t.click(this.sortingDESCoption);
71+
? await t.click(this.FiltersDialog.sortingASCoption)
72+
: await t.click(this.FiltersDialog.sortingDESCoption);
7673

7774
// Click on save button
78-
await t.click(this.treeViewDelimiterValueSave);
75+
await t.click(this.FiltersDialog.treeViewDelimiterValueSave);
7976
await Common.waitForElementNotVisible(this.sortingProgressBar);
8077
}
8178

Lines changed: 57 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,57 @@
1+
import { Selector, t } from 'testcafe';
2+
3+
export class FiltersDialog {
4+
// INPUTS
5+
delimiterCombobox = Selector('[data-testid=delimiter-combobox]');
6+
delimiterComboboxInput = Selector('[data-test-subj=comboBoxSearchInput]');
7+
// BUTTONS
8+
treeViewDelimiterValueCancel = Selector('[data-testid=tree-view-cancel-btn]');
9+
treeViewDelimiterValueSave = Selector('[data-testid=tree-view-apply-btn]');
10+
sortingBtn = Selector('[data-testid=tree-view-sorting-select]');
11+
sortingASCoption = Selector('[id=ASC]');
12+
sortingDESCoption = Selector('[id=DESC]');
13+
14+
/**
15+
* Get Delimiter badge selector by title
16+
* @param delimiterTitle title of the delimiter item
17+
*/
18+
getDelimiterBadgeByTitle(delimiterTitle: string): Selector {
19+
return this.delimiterCombobox.find(`span[title='${delimiterTitle}']`);
20+
}
21+
22+
/**
23+
* Get Delimiter close button selector by title
24+
* @param delimiterTitle title of the delimiter item
25+
*/
26+
getDelimiterCloseBtnByTitle(delimiterTitle: string): Selector {
27+
return this.getDelimiterBadgeByTitle(delimiterTitle).find('button');
28+
}
29+
30+
/**
31+
* Add new delimiter
32+
* @param delimiterName name of the delimiter item
33+
*/
34+
async addDelimiterItem(delimiterName: string): Promise<void> {
35+
await t.click(this.delimiterComboboxInput);
36+
await t.typeText(this.delimiterComboboxInput, delimiterName, { paste: true })
37+
}
38+
39+
/**
40+
* Delete existing delimiter
41+
* @param delimiterName name of the delimiter item
42+
*/
43+
async removeDelimiterItem(delimiterName: string): Promise<void> {
44+
await t.click(this.getDelimiterCloseBtnByTitle(delimiterName));
45+
}
46+
47+
/**
48+
* Remove all existing delimiters in combobox
49+
*/
50+
async clearDelimiterCombobox(): Promise<void> {
51+
const delimiters = this.delimiterCombobox.find('button');
52+
const count = await delimiters.count;
53+
for (let i = 0; i < count; i++) {
54+
await t.click(delimiters.nth(i));
55+
}
56+
}
57+
}
Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,9 @@
11
import { OnboardingCardsDialog } from './onboarding-cards-dialog';
2+
import { FiltersDialog } from './filters-dialog';
23
import { UserAgreementDialog } from './user-agreement-dialog';
34

45
export {
56
OnboardingCardsDialog,
7+
FiltersDialog,
68
UserAgreementDialog
79
};
Lines changed: 65 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,41 +1,97 @@
11
import { BrowserPage } from '../../../../pageObjects';
2-
import { commonUrl, ossStandaloneBigConfig } from '../../../../helpers/conf';
2+
import { commonUrl, ossStandaloneBigConfig, ossStandaloneV8Config } from '../../../../helpers/conf';
33
import { rte } from '../../../../helpers/constants';
44
import { DatabaseHelper } from '../../../../helpers/database';
55
import { DatabaseAPIRequests } from '../../../../helpers/api/api-database';
66
import { BrowserActions } from '../../../../common-actions/browser-actions';
7+
import { APIKeyRequests } from '../../../../helpers/api/api-keys';
8+
import { HashKeyParameters } from '../../../../pageObjects/browser-page';
79

810
const browserPage = new BrowserPage();
911
const browserActions = new BrowserActions();
1012
const databaseHelper = new DatabaseHelper();
1113
const databaseAPIRequests = new DatabaseAPIRequests();
14+
const apiKeyRequests = new APIKeyRequests();
15+
16+
let keyNames: string[];
1217

1318
fixture `Delimiter tests`
1419
.meta({ type: 'critical_path', rte: rte.standalone })
1520
.page(commonUrl)
16-
.beforeEach(async() => {
21+
.beforeEach(async () => {
1722
await databaseHelper.acceptLicenseTermsAndAddDatabaseApi(ossStandaloneBigConfig);
1823
})
19-
.afterEach(async() => {
24+
.afterEach(async () => {
2025
await databaseAPIRequests.deleteStandaloneDatabaseApi(ossStandaloneBigConfig);
2126
});
2227
test('Verify that user can see that input is not saved when the Cancel button is clicked', async t => {
2328
// Switch to tree view
2429
await t.click(browserPage.treeViewButton);
2530
await t.click(browserPage.TreeView.treeViewSettingsBtn);
2631
// Check the default delimiter value
27-
await t.expect(browserPage.TreeView.treeViewDelimiterInput.value).eql(':', 'Default delimiter not applied');
32+
await t.expect(browserPage.TreeView.FiltersDialog.getDelimiterBadgeByTitle(':').exists).eql(true, 'Default delimiter not applied');
2833
// Apply new value to the field
29-
await t.typeText(browserPage.TreeView.treeViewDelimiterInput, 'test', { replace: true });
34+
await browserPage.TreeView.FiltersDialog.removeDelimiterItem(':');
35+
await browserPage.TreeView.FiltersDialog.addDelimiterItem('test');
3036
// Click on Cancel button
31-
await t.click(browserPage.TreeView.treeViewDelimiterValueCancel);
37+
await t.click(browserPage.TreeView.FiltersDialog.treeViewDelimiterValueCancel);
3238
// Check the previous delimiter value
3339
await t.click(browserPage.TreeView.treeViewSettingsBtn);
34-
await t.expect(browserPage.TreeView.treeViewDelimiterInput.value).eql(':', 'Previous delimiter not applied');
35-
await t.click(browserPage.TreeView.treeViewDelimiterValueCancel);
40+
await t.expect(browserPage.TreeView.FiltersDialog.getDelimiterBadgeByTitle(':').exists).eql(true, 'Previous delimiter not applied');
41+
await t.expect(browserPage.TreeView.FiltersDialog.getDelimiterBadgeByTitle('test').exists).eql(false, 'Previous delimiter not applied');
42+
await t.click(browserPage.TreeView.FiltersDialog.treeViewDelimiterValueCancel);
3643

3744
// Change delimiter
3845
await browserPage.TreeView.changeDelimiterInTreeView('-');
3946
// Verify that when user changes the delimiter and clicks on Save button delimiter is applied
40-
await browserActions.checkTreeViewFoldersStructure([['device_us', 'west'], ['mobile_eu', 'central'], ['mobile_us', 'east'], ['user_us', 'west'], ['device_eu', 'central'], ['user_eu', 'central']], '-');
47+
await browserActions.checkTreeViewFoldersStructure([['device_us', 'west'], ['mobile_eu', 'central'], ['mobile_us', 'east'], ['user_us', 'west'], ['device_eu', 'central'], ['user_eu', 'central']], ['-']);
4148
});
49+
test
50+
.before(async () => {
51+
await databaseHelper.acceptLicenseTermsAndAddDatabaseApi(ossStandaloneV8Config);
52+
keyNames = [
53+
`device:common-dev`,
54+
`device:common-stage`,
55+
`device:common1-stage`,
56+
`mobile:common-dev`,
57+
`mobile:common-stage`
58+
];
59+
for (const keyName of keyNames) {
60+
let hashKeyParameters: HashKeyParameters = {
61+
keyName: keyName,
62+
fields: [
63+
{
64+
field: 'field',
65+
value: 'value',
66+
},
67+
],
68+
}
69+
await apiKeyRequests.addHashKeyApi(
70+
hashKeyParameters,
71+
ossStandaloneV8Config,
72+
)
73+
}
74+
await browserPage.reloadPage();
75+
})
76+
.after(async () => {
77+
for (const keyName of keyNames) {
78+
await apiKeyRequests.deleteKeyByNameApi(keyName, ossStandaloneV8Config.databaseName);
79+
}
80+
await databaseAPIRequests.deleteStandaloneDatabaseApi(ossStandaloneV8Config);
81+
})('Verify that user can set multiple delimiters in the tree view', async t => {
82+
// Switch to tree view
83+
await t.click(browserPage.treeViewButton);
84+
// Verify folders ordering with default delimiter
85+
await browserActions.checkTreeViewFoldersStructure([['device'], ['mobile']], [':']);
86+
await t.click(browserPage.TreeView.treeViewSettingsBtn);
87+
// Apply new value to the field
88+
await browserPage.TreeView.FiltersDialog.addDelimiterItem('-');
89+
await t.click(browserPage.TreeView.FiltersDialog.treeViewDelimiterValueSave);
90+
// Verify that when user changes the delimiter and clicks on Save button delimiter is applied
91+
await browserActions.checkTreeViewFoldersStructure([['device', 'common'], ['device', 'common1'], ['mobile', 'common']], [':', '-']);
92+
93+
// Verify that namespace names tooltip contains valid names and delimiter
94+
await t.click(browserActions.getNodeSelector('device'));
95+
await t.hover(browserActions.getNodeSelector('device:|-common:|-'));
96+
await browserActions.verifyTooltipContainsText('device:common-stage-*', true);
97+
});

tests/e2e/tests/web/regression/tree-view/tree-view.e2e.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -133,7 +133,7 @@ test('Verify that when user deletes the key he can see the key is removed from t
133133
await t.click(browserPage.treeViewButton);
134134
// Verify the default separator
135135
await t.click(browserPage.TreeView.treeViewSettingsBtn);
136-
await t.expect(browserPage.TreeView.treeViewDelimiterInput.value).eql(':', 'The “:” (colon) not used as a default separator for namespaces');
136+
await t.expect(browserPage.TreeView.FiltersDialog.getDelimiterBadgeByTitle(':').exists).eql(true, 'The “:” (colon) not used as a default separator for namespaces');
137137
// Verify that user can see that “:” (colon) used as a default separator for namespaces and see the number of keys found per each namespace
138138
await t.expect(browserPage.TreeView.treeViewKeysNumber.visible).ok('The user can not see the number of keys');
139139

0 commit comments

Comments
 (0)