diff --git a/devenv/dev-dashboards/panel-geomap/geomap-spatial-operations-transformer.json b/devenv/dev-dashboards/panel-geomap/geomap-spatial-operations-transformer.json index e7f869e351c..42a66cb145e 100644 --- a/devenv/dev-dashboards/panel-geomap/geomap-spatial-operations-transformer.json +++ b/devenv/dev-dashboards/panel-geomap/geomap-spatial-operations-transformer.json @@ -70,11 +70,11 @@ "options": { "controls": { "mouseWheelZoom": true, - "showAttribution": true, + "showAttribution": false, "showDebug": false, "showMeasure": false, "showScale": false, - "showZoom": true + "showZoom": false }, "tooltip": { "mode": "details" diff --git a/e2e/geomap-suite/geomap-map-controls.spec.ts b/e2e/geomap-suite/geomap-map-controls.spec.ts new file mode 100644 index 00000000000..f41c272e94a --- /dev/null +++ b/e2e/geomap-suite/geomap-map-controls.spec.ts @@ -0,0 +1,35 @@ +import { e2e } from '@grafana/e2e'; +const DASHBOARD_ID = 'P2jR04WVk'; + +e2e.scenario({ + describeName: 'Geomap map controls options', + itName: 'Tests map controls options', + addScenarioDataSource: false, + addScenarioDashBoard: false, + skipScenario: false, + scenario: () => { + e2e.flows.openDashboard({ uid: DASHBOARD_ID, queryParams: { editPanel: 1 } }); + + // Show zoom + e2e.components.OptionsGroup.group('Map controls').scrollIntoView().should('exist'); + cy.get('input[id="controls.showZoom"]').check({ force: true }); + cy.contains('+'); + cy.get('.ol-zoom').should('exist'); + + // Show attribution + cy.get('input[id="controls.showAttribution"]').check({ force: true }); + cy.get('.ol-attribution').should('exist'); + + // Show scale + cy.get('input[id="controls.showScale"]').check({ force: true }); + cy.get('.ol-scale-line').should('exist'); + + // Show measure tool + cy.get('input[id="controls.showMeasure"]').check({ force: true }); + e2e.components.PanelEditor.measureButton().should('exist'); + + // Show debug + cy.get('input[id="controls.showDebug"]').check({ force: true }); + e2e.components.DebugOverlay.wrapper().should('exist'); + }, +}); diff --git a/packages/grafana-e2e-selectors/src/selectors/components.ts b/packages/grafana-e2e-selectors/src/selectors/components.ts index cb9be600448..24a1586b919 100644 --- a/packages/grafana-e2e-selectors/src/selectors/components.ts +++ b/packages/grafana-e2e-selectors/src/selectors/components.ts @@ -127,6 +127,9 @@ export const Components = { toggleVizPicker: 'toggle-viz-picker', toggleVizOptions: 'toggle-viz-options', toggleTableView: 'toggle-table-view', + + // [Geomap] Map controls + measureButton: 'show measure tools', }, PanelInspector: { Data: { @@ -368,4 +371,7 @@ export const Components = { inputField: 'data-testid-file-upload-input-field', fileNameSpan: 'data-testid-file-upload-file-name', }, + DebugOverlay: { + wrapper: 'debug-overlay', + }, }; diff --git a/public/app/plugins/panel/geomap/components/DebugOverlay.tsx b/public/app/plugins/panel/geomap/components/DebugOverlay.tsx index 4cd85540d34..7c99d78964b 100644 --- a/public/app/plugins/panel/geomap/components/DebugOverlay.tsx +++ b/public/app/plugins/panel/geomap/components/DebugOverlay.tsx @@ -6,6 +6,7 @@ import React, { PureComponent } from 'react'; import tinycolor from 'tinycolor2'; import { GrafanaTheme } from '@grafana/data'; +import { selectors } from '@grafana/e2e-selectors/src'; import { stylesFactory } from '@grafana/ui'; import { config } from 'app/core/config'; @@ -43,7 +44,7 @@ export class DebugOverlay extends PureComponent { const { zoom, center } = this.state; return ( -
+