diff --git a/e2e/cloud-plugins-suite/azure-monitor.spec.ts b/e2e/cloud-plugins-suite/azure-monitor.spec.ts index 2009e0a4c89..37ced38c1d3 100644 --- a/e2e/cloud-plugins-suite/azure-monitor.spec.ts +++ b/e2e/cloud-plugins-suite/azure-monitor.spec.ts @@ -2,6 +2,7 @@ import { load } from 'js-yaml'; import { v4 as uuidv4 } from 'uuid'; import { e2e } from '@grafana/e2e'; +import { GrafanaBootConfig } from '@grafana/runtime'; import { selectors } from '../../public/app/plugins/datasource/azuremonitor/e2e/selectors'; import { @@ -96,7 +97,15 @@ const addAzureMonitorVariable = ( break; } e2e.pages.Dashboard.Settings.Variables.Edit.General.submitButton().click(); - e2e.components.PageToolbar.item('Go Back').click(); + e2e() + .window() + .then((win: Cypress.AUTWindow & { grafanaBootData: GrafanaBootConfig['bootData'] }) => { + if (win.grafanaBootData.settings.featureToggles.topnav) { + e2e.pages.Dashboard.Settings.Actions.close().click(); + } else { + e2e.components.PageToolbar.item('Go Back').click(); + } + }); }; e2e.scenario({ diff --git a/e2e/dashboards-suite/new-constant-variable.spec.ts b/e2e/dashboards-suite/new-constant-variable.spec.ts index a96189a9748..bdb990828ed 100644 --- a/e2e/dashboards-suite/new-constant-variable.spec.ts +++ b/e2e/dashboards-suite/new-constant-variable.spec.ts @@ -2,7 +2,6 @@ import { e2e } from '@grafana/e2e'; import { GrafanaBootConfig } from '@grafana/runtime'; const PAGE_UNDER_TEST = 'kVi2Gex7z/test-variable-output'; -const DASHBOARD_NAME = 'Test variable output'; describe('Variables - Constant', () => { it('can add a new constant variable', () => { @@ -27,7 +26,7 @@ describe('Variables - Constant', () => { .window() .then((win: Cypress.AUTWindow & { grafanaBootData: GrafanaBootConfig['bootData'] }) => { if (win.grafanaBootData.settings.featureToggles.topnav) { - e2e.components.Breadcrumbs.breadcrumb(DASHBOARD_NAME).click(); + e2e.pages.Dashboard.Settings.Actions.close().click(); } else { e2e.components.BackButton.backArrow().click({ force: true }); } diff --git a/e2e/dashboards-suite/new-custom-variable.spec.ts b/e2e/dashboards-suite/new-custom-variable.spec.ts index 52fcafc0082..1ed710f11d3 100644 --- a/e2e/dashboards-suite/new-custom-variable.spec.ts +++ b/e2e/dashboards-suite/new-custom-variable.spec.ts @@ -2,7 +2,6 @@ import { e2e } from '@grafana/e2e'; import { GrafanaBootConfig } from '@grafana/runtime'; const PAGE_UNDER_TEST = 'kVi2Gex7z/test-variable-output'; -const DASHBOARD_NAME = 'Test variable output'; function fillInCustomVariable(name: string, label: string, value: string) { e2e.pages.Dashboard.Settings.Variables.Edit.General.generalTypeSelectV2().within(() => { @@ -36,7 +35,7 @@ describe('Variables - Custom', () => { .window() .then((win: Cypress.AUTWindow & { grafanaBootData: GrafanaBootConfig['bootData'] }) => { if (win.grafanaBootData.settings.featureToggles.topnav) { - e2e.components.Breadcrumbs.breadcrumb(DASHBOARD_NAME).click(); + e2e.pages.Dashboard.Settings.Actions.close().click(); } else { e2e.components.BackButton.backArrow().click({ force: true }); } @@ -68,7 +67,7 @@ describe('Variables - Custom', () => { .window() .then((win: Cypress.AUTWindow & { grafanaBootData: GrafanaBootConfig['bootData'] }) => { if (win.grafanaBootData.settings.featureToggles.topnav) { - e2e.components.Breadcrumbs.breadcrumb('Test variable output').click(); + e2e.pages.Dashboard.Settings.Actions.close().click(); } else { e2e.components.BackButton.backArrow().click({ force: true }); } diff --git a/e2e/dashboards-suite/new-datasource-variable.spec.ts b/e2e/dashboards-suite/new-datasource-variable.spec.ts index a85e99da0a4..8d9bdfb4ea3 100644 --- a/e2e/dashboards-suite/new-datasource-variable.spec.ts +++ b/e2e/dashboards-suite/new-datasource-variable.spec.ts @@ -2,7 +2,6 @@ import { e2e } from '@grafana/e2e'; import { GrafanaBootConfig } from '@grafana/runtime'; const PAGE_UNDER_TEST = 'kVi2Gex7z/test-variable-output'; -const DASHBOARD_NAME = 'Test variable output'; describe('Variables - Datasource', () => { it('can add a new datasource variable', () => { @@ -35,7 +34,7 @@ describe('Variables - Datasource', () => { .window() .then((win: Cypress.AUTWindow & { grafanaBootData: GrafanaBootConfig['bootData'] }) => { if (win.grafanaBootData.settings.featureToggles.topnav) { - e2e.components.Breadcrumbs.breadcrumb(DASHBOARD_NAME).click(); + e2e.pages.Dashboard.Settings.Actions.close().click(); } else { e2e.components.BackButton.backArrow().click({ force: true }); } diff --git a/e2e/dashboards-suite/new-interval-variable.spec.ts b/e2e/dashboards-suite/new-interval-variable.spec.ts index 7fe862da976..c55fb7b0796 100644 --- a/e2e/dashboards-suite/new-interval-variable.spec.ts +++ b/e2e/dashboards-suite/new-interval-variable.spec.ts @@ -2,7 +2,6 @@ import { e2e } from '@grafana/e2e'; import { GrafanaBootConfig } from '@grafana/runtime'; const PAGE_UNDER_TEST = 'kVi2Gex7z/test-variable-output'; -const DASHBOARD_NAME = 'Test variable output'; function assertPreviewValues(expectedValues: string[]) { for (const expected of expectedValues) { @@ -37,7 +36,7 @@ describe('Variables - Interval', () => { .window() .then((win: Cypress.AUTWindow & { grafanaBootData: GrafanaBootConfig['bootData'] }) => { if (win.grafanaBootData.settings.featureToggles.topnav) { - e2e.components.Breadcrumbs.breadcrumb(DASHBOARD_NAME).click(); + e2e.pages.Dashboard.Settings.Actions.close().click(); } else { e2e.components.BackButton.backArrow().click({ force: true }); } diff --git a/e2e/dashboards-suite/new-query-variable.spec.ts b/e2e/dashboards-suite/new-query-variable.spec.ts index 4ef03f29168..2dfc095d9bc 100644 --- a/e2e/dashboards-suite/new-query-variable.spec.ts +++ b/e2e/dashboards-suite/new-query-variable.spec.ts @@ -2,7 +2,6 @@ import { e2e } from '@grafana/e2e'; import { GrafanaBootConfig } from '@grafana/runtime'; const PAGE_UNDER_TEST = '-Y-tnEDWk/templating-nested-template-variables'; -const DASHBOARD_NAME = 'Templating - Nested Template Variables'; describe('Variables - Query - Add variable', () => { it('query variable should be default and default fields should be correct', () => { @@ -108,7 +107,7 @@ describe('Variables - Query - Add variable', () => { .window() .then((win: Cypress.AUTWindow & { grafanaBootData: GrafanaBootConfig['bootData'] }) => { if (win.grafanaBootData.settings.featureToggles.topnav) { - e2e.components.Breadcrumbs.breadcrumb(DASHBOARD_NAME).click(); + e2e.pages.Dashboard.Settings.Actions.close().click(); } else { e2e.components.BackButton.backArrow().click({ force: true }); } @@ -180,7 +179,7 @@ describe('Variables - Query - Add variable', () => { .window() .then((win: Cypress.AUTWindow & { grafanaBootData: GrafanaBootConfig['bootData'] }) => { if (win.grafanaBootData.settings.featureToggles.topnav) { - e2e.components.Breadcrumbs.breadcrumb(DASHBOARD_NAME).click(); + e2e.pages.Dashboard.Settings.Actions.close().click(); } else { e2e.components.BackButton.backArrow().click({ force: true }); } diff --git a/e2e/dashboards-suite/new-text-box-variable.spec.ts b/e2e/dashboards-suite/new-text-box-variable.spec.ts index 961cda55279..f07385729d2 100644 --- a/e2e/dashboards-suite/new-text-box-variable.spec.ts +++ b/e2e/dashboards-suite/new-text-box-variable.spec.ts @@ -2,7 +2,6 @@ import { e2e } from '@grafana/e2e'; import { GrafanaBootConfig } from '@grafana/runtime'; const PAGE_UNDER_TEST = 'kVi2Gex7z/test-variable-output'; -const DASHBOARD_NAME = 'Test variable output'; describe('Variables - Text box', () => { it('can add a new text box variable', () => { @@ -27,7 +26,7 @@ describe('Variables - Text box', () => { .window() .then((win: Cypress.AUTWindow & { grafanaBootData: GrafanaBootConfig['bootData'] }) => { if (win.grafanaBootData.settings.featureToggles.topnav) { - e2e.components.Breadcrumbs.breadcrumb(DASHBOARD_NAME).click(); + e2e.pages.Dashboard.Settings.Actions.close().click(); } else { e2e.components.BackButton.backArrow().click({ force: true }); } diff --git a/packages/grafana-e2e-selectors/src/selectors/pages.ts b/packages/grafana-e2e-selectors/src/selectors/pages.ts index 049f27156c7..2c6d33347da 100644 --- a/packages/grafana-e2e-selectors/src/selectors/pages.ts +++ b/packages/grafana-e2e-selectors/src/selectors/pages.ts @@ -67,6 +67,9 @@ export const Pages = { `data-testid Dashboard template variables Variable Value DropDown option text ${item}`, }, Settings: { + Actions: { + close: 'data-testid dashboard-settings-close', + }, General: { deleteDashBoard: 'Dashboard settings page delete dashboard button', sectionItems: (item: string) => `Dashboard settings section item ${item}`, diff --git a/packages/grafana-e2e/src/flows/configurePanel.ts b/packages/grafana-e2e/src/flows/configurePanel.ts index 0c98a89b8c7..15d7abd8b2d 100644 --- a/packages/grafana-e2e/src/flows/configurePanel.ts +++ b/packages/grafana-e2e/src/flows/configurePanel.ts @@ -91,12 +91,14 @@ export const configurePanel = (config: PartialAddPanelConfig | PartialEditPanelC e2e.components.Panels.Panel.headerItems('Edit').click(); } else { try { + e2e.components.PageToolbar.item('Add panel').should('be.visible'); e2e.components.PageToolbar.item('Add panel').click(); } catch (e) { // Depending on the screen size, the "Add panel" button might be hidden e2e.components.PageToolbar.item('Show more items').click(); e2e.components.PageToolbar.item('Add panel').last().click(); } + e2e.pages.AddDashboard.addNewPanel().should('be.visible'); e2e.pages.AddDashboard.addNewPanel().click(); } diff --git a/public/app/features/dashboard/components/DashboardSettings/DashboardSettings.tsx b/public/app/features/dashboard/components/DashboardSettings/DashboardSettings.tsx index b7fea50723d..f69223b37c9 100644 --- a/public/app/features/dashboard/components/DashboardSettings/DashboardSettings.tsx +++ b/public/app/features/dashboard/components/DashboardSettings/DashboardSettings.tsx @@ -3,6 +3,7 @@ import React, { useEffect, useMemo, useState } from 'react'; import { useLocation } from 'react-router-dom'; import { locationUtil, NavModel, NavModelItem } from '@grafana/data'; +import { selectors } from '@grafana/e2e-selectors'; import { locationService } from '@grafana/runtime'; import { Button, PageToolbar, ToolbarButtonRow } from '@grafana/ui'; import { AppChromeUpdate } from 'app/core/components/AppChrome/AppChromeUpdate'; @@ -59,7 +60,14 @@ export function DashboardSettings({ dashboard, editview, pageNav, sectionNav }: const actions = [ config.featureToggles.topnav && ( - ),