diff --git a/javascript/grid-ui/src/screens/Overview/Overview.tsx b/javascript/grid-ui/src/screens/Overview/Overview.tsx
index 8a877fe8b845d..7c29bd07ac4a2 100644
--- a/javascript/grid-ui/src/screens/Overview/Overview.tsx
+++ b/javascript/grid-ui/src/screens/Overview/Overview.tsx
@@ -66,7 +66,8 @@ function Overview (): JSX.Element {
const sortProperties = {
'platformName': (a, b) => compareSlotStereotypes(a, b, 'platformName'),
- 'status': (a, b) => a.status.localeCompare(b.status),
+ '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..e8d6e981c4a87 100644
--- a/javascript/grid-ui/src/tests/components/Overview.test.tsx
+++ b/javascript/grid-ui/src/tests/components/Overview.test.tsx
@@ -255,6 +255,54 @@ 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('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(