From 92b4ebc19d9b4fe49c9ab3ba405ae8d70bed6203 Mon Sep 17 00:00:00 2001 From: Viet Nguyen Duc Date: Mon, 7 Jul 2025 07:48:23 +0700 Subject: [PATCH 1/2] [grid] Add "URI" to the list of sort-by choices on Overview UI --- .../grid-ui/src/screens/Overview/Overview.tsx | 2 ++ .../src/tests/components/Overview.test.tsx | 20 +++++++++++++++++++ 2 files changed, 22 insertions(+) diff --git a/javascript/grid-ui/src/screens/Overview/Overview.tsx b/javascript/grid-ui/src/screens/Overview/Overview.tsx index 8a877fe8b845d..4f69d4c185745 100644 --- a/javascript/grid-ui/src/screens/Overview/Overview.tsx +++ b/javascript/grid-ui/src/screens/Overview/Overview.tsx @@ -67,6 +67,7 @@ function Overview (): JSX.Element { const sortProperties = { 'platformName': (a, b) => compareSlotStereotypes(a, b, 'platformName'), 'status': (a, b) => a.status.localeCompare(b.status), + 'uri': (a, b) => a.uri.localeCompare(b.uri), 'browserName': (a, b) => compareSlotStereotypes(a, b, 'browserName'), 'browserVersion': (a, b) => compareSlotStereotypes(a, b, 'browserVersion'), 'slotCount': (a, b) => { @@ -80,6 +81,7 @@ function Overview (): JSX.Element { const sortPropertiesLabel = { 'platformName': 'Platform Name', 'status': 'Status', + 'uri': 'URI', 'browserName': 'Browser Name', 'browserVersion': 'Browser Version', 'slotCount': 'Slot Count', diff --git a/javascript/grid-ui/src/tests/components/Overview.test.tsx b/javascript/grid-ui/src/tests/components/Overview.test.tsx index 13f6f2810e047..e413a10b4676c 100644 --- a/javascript/grid-ui/src/tests/components/Overview.test.tsx +++ b/javascript/grid-ui/src/tests/components/Overview.test.tsx @@ -255,6 +255,26 @@ describe('Overview component', () => { } }) + it('sorts nodes by URI when selected', async () => { + render( + + + + ) + + await screen.findByText('http://192.168.1.10:4444') + + const user = userEvent.setup() + const selectElement = screen.getByRole('combobox') + await user.click(selectElement) + await user.click(screen.getByText('URI')) + + // After sorting by URI, node1 should appear before node2 + const nodeUris = screen.getAllByText(/http:\/\/192\.168\.1\.\d+:4444/) + expect(nodeUris[0]).toHaveTextContent('http://192.168.1.10:4444') + expect(nodeUris[1]).toHaveTextContent('http://192.168.1.11:4444') + }) + it('renders live view icon for node with VNC session', async () => { render( From 00ce165d18edbcd223373f7fc28f97e7d0ae51a9 Mon Sep 17 00:00:00 2001 From: Viet Nguyen Duc Date: Mon, 7 Jul 2025 08:15:57 +0700 Subject: [PATCH 2/2] Fix review comments --- .../grid-ui/src/screens/Overview/Overview.tsx | 4 +-- .../src/tests/components/Overview.test.tsx | 28 +++++++++++++++++++ 2 files changed, 30 insertions(+), 2 deletions(-) diff --git a/javascript/grid-ui/src/screens/Overview/Overview.tsx b/javascript/grid-ui/src/screens/Overview/Overview.tsx index 4f69d4c185745..7c29bd07ac4a2 100644 --- a/javascript/grid-ui/src/screens/Overview/Overview.tsx +++ b/javascript/grid-ui/src/screens/Overview/Overview.tsx @@ -66,8 +66,8 @@ function Overview (): JSX.Element { const sortProperties = { 'platformName': (a, b) => compareSlotStereotypes(a, b, 'platformName'), - 'status': (a, b) => a.status.localeCompare(b.status), - 'uri': (a, b) => a.uri.localeCompare(b.uri), + 'status': (a, b) => (a.status ?? '').localeCompare(b.status ?? ''), + 'uri': (a, b) => (a.uri ?? '').localeCompare(b.uri ?? ''), 'browserName': (a, b) => compareSlotStereotypes(a, b, 'browserName'), 'browserVersion': (a, b) => compareSlotStereotypes(a, b, 'browserVersion'), 'slotCount': (a, b) => { diff --git a/javascript/grid-ui/src/tests/components/Overview.test.tsx b/javascript/grid-ui/src/tests/components/Overview.test.tsx index e413a10b4676c..e8d6e981c4a87 100644 --- a/javascript/grid-ui/src/tests/components/Overview.test.tsx +++ b/javascript/grid-ui/src/tests/components/Overview.test.tsx @@ -275,6 +275,34 @@ describe('Overview component', () => { expect(nodeUris[1]).toHaveTextContent('http://192.168.1.11:4444') }) + it('sorts nodes by URI in descending order when selected', async () => { + render( + + + + ) + + await screen.findByText('http://192.168.1.10:4444') + + const user = userEvent.setup() + const selectElement = screen.getByRole('combobox') + await user.click(selectElement) + await user.click(screen.getByText('URI')) + + const descendingLabel = screen.getByText('Descending') + const checkbox = descendingLabel.closest('label')?.querySelector('input[type="checkbox"]') + expect(checkbox).not.toBeNull() + if (checkbox) { + await user.click(checkbox) + expect(checkbox).toBeChecked() + } + + // After sorting by URI descending, node2 should appear before node1 + const nodeUris = screen.getAllByText(/http:\/\/192\.168\.1\.\d+:4444/) + expect(nodeUris[0]).toHaveTextContent('http://192.168.1.11:4444') + expect(nodeUris[1]).toHaveTextContent('http://192.168.1.10:4444') + }) + it('renders live view icon for node with VNC session', async () => { render(