grafana/e2e-playwright/dashboard-new-layouts/dashboards-edit-panel-title...

62 lines
2.1 KiB
TypeScript

import { test, expect } from '@grafana/plugin-e2e';
import { flows } from './utils';
test.use({
featureToggles: {
kubernetesDashboards: true,
dashboardNewLayouts: true,
dashboardUndoRedo: true,
groupByVariable: true,
},
});
const PAGE_UNDER_TEST = '5SdHCadmz/panel-tests-graph';
test.describe(
'Dashboard',
{
tag: ['@dashboards'],
},
() => {
test('can edit panel title and description', async ({ gotoDashboardPage, selectors, page }) => {
const dashboardPage = await gotoDashboardPage({ uid: PAGE_UNDER_TEST });
await dashboardPage.getByGrafanaSelector(selectors.components.NavToolbar.editDashboard.editButton).click();
const oldTitle = 'No Data Points Warning';
const firstPanelTitle = dashboardPage
.getByGrafanaSelector(selectors.components.Panels.Panel.headerContainer)
.first()
.locator('h2')
.first();
await expect(firstPanelTitle).toHaveText(oldTitle);
const newDescription = 'A description of this panel';
await flows.changePanelDescription(dashboardPage, selectors, oldTitle, newDescription);
const newTitle = 'New Panel Title';
await flows.changePanelTitle(dashboardPage, selectors, oldTitle, newTitle);
// Check that new title is reflected in panel header
const updatedPanelTitle = dashboardPage
.getByGrafanaSelector(selectors.components.Panels.Panel.headerContainer)
.first()
.locator('h2')
.first();
await expect(updatedPanelTitle).toHaveText(newTitle);
// Reveal description tooltip and check that its value is as expected
const descriptionIcon = page.locator('[data-testid="title-items-container"] > span').first();
await descriptionIcon.click({ force: true });
// Get the tooltip ID from the aria-describedby attribute
const tooltipId = await descriptionIcon.getAttribute('aria-describedby');
await expect(async () => {
const tooltip = page.locator(`[id="${tooltipId}"]`);
await expect(tooltip).toHaveText(`${newDescription}\n`);
}).toPass();
});
}
);