From 10df7b46ff597a511021a59dfd5871cc99e1f7f2 Mon Sep 17 00:00:00 2001 From: Amir Allayarov Date: Thu, 16 Nov 2023 13:04:55 +0400 Subject: [PATCH 01/14] #RI-5131-5170 - update tree view --- redisinsight/ui/src/pages/browser/BrowserPage.tsx | 2 +- .../ui/src/pages/browser/components/key-tree/KeyTree.tsx | 2 +- .../src/pages/browser/components/virtual-tree/VirtualTree.tsx | 4 ++++ .../browser/components/virtual-tree/components/Node/Node.tsx | 2 +- 4 files changed, 7 insertions(+), 3 deletions(-) diff --git a/redisinsight/ui/src/pages/browser/BrowserPage.tsx b/redisinsight/ui/src/pages/browser/BrowserPage.tsx index a05f8097f5..f87e868291 100644 --- a/redisinsight/ui/src/pages/browser/BrowserPage.tsx +++ b/redisinsight/ui/src/pages/browser/BrowserPage.tsx @@ -190,7 +190,7 @@ const BrowserPage = () => { } const selectKey = ({ rowData }: { rowData: any }) => { - if (!isEqualBuffers(rowData.name, selectedKey)) { + if (!isEqualBuffers(rowData.name, selectedKeyRef.current)) { dispatch(toggleBrowserFullScreen(false)) dispatch(setInitialStateByType(prevSelectedType.current)) diff --git a/redisinsight/ui/src/pages/browser/components/key-tree/KeyTree.tsx b/redisinsight/ui/src/pages/browser/components/key-tree/KeyTree.tsx index 9e9d2d10d7..76a1552393 100644 --- a/redisinsight/ui/src/pages/browser/components/key-tree/KeyTree.tsx +++ b/redisinsight/ui/src/pages/browser/components/key-tree/KeyTree.tsx @@ -126,7 +126,7 @@ const KeyTree = forwardRef((props: Props, ref) => { openSelectedKey(selectedKeyName) } - const handleStatusOpen = (name: string, value:boolean) => { + const handleStatusOpen = (name: string, value: boolean) => { setStatusOpen((prevState) => { const newState = { ...prevState } // add or remove opened node diff --git a/redisinsight/ui/src/pages/browser/components/virtual-tree/VirtualTree.tsx b/redisinsight/ui/src/pages/browser/components/virtual-tree/VirtualTree.tsx index 552873d9b2..a0d073b977 100644 --- a/redisinsight/ui/src/pages/browser/components/virtual-tree/VirtualTree.tsx +++ b/redisinsight/ui/src/pages/browser/components/virtual-tree/VirtualTree.tsx @@ -94,6 +94,10 @@ const VirtualTree = (props: Props) => { nodes.current = result rerender({}) setConstructingTree?.(false) + + if (nodes?.current?.length === 1) { + onStatusOpen?.(nodes.current[0].fullName, true) + } }, [result]) useEffect(() => { diff --git a/redisinsight/ui/src/pages/browser/components/virtual-tree/components/Node/Node.tsx b/redisinsight/ui/src/pages/browser/components/virtual-tree/components/Node/Node.tsx index 8739c9c7a8..1bc3f02205 100644 --- a/redisinsight/ui/src/pages/browser/components/virtual-tree/components/Node/Node.tsx +++ b/redisinsight/ui/src/pages/browser/components/virtual-tree/components/Node/Node.tsx @@ -66,7 +66,7 @@ const Node = ({ }, []) const handleClick = () => { - if (isLeaf && !isSelected) { + if (isLeaf) { updateStatusSelected?.(nameBuffer) } From 78ba705c16f45a62941e4f1341d0379c72be5928 Mon Sep 17 00:00:00 2001 From: Amir Allayarov Date: Thu, 16 Nov 2023 13:34:30 +0400 Subject: [PATCH 02/14] #RI-5131 - add tests --- .../virtual-tree/VirtualTree.spec.tsx | 54 ++++++++++++++++++- 1 file changed, 53 insertions(+), 1 deletion(-) diff --git a/redisinsight/ui/src/pages/browser/components/virtual-tree/VirtualTree.spec.tsx b/redisinsight/ui/src/pages/browser/components/virtual-tree/VirtualTree.spec.tsx index b869123dd7..79443ca613 100644 --- a/redisinsight/ui/src/pages/browser/components/virtual-tree/VirtualTree.spec.tsx +++ b/redisinsight/ui/src/pages/browser/components/virtual-tree/VirtualTree.spec.tsx @@ -2,6 +2,7 @@ import React from 'react' import { mock, instance } from 'ts-mockito' import { render } from 'uiSrc/utils/test-utils' +import { useDisposableWebworker } from 'uiSrc/services' import VirtualTree, { Props } from './VirtualTree' const mockedProps = mock() @@ -39,9 +40,26 @@ export const mockVirtualTreeResult = [{ name: 'test', }] +export const mockVirtualTreeResult1 = [{ + children: [{ + children: [], + fullName: 'car:110:', + id: '0.snc1rc3zwgo', + keyApproximate: 0.01, + keyCount: 1, + name: '110', + }], + fullName: 'car:', + id: '0.sz1ie1koqi8', + keyApproximate: 47.18, + keyCount: 4718, + name: 'car', +}] + jest.mock('uiSrc/services', () => ({ ...jest.requireActual('uiSrc/services'), - useDisposableWebworker: () => ({ result: mockVirtualTreeResult, run: jest.fn() }), + useDisposableWebworker: jest.fn(() => ({ result: mockVirtualTreeResult, run: jest.fn() })) + // useDisposableWebworker: () => ({ result: mockVirtualTreeResult, run: jest.fn() }), })) describe('VirtualTree', () => { @@ -74,4 +92,38 @@ describe('VirtualTree', () => { expect(queryByTestId('node-item_test')).toBeInTheDocument() }) + + it('should call onStatusOpen if only one folder is exist', () => { + (useDisposableWebworker as jest.Mock).mockReturnValueOnce({ + result: mockVirtualTreeResult1, + run: jest.fn() + }) + const mockFn = jest.fn() + const mockOnStatusOpen = jest.fn() + + render( + + ) + + expect(mockOnStatusOpen).toBeCalledWith('car:', true) + }) + + it('should not call onStatusOpen if more then one folder is exist', () => { + const mockFn = jest.fn() + const mockOnStatusOpen = jest.fn() + + render( + + ) + + expect(mockOnStatusOpen).not.toHaveBeenCalled() + }) }) From ca51be757cf8df7cfce4c30973a117098dd02dae Mon Sep 17 00:00:00 2001 From: Amir Allayarov Date: Thu, 16 Nov 2023 13:35:20 +0400 Subject: [PATCH 03/14] #RI-5131 - remove unused code --- .../pages/browser/components/virtual-tree/VirtualTree.spec.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/redisinsight/ui/src/pages/browser/components/virtual-tree/VirtualTree.spec.tsx b/redisinsight/ui/src/pages/browser/components/virtual-tree/VirtualTree.spec.tsx index 79443ca613..90fe19ce50 100644 --- a/redisinsight/ui/src/pages/browser/components/virtual-tree/VirtualTree.spec.tsx +++ b/redisinsight/ui/src/pages/browser/components/virtual-tree/VirtualTree.spec.tsx @@ -59,7 +59,6 @@ export const mockVirtualTreeResult1 = [{ jest.mock('uiSrc/services', () => ({ ...jest.requireActual('uiSrc/services'), useDisposableWebworker: jest.fn(() => ({ result: mockVirtualTreeResult, run: jest.fn() })) - // useDisposableWebworker: () => ({ result: mockVirtualTreeResult, run: jest.fn() }), })) describe('VirtualTree', () => { From c5c8633eb2ead0cec0f56ce7d36760c55015dbf8 Mon Sep 17 00:00:00 2001 From: Amir Allayarov Date: Thu, 16 Nov 2023 15:06:03 +0400 Subject: [PATCH 04/14] #RI-5131 - fix test --- .../virtual-tree/VirtualTree.spec.tsx | 28 ++++++------------- 1 file changed, 8 insertions(+), 20 deletions(-) diff --git a/redisinsight/ui/src/pages/browser/components/virtual-tree/VirtualTree.spec.tsx b/redisinsight/ui/src/pages/browser/components/virtual-tree/VirtualTree.spec.tsx index 90fe19ce50..5610b52c84 100644 --- a/redisinsight/ui/src/pages/browser/components/virtual-tree/VirtualTree.spec.tsx +++ b/redisinsight/ui/src/pages/browser/components/virtual-tree/VirtualTree.spec.tsx @@ -16,7 +16,7 @@ const mockedItems = [ }, ] -export const mockVirtualTreeResult = [{ +const mockTreeItem = { children: [{ children: [], fullName: 'car:110:', @@ -30,34 +30,22 @@ export const mockVirtualTreeResult = [{ keyApproximate: 47.18, keyCount: 4718, name: 'car', -}, -{ +} + +const mockTreeItem2 = { children: [], fullName: 'test', id: '0.snc1rc3zwg1o', keyApproximate: 0.01, keyCount: 1, name: 'test', -}] +} -export const mockVirtualTreeResult1 = [{ - children: [{ - children: [], - fullName: 'car:110:', - id: '0.snc1rc3zwgo', - keyApproximate: 0.01, - keyCount: 1, - name: '110', - }], - fullName: 'car:', - id: '0.sz1ie1koqi8', - keyApproximate: 47.18, - keyCount: 4718, - name: 'car', -}] +export const mockVirtualTreeResult = [mockTreeItem, mockTreeItem2] jest.mock('uiSrc/services', () => ({ ...jest.requireActual('uiSrc/services'), + __esModule: true, useDisposableWebworker: jest.fn(() => ({ result: mockVirtualTreeResult, run: jest.fn() })) })) @@ -94,7 +82,7 @@ describe('VirtualTree', () => { it('should call onStatusOpen if only one folder is exist', () => { (useDisposableWebworker as jest.Mock).mockReturnValueOnce({ - result: mockVirtualTreeResult1, + result: [mockTreeItem], run: jest.fn() }) const mockFn = jest.fn() From 9a3ac4a52cf24ec18fbab866d34cda3be54734c6 Mon Sep 17 00:00:00 2001 From: Amir Allayarov Date: Thu, 16 Nov 2023 15:47:57 +0400 Subject: [PATCH 05/14] #RI-5131 - fix circleci test --- .../browser/components/virtual-tree/VirtualTree.spec.tsx | 9 ++++++--- 1 file changed, 6 insertions(+), 3 deletions(-) diff --git a/redisinsight/ui/src/pages/browser/components/virtual-tree/VirtualTree.spec.tsx b/redisinsight/ui/src/pages/browser/components/virtual-tree/VirtualTree.spec.tsx index 5610b52c84..9726ccb8a3 100644 --- a/redisinsight/ui/src/pages/browser/components/virtual-tree/VirtualTree.spec.tsx +++ b/redisinsight/ui/src/pages/browser/components/virtual-tree/VirtualTree.spec.tsx @@ -45,8 +45,7 @@ export const mockVirtualTreeResult = [mockTreeItem, mockTreeItem2] jest.mock('uiSrc/services', () => ({ ...jest.requireActual('uiSrc/services'), - __esModule: true, - useDisposableWebworker: jest.fn(() => ({ result: mockVirtualTreeResult, run: jest.fn() })) + useDisposableWebworker: jest.fn().mockReturnValue({ result: mockVirtualTreeResult, run: jest.fn() }) })) describe('VirtualTree', () => { @@ -68,6 +67,10 @@ describe('VirtualTree', () => { }) it('should render items', async () => { + (useDisposableWebworker as jest.Mock).mockReturnValueOnce({ + result: mockVirtualTreeResult, + run: jest.fn() + }) const mockFn = jest.fn() const { queryByTestId } = render( { expect(mockOnStatusOpen).toBeCalledWith('car:', true) }) - it('should not call onStatusOpen if more then one folder is exist', () => { + it('should not call onStatusOpen if more than one folder is exist', () => { const mockFn = jest.fn() const mockOnStatusOpen = jest.fn() From f945b8d0d70b8dfc08f179c39bf5d0e670090eca Mon Sep 17 00:00:00 2001 From: Amir Allayarov Date: Thu, 16 Nov 2023 16:27:52 +0400 Subject: [PATCH 06/14] #RI-5131 - fix test --- .../virtual-tree/VirtualTree.spec.tsx | 17 ++++++++--------- 1 file changed, 8 insertions(+), 9 deletions(-) diff --git a/redisinsight/ui/src/pages/browser/components/virtual-tree/VirtualTree.spec.tsx b/redisinsight/ui/src/pages/browser/components/virtual-tree/VirtualTree.spec.tsx index 9726ccb8a3..9c169fda9a 100644 --- a/redisinsight/ui/src/pages/browser/components/virtual-tree/VirtualTree.spec.tsx +++ b/redisinsight/ui/src/pages/browser/components/virtual-tree/VirtualTree.spec.tsx @@ -2,7 +2,7 @@ import React from 'react' import { mock, instance } from 'ts-mockito' import { render } from 'uiSrc/utils/test-utils' -import { useDisposableWebworker } from 'uiSrc/services' +import * as Services from 'uiSrc/services' import VirtualTree, { Props } from './VirtualTree' const mockedProps = mock() @@ -44,6 +44,7 @@ const mockTreeItem2 = { export const mockVirtualTreeResult = [mockTreeItem, mockTreeItem2] jest.mock('uiSrc/services', () => ({ + __esModule: true, ...jest.requireActual('uiSrc/services'), useDisposableWebworker: jest.fn().mockReturnValue({ result: mockVirtualTreeResult, run: jest.fn() }) })) @@ -67,10 +68,9 @@ describe('VirtualTree', () => { }) it('should render items', async () => { - (useDisposableWebworker as jest.Mock).mockReturnValueOnce({ - result: mockVirtualTreeResult, - run: jest.fn() - }) + jest.spyOn(Services, 'useDisposableWebworker') + .mockReturnValueOnce({ result: [mockTreeItem, mockTreeItem2], run: jest.fn() }) + const mockFn = jest.fn() const { queryByTestId } = render( { }) it('should call onStatusOpen if only one folder is exist', () => { - (useDisposableWebworker as jest.Mock).mockReturnValueOnce({ - result: [mockTreeItem], - run: jest.fn() - }) + jest.spyOn(Services, 'useDisposableWebworker') + .mockReturnValueOnce({ result: [mockTreeItem], run: jest.fn() }) + const mockFn = jest.fn() const mockOnStatusOpen = jest.fn() From cf687865dce3c88497bcbbda6b549881f0f207d3 Mon Sep 17 00:00:00 2001 From: mariasergeenko Date: Fri, 17 Nov 2023 13:45:47 +0100 Subject: [PATCH 07/14] add verification --- tests/e2e/docker.web.docker-compose.yml | 2 +- tests/e2e/local.web.docker-compose.yml | 2 +- .../web/regression/tree-view/tree-view.e2e.ts | 38 ++++++++++++++++++- 3 files changed, 39 insertions(+), 3 deletions(-) diff --git a/tests/e2e/docker.web.docker-compose.yml b/tests/e2e/docker.web.docker-compose.yml index 99d2099406..9cd09a2e2f 100644 --- a/tests/e2e/docker.web.docker-compose.yml +++ b/tests/e2e/docker.web.docker-compose.yml @@ -33,7 +33,7 @@ services: command: [ './wait-for-it.sh', 'redis-enterprise:12000', '-s', '-t', '120', '--', - 'npx', 'yarn', 'test:chrome:ci' + 'npm', 'run', 'test:chrome:ci' ] # Built image diff --git a/tests/e2e/local.web.docker-compose.yml b/tests/e2e/local.web.docker-compose.yml index 554821fdc9..361f8a0acd 100644 --- a/tests/e2e/local.web.docker-compose.yml +++ b/tests/e2e/local.web.docker-compose.yml @@ -33,7 +33,7 @@ services: command: [ './wait-for-it.sh', 'redis-enterprise:12000', '-s', '-t', '120', '--', - 'npx', 'yarn', 'test:chrome:ci' + 'npm', 'run', 'test:chrome:ci' ] # Redisinsight API + UI build diff --git a/tests/e2e/tests/web/regression/tree-view/tree-view.e2e.ts b/tests/e2e/tests/web/regression/tree-view/tree-view.e2e.ts index 75db76c555..8acd8977d0 100644 --- a/tests/e2e/tests/web/regression/tree-view/tree-view.e2e.ts +++ b/tests/e2e/tests/web/regression/tree-view/tree-view.e2e.ts @@ -2,7 +2,7 @@ import { DatabaseHelper } from '../../../../helpers/database'; import { BrowserPage, WorkbenchPage } from '../../../../pageObjects'; import { commonUrl, - ossStandaloneBigConfig, + ossStandaloneBigConfig, ossStandaloneConfig, ossStandaloneConfigEmpty, ossStandaloneRedisearch } from '../../../../helpers/conf'; @@ -10,6 +10,7 @@ import { KeyTypesTexts, rte } from '../../../../helpers/constants'; import { DatabaseAPIRequests } from '../../../../helpers/api/api-database'; import { APIKeyRequests } from '../../../../helpers/api/api-keys'; import { Common } from '../../../../helpers/common'; +import { verifyKeysDisplayingInTheList } from '../../../../helpers/keys'; const browserPage = new BrowserPage(); const workbenchPage = new WorkbenchPage(); @@ -145,3 +146,38 @@ test actualItemsArray = await browserPage.TreeView.getAllItemsArray(); await t.expect(actualItemsArray).eql(expectedSortedByDESC); }); + +test + .before(async() => { + await databaseHelper.acceptLicenseTermsAndAddDatabaseApi(ossStandaloneConfig); + }) + .after(async() => { + await browserPage.Cli.sendCommandInCli('flushdb'); + await databaseAPIRequests.deleteStandaloneDatabaseApi(ossStandaloneConfig); + })('Verify that if filtering results has only 1 folder, the folder will be expanded', async t => { + const name = Common.generateWord(10); + const additionalCharacter = Common.generateWord(1); + const keyName1 = Common.generateWord(3); + const keyName2 = Common.generateWord(3); + keyNames = [`${name}${additionalCharacter}:${keyName1}`, `${name}${additionalCharacter}:${keyName2}`, name]; + + const commands = [ + 'flushdb', + `HSET ${keyNames[0]} field value`, + `HSET ${keyNames[1]} field value`, + `HSET ${keyNames[2]} field value` + ]; + + // Create 5 keys + await browserPage.Cli.sendCommandsInCli(commands); + await t.click(browserPage.treeViewButton); + await browserPage.searchByKeyName(`${name}${additionalCharacter}*`); + + await verifyKeysDisplayingInTheList([keyName1, keyName2], true); + + await browserPage.searchByKeyName(`${name}${additionalCharacter}`); + + await verifyKeysDisplayingInTheList([keyName1, keyName2], false); + + }); + From 61d7ef3a9d3d6ac88f9540a5ae8066c33c24ec67 Mon Sep 17 00:00:00 2001 From: mariasergeenko Date: Fri, 17 Nov 2023 14:52:19 +0100 Subject: [PATCH 08/14] fix open method --- .../components/browser/tree-view.ts | 21 +++++++++++++++---- 1 file changed, 17 insertions(+), 4 deletions(-) diff --git a/tests/e2e/pageObjects/components/browser/tree-view.ts b/tests/e2e/pageObjects/components/browser/tree-view.ts index d3fd5c75ae..3e7e041962 100644 --- a/tests/e2e/pageObjects/components/browser/tree-view.ts +++ b/tests/e2e/pageObjects/components/browser/tree-view.ts @@ -71,8 +71,8 @@ export class TreeView { await t.click(this.treeViewSettingsBtn); await t.click(this.sortingBtn); order === 'ASC' - ? await t.click(this.sortingASCoption) - : await t.click(this.sortingDESCoption) + ? await t.click(this.sortingASCoption) + : await t.click(this.sortingDESCoption); // Click on save button await t.click(this.treeViewDelimiterValueSave); @@ -93,11 +93,11 @@ export class TreeView { */ async openTreeFolders(names: string[]): Promise { let base = `node-item_${names[0]}:`; - await t.click(Selector(`[data-testid="${base}"]`)); + await this.clickElementIfNotExpanded(base, names[0]); if (names.length > 1) { for (let i = 1; i < names.length; i++) { base = `${base }${names[i]}:`; - await t.click(Selector(`[data-testid="${base}"]`)); + await this.clickElementIfNotExpanded(base, names[i]); } } } @@ -120,4 +120,17 @@ export class TreeView { return textArray; } + + /** + * click on the folder element if it is not expanded + * @param base the base element + * @param name of the folder + */ + private async clickElementIfNotExpanded(base: string, name: string): Promise { + const folderArrow = Selector(`[data-test-subj="node-arrow-icon_"${name[0]}"]`); + const baseSelector = Selector(`[data-testid="${base}"]`); + if (await baseSelector.find('div').count === 0 && await folderArrow.exists) { + await t.click(Selector(`[data-testid="${base}"]`)); + } + } } From 305fcc5b43ac3a03796d8db3a48bf135fdc6366d Mon Sep 17 00:00:00 2001 From: Amir Allayarov Date: Mon, 20 Nov 2023 12:26:09 +0400 Subject: [PATCH 09/14] #RI-5131 - update --- .../virtual-tree/VirtualTree.spec.tsx | 69 +++++++------------ .../components/virtual-tree/VirtualTree.tsx | 13 ++-- 2 files changed, 32 insertions(+), 50 deletions(-) diff --git a/redisinsight/ui/src/pages/browser/components/virtual-tree/VirtualTree.spec.tsx b/redisinsight/ui/src/pages/browser/components/virtual-tree/VirtualTree.spec.tsx index 9c169fda9a..77ab0073a2 100644 --- a/redisinsight/ui/src/pages/browser/components/virtual-tree/VirtualTree.spec.tsx +++ b/redisinsight/ui/src/pages/browser/components/virtual-tree/VirtualTree.spec.tsx @@ -2,7 +2,6 @@ import React from 'react' import { mock, instance } from 'ts-mockito' import { render } from 'uiSrc/utils/test-utils' -import * as Services from 'uiSrc/services' import VirtualTree, { Props } from './VirtualTree' const mockedProps = mock() @@ -16,37 +15,36 @@ const mockedItems = [ }, ] -const mockTreeItem = { - children: [{ +export const mockVirtualTreeResult = [ + { + children: [{ + children: [], + fullName: 'car:110:', + id: '0.snc1rc3zwgo', + keyApproximate: 0.01, + keyCount: 1, + name: '110', + }], + fullName: 'car:', + id: '0.sz1ie1koqi8', + keyApproximate: 47.18, + keyCount: 4718, + name: 'car', + }, + { children: [], - fullName: 'car:110:', - id: '0.snc1rc3zwgo', + fullName: 'test', + id: '0.snc1rc3zwg1o', keyApproximate: 0.01, keyCount: 1, - name: '110', - }], - fullName: 'car:', - id: '0.sz1ie1koqi8', - keyApproximate: 47.18, - keyCount: 4718, - name: 'car', -} - -const mockTreeItem2 = { - children: [], - fullName: 'test', - id: '0.snc1rc3zwg1o', - keyApproximate: 0.01, - keyCount: 1, - name: 'test', -} - -export const mockVirtualTreeResult = [mockTreeItem, mockTreeItem2] + name: 'test', + } +] jest.mock('uiSrc/services', () => ({ __esModule: true, ...jest.requireActual('uiSrc/services'), - useDisposableWebworker: jest.fn().mockReturnValue({ result: mockVirtualTreeResult, run: jest.fn() }) + useDisposableWebworker: () => ({ result: mockVirtualTreeResult, run: jest.fn() }) })) describe('VirtualTree', () => { @@ -68,9 +66,6 @@ describe('VirtualTree', () => { }) it('should render items', async () => { - jest.spyOn(Services, 'useDisposableWebworker') - .mockReturnValueOnce({ result: [mockTreeItem, mockTreeItem2], run: jest.fn() }) - const mockFn = jest.fn() const { queryByTestId } = render( { expect(queryByTestId('node-item_test')).toBeInTheDocument() }) - it('should call onStatusOpen if only one folder is exist', () => { - jest.spyOn(Services, 'useDisposableWebworker') - .mockReturnValueOnce({ result: [mockTreeItem], run: jest.fn() }) - - const mockFn = jest.fn() - const mockOnStatusOpen = jest.fn() - - render( - - ) - - expect(mockOnStatusOpen).toBeCalledWith('car:', true) - }) - it('should not call onStatusOpen if more than one folder is exist', () => { const mockFn = jest.fn() const mockOnStatusOpen = jest.fn() diff --git a/redisinsight/ui/src/pages/browser/components/virtual-tree/VirtualTree.tsx b/redisinsight/ui/src/pages/browser/components/virtual-tree/VirtualTree.tsx index a0d073b977..5d0d7d6747 100644 --- a/redisinsight/ui/src/pages/browser/components/virtual-tree/VirtualTree.tsx +++ b/redisinsight/ui/src/pages/browser/components/virtual-tree/VirtualTree.tsx @@ -63,7 +63,7 @@ const VirtualTree = (props: Props) => { onStatusOpen, onStatusSelected, setConstructingTree, - webworkerFn = () => {}, + webworkerFn = () => { }, onDeleteClicked, onDeleteLeaf, } = props @@ -95,9 +95,7 @@ const VirtualTree = (props: Props) => { rerender({}) setConstructingTree?.(false) - if (nodes?.current?.length === 1) { - onStatusOpen?.(nodes.current[0].fullName, true) - } + openSingleFolderNode(nodes.current) }, [result]) useEffect(() => { @@ -209,6 +207,13 @@ const VirtualTree = (props: Props) => { node, }) + const openSingleFolderNode = useCallback((nodes?: TreeNode[]) => { + if (nodes?.length === 1) { + onStatusOpen?.(nodes[0].fullName, true) + openSingleFolderNode(nodes[0].children) + } + }, [onStatusOpen]) + // The `treeWalker` function runs only on tree re-build which is performed // whenever the `treeWalker` prop is changed. const treeWalker = useCallback( From 26ba14f1f3f52e59416810499f1387eeb5c2f9de Mon Sep 17 00:00:00 2001 From: Amir Allayarov Date: Mon, 20 Nov 2023 13:16:53 +0400 Subject: [PATCH 10/14] #RI-5131 - resolve comments --- .../browser/components/virtual-tree/VirtualTree.tsx | 10 ++++++---- 1 file changed, 6 insertions(+), 4 deletions(-) diff --git a/redisinsight/ui/src/pages/browser/components/virtual-tree/VirtualTree.tsx b/redisinsight/ui/src/pages/browser/components/virtual-tree/VirtualTree.tsx index 5d0d7d6747..5092080298 100644 --- a/redisinsight/ui/src/pages/browser/components/virtual-tree/VirtualTree.tsx +++ b/redisinsight/ui/src/pages/browser/components/virtual-tree/VirtualTree.tsx @@ -207,10 +207,12 @@ const VirtualTree = (props: Props) => { node, }) - const openSingleFolderNode = useCallback((nodes?: TreeNode[]) => { - if (nodes?.length === 1) { - onStatusOpen?.(nodes[0].fullName, true) - openSingleFolderNode(nodes[0].children) + const openSingleFolderNode = useCallback((treeNodes?: TreeNode[]) => { + let nodes = treeNodes + while (nodes?.length === 1) { + const singleNode = nodes[0] + onStatusOpen?.(singleNode.fullName, true) + nodes = singleNode.children } }, [onStatusOpen]) From 893771d7af2eb940a2ca139a8795a11903bd3fc7 Mon Sep 17 00:00:00 2001 From: mariasergeenko Date: Mon, 20 Nov 2023 11:24:27 +0100 Subject: [PATCH 11/14] added extended attribute --- .../virtual-tree/components/Node/Node.tsx | 2 +- .../pageObjects/components/browser/tree-view.ts | 15 +++++++-------- 2 files changed, 8 insertions(+), 9 deletions(-) diff --git a/redisinsight/ui/src/pages/browser/components/virtual-tree/components/Node/Node.tsx b/redisinsight/ui/src/pages/browser/components/virtual-tree/components/Node/Node.tsx index 1bc3f02205..597fe86359 100644 --- a/redisinsight/ui/src/pages/browser/components/virtual-tree/components/Node/Node.tsx +++ b/redisinsight/ui/src/pages/browser/components/virtual-tree/components/Node/Node.tsx @@ -154,7 +154,7 @@ const Node = ({ onKeyDown={handleKeyDown} tabIndex={0} onFocus={() => {}} - data-testid={`node-item_${fullName}`} + data-testid={`node-item_${fullName}${isOpen && !isLeaf ? '--expanded' : ''}`} > {!isLeaf && } {isLeaf && } diff --git a/tests/e2e/pageObjects/components/browser/tree-view.ts b/tests/e2e/pageObjects/components/browser/tree-view.ts index 3e7e041962..1a5c7d473c 100644 --- a/tests/e2e/pageObjects/components/browser/tree-view.ts +++ b/tests/e2e/pageObjects/components/browser/tree-view.ts @@ -93,11 +93,11 @@ export class TreeView { */ async openTreeFolders(names: string[]): Promise { let base = `node-item_${names[0]}:`; - await this.clickElementIfNotExpanded(base, names[0]); + await this.clickElementIfNotExpanded(base); if (names.length > 1) { for (let i = 1; i < names.length; i++) { base = `${base }${names[i]}:`; - await this.clickElementIfNotExpanded(base, names[i]); + await this.clickElementIfNotExpanded(base); } } } @@ -124,13 +124,12 @@ export class TreeView { /** * click on the folder element if it is not expanded * @param base the base element - * @param name of the folder */ - private async clickElementIfNotExpanded(base: string, name: string): Promise { - const folderArrow = Selector(`[data-test-subj="node-arrow-icon_"${name[0]}"]`); - const baseSelector = Selector(`[data-testid="${base}"]`); - if (await baseSelector.find('div').count === 0 && await folderArrow.exists) { - await t.click(Selector(`[data-testid="${base}"]`)); + private async clickElementIfNotExpanded(base: string): Promise { + const baseSelector = Selector(`[data-testid^="${base}"]`); + const elementSelector = await baseSelector.getAttribute('data-testid'); + if (!elementSelector?.includes('expanded')) { + await t.click(Selector(`[data-testid^="${base}"]`)); } } } From b700e55f18a132d9078131dd9f001e2d8eb5b442 Mon Sep 17 00:00:00 2001 From: mariasergeenko Date: Mon, 20 Nov 2023 12:27:53 +0100 Subject: [PATCH 12/14] fix browser action --- tests/e2e/common-actions/browser-actions.ts | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/tests/e2e/common-actions/browser-actions.ts b/tests/e2e/common-actions/browser-actions.ts index 836fa6235e..03a1f9585a 100644 --- a/tests/e2e/common-actions/browser-actions.ts +++ b/tests/e2e/common-actions/browser-actions.ts @@ -108,7 +108,10 @@ export class BrowserActions { for (let j = 0; j < innerFoldersNumber; j++) { const nodeName = this.getNodeName(prevNodeSelector, folders[i][j], delimiter); const node = this.getNodeSelector(nodeName); - await t.click(node); + const fullTestIdSelector = await node.getAttribute('data-testid'); + if (!fullTestIdSelector?.includes('expanded')) { + await t.click(node); + } prevNodeSelector = nodeName; } From 5a6a4e088ef10cc2a7c83d517b32b69cccfde6e3 Mon Sep 17 00:00:00 2001 From: mariasergeenko Date: Mon, 20 Nov 2023 12:29:45 +0100 Subject: [PATCH 13/14] fix locator --- tests/e2e/common-actions/browser-actions.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/tests/e2e/common-actions/browser-actions.ts b/tests/e2e/common-actions/browser-actions.ts index 03a1f9585a..fcc6aceaaf 100644 --- a/tests/e2e/common-actions/browser-actions.ts +++ b/tests/e2e/common-actions/browser-actions.ts @@ -87,7 +87,7 @@ export class BrowserActions { * @param name node name */ getNodeSelector(name: string): Selector { - return Selector(`[data-testid="node-item_${name}"]`); + return Selector(`[data-testid^="node-item_${name}"]`); } /** From b3a8f3a1bbbff49a18bba98408f7ebad4ed5b0cf Mon Sep 17 00:00:00 2001 From: mariasergeenko Date: Mon, 20 Nov 2023 13:29:56 +0100 Subject: [PATCH 14/14] add comments --- .../web/regression/tree-view/tree-view.e2e.ts | 14 +++++++------- 1 file changed, 7 insertions(+), 7 deletions(-) diff --git a/tests/e2e/tests/web/regression/tree-view/tree-view.e2e.ts b/tests/e2e/tests/web/regression/tree-view/tree-view.e2e.ts index 8acd8977d0..1a34378be8 100644 --- a/tests/e2e/tests/web/regression/tree-view/tree-view.e2e.ts +++ b/tests/e2e/tests/web/regression/tree-view/tree-view.e2e.ts @@ -2,7 +2,8 @@ import { DatabaseHelper } from '../../../../helpers/database'; import { BrowserPage, WorkbenchPage } from '../../../../pageObjects'; import { commonUrl, - ossStandaloneBigConfig, ossStandaloneConfig, + ossStandaloneBigConfig, + ossStandaloneConfig, ossStandaloneConfigEmpty, ossStandaloneRedisearch } from '../../../../helpers/conf'; @@ -147,6 +148,7 @@ test await t.expect(actualItemsArray).eql(expectedSortedByDESC); }); +https://redislabs.atlassian.net/browse/RI-5131 test .before(async() => { await databaseHelper.acceptLicenseTermsAndAddDatabaseApi(ossStandaloneConfig); @@ -167,17 +169,15 @@ test `HSET ${keyNames[1]} field value`, `HSET ${keyNames[2]} field value` ]; - - // Create 5 keys await browserPage.Cli.sendCommandsInCli(commands); await t.click(browserPage.treeViewButton); - await browserPage.searchByKeyName(`${name}${additionalCharacter}*`); + // Verify if there is only folder, a user can see keys inside + await browserPage.searchByKeyName(`${name}${additionalCharacter}*`); await verifyKeysDisplayingInTheList([keyName1, keyName2], true); - await browserPage.searchByKeyName(`${name}${additionalCharacter}`); - + // Verify if there are folder and key, a user can't see keys inside the folder + await browserPage.searchByKeyName(`${name}*`); await verifyKeysDisplayingInTheList([keyName1, keyName2], false); - });