diff --git a/devenv/dev-dashboards/scenarios/relative_time_zone_support.json b/devenv/dev-dashboards/scenarios/relative_time_zone_support.json index eb57be0ac51..5fcf0e10597 100644 --- a/devenv/dev-dashboards/scenarios/relative_time_zone_support.json +++ b/devenv/dev-dashboards/scenarios/relative_time_zone_support.json @@ -18,7 +18,7 @@ "editable": true, "fiscalYearStartMonth": 0, "graphTooltip": 0, - "id": 98, + "id": 7271, "links": [], "liveNow": false, "panels": [ @@ -30,38 +30,14 @@ "fieldConfig": { "defaults": { "color": { - "mode": "palette-classic" + "mode": "thresholds" }, "custom": { - "axisCenteredZero": false, - "axisColorMode": "text", - "axisLabel": "", - "axisPlacement": "auto", - "barAlignment": 0, - "drawStyle": "line", - "fillOpacity": 0, - "gradientMode": "none", - "hideFrom": { - "legend": false, - "tooltip": false, - "viz": false + "align": "auto", + "cellOptions": { + "type": "auto" }, - "insertNulls": false, - "lineInterpolation": "linear", - "lineWidth": 1, - "pointSize": 5, - "scaleDistribution": { - "type": "linear" - }, - "showPoints": "auto", - "spanNulls": false, - "stacking": { - "group": "A", - "mode": "none" - }, - "thresholdsStyle": { - "mode": "off" - } + "inspect": false }, "mappings": [], "thresholds": { @@ -81,24 +57,93 @@ "overrides": [] }, "gridPos": { - "h": 9, + "h": 8, "w": 12, "x": 0, "y": 0 }, - "id": 1, + "id": 2, "options": { - "legend": { - "calcs": [], - "displayMode": "list", - "placement": "bottom", - "showLegend": true + "cellHeight": "sm", + "footer": { + "countRows": false, + "fields": "", + "reducer": [ + "sum" + ], + "show": false }, - "tooltip": { - "mode": "single", - "sort": "none" - } + "showHeader": true }, + "pluginVersion": "10.2.0-pre", + "targets": [ + { + "datasource": { + "type": "testdata", + "uid": "gdev-testdata" + }, + "refId": "A", + "scenarioId": "random_walk", + "seriesCount": 1 + } + ], + "title": "Panel in timezone", + "type": "table" + }, + { + "datasource": { + "type": "testdata", + "uid": "gdev-testdata" + }, + "fieldConfig": { + "defaults": { + "color": { + "mode": "thresholds" + }, + "custom": { + "align": "auto", + "cellOptions": { + "type": "auto" + }, + "inspect": false + }, + "mappings": [], + "thresholds": { + "mode": "absolute", + "steps": [ + { + "color": "green", + "value": null + }, + { + "color": "red", + "value": 80 + } + ] + } + }, + "overrides": [] + }, + "gridPos": { + "h": 8, + "w": 12, + "x": 12, + "y": 0 + }, + "id": 3, + "options": { + "cellHeight": "sm", + "footer": { + "countRows": false, + "fields": "", + "reducer": [ + "sum" + ], + "show": false + }, + "showHeader": true + }, + "pluginVersion": "10.2.0-pre", "targets": [ { "datasource": { @@ -111,8 +156,8 @@ } ], "timeFrom": "now/d", - "title": "Panel title", - "type": "timeseries" + "title": "Panel with relative time override", + "type": "table" } ], "refresh": "", @@ -122,13 +167,13 @@ "list": [] }, "time": { - "from": "now-6h", + "from": "now-3h", "to": "now" }, "timepicker": {}, "timezone": "Asia/Tokyo", "title": "Panel Tests - Relative time zone support", "uid": "d41dbaa2-a39e-4536-ab2b-caca52f1a9c8", - "version": 1, + "version": 7, "weekStart": "" } diff --git a/e2e/dashboards-suite/dashboard-time-zone.spec.ts b/e2e/dashboards-suite/dashboard-time-zone.spec.ts index 320a499ac95..dabe7c4a3e1 100644 --- a/e2e/dashboards-suite/dashboard-time-zone.spec.ts +++ b/e2e/dashboards-suite/dashboard-time-zone.spec.ts @@ -102,17 +102,14 @@ e2e.scenario({ }, }); - e2e.components.Panels.Panel.title('Panel title') + e2e.components.Panels.Panel.title('Panel with relative time override') .should('be.visible') .within(() => { - e2e().contains('Today so far').should('be.visible'); - e2e().contains('Today so far').click(); - }); - - e2e.components.Tooltip.container() - .should('be.visible') - .within(() => { - e2e().contains('00:00:00').should('be.visible'); + e2e.components.Panels.Visualization.Table.body() + .should('be.visible') + .within(() => { + e2e().get('[role="row"]').first().should('have.text', '00:00:00'); + }); }); // Test Browser @@ -122,17 +119,14 @@ e2e.scenario({ zone: 'Browser Time', }); - e2e.components.Panels.Panel.title('Panel title') + e2e.components.Panels.Panel.title('Panel with relative time override') .should('be.visible') .within(() => { - e2e().contains('Today so far').should('be.visible'); - e2e().contains('Today so far').click(); - }); - - e2e.components.Tooltip.container() - .should('be.visible') - .within(() => { - e2e().contains('00:00:00').should('be.visible'); + e2e.components.Panels.Visualization.Table.body() + .should('be.visible') + .within(() => { + e2e().get('[role="row"]').first().should('have.text', '00:00:00'); + }); }); // Test specific timezone @@ -142,17 +136,40 @@ e2e.scenario({ zone: 'Asia/Tokyo', }); - e2e.components.Panels.Panel.title('Panel title') + e2e.components.Panels.Panel.title('Panel with relative time override') .should('be.visible') .within(() => { - e2e().contains('Today so far').should('be.visible'); - e2e().contains('Today so far').click(); + e2e.components.Panels.Visualization.Table.body() + .should('be.visible') + .within(() => { + e2e().get('[role="row"]').first().should('have.text', '00:00:00'); + }); }); - e2e.components.Tooltip.container() + // Test today so far in both panels + e2e.flows.setTimeRange({ + from: 'now/d', + to: 'now', + }); + + e2e.components.Panels.Panel.title('Panel in timezone') .should('be.visible') .within(() => { - e2e().contains('00:00:00').should('be.visible'); + e2e.components.Panels.Visualization.Table.body() + .should('be.visible') + .within(() => { + e2e().get('[role="row"]').first().should('have.text', '00:00:00'); + }); + }); + + e2e.components.Panels.Panel.title('Panel with relative time override') + .should('be.visible') + .within(() => { + e2e.components.Panels.Visualization.Table.body() + .should('be.visible') + .within(() => { + e2e().get('[role="row"]').first().should('have.text', '00:00:00'); + }); }); }, }); diff --git a/packages/grafana-e2e-selectors/src/selectors/components.ts b/packages/grafana-e2e-selectors/src/selectors/components.ts index cca9fb07f6b..318446188a9 100644 --- a/packages/grafana-e2e-selectors/src/selectors/components.ts +++ b/packages/grafana-e2e-selectors/src/selectors/components.ts @@ -112,6 +112,7 @@ export const Components = { Table: { header: 'table header', footer: 'table-footer', + body: 'data-testid table body', }, }, }, diff --git a/packages/grafana-ui/src/components/Table/Table.tsx b/packages/grafana-ui/src/components/Table/Table.tsx index 7c7bef084a1..1f1ddf6f160 100644 --- a/packages/grafana-ui/src/components/Table/Table.tsx +++ b/packages/grafana-ui/src/components/Table/Table.tsx @@ -13,6 +13,7 @@ import { import { VariableSizeList } from 'react-window'; import { Field, FieldType, ReducerID } from '@grafana/data'; +import { selectors } from '@grafana/e2e-selectors'; import { TableCellHeight } from '@grafana/schema'; import { useTheme2 } from '../../themes'; @@ -330,7 +331,7 @@ export const Table = memo((props: Props) => { )} {itemCount > 0 ? ( -
+