@grafana/e2e is a comprehensive end-to-end testing library for Grafana and its ecosystem, built on top of Cypress. It provides structured APIs for testing Grafana dashboards, data sources, panels, and administrative functions with pre-built selectors, flows, and scenarios tailored for Grafana's UI components and workflows.
Note: This package is deprecated. For new plugin development, use @grafana/plugin-e2e instead.
npm install @grafana/e2eimport { e2e } from "@grafana/e2e";CommonJS:
const { e2e } = require("@grafana/e2e");import { e2e } from "@grafana/e2e";
// Set up a test scenario
e2e.scenario({
describeName: "Dashboard Tests",
itName: "should create and delete dashboard",
scenario: () => {
// Login to Grafana
e2e.flows.login();
// Add a new dashboard
e2e.flows.addDashboard();
// Add a panel to the dashboard
e2e.flows.addPanel({
visualization: "Table",
panelTitle: "Test Panel"
});
// Save the dashboard
e2e.flows.saveDashboard();
// Clean up
e2e.flows.revertAllChanges();
}
});@grafana/e2e is built around several key components:
Core entry point providing Cypress integration and utility functions for test setup and execution.
interface E2EObject {
/** Access Cypress environment variables */
env(args: string): any;
/** Get Cypress configuration */
config(): Cypress.Config;
/** Convert blob to base64 string */
blobToBase64String(blob: Blob): Promise<string>;
/** Convert image source to blob */
imgSrcToBlob(url: string): Promise<Blob>;
/** Create e2e test scenarios */
scenario(args: ScenarioArguments): void;
/** Benchmark testing functionality */
benchmark: typeof benchmark;
/** Page object selectors */
pages: E2ESelectors;
/** Component selectors */
components: E2ESelectors;
/** Pre-built test flows */
flows: typeof flows;
/** Type definitions and utilities (internal use) */
typings: typeof typings;
/** Get current scenario context */
getScenarioContext(): ScenarioContext;
/** Set scenario context */
setScenarioContext(context: Partial<ScenarioContext>): void;
/** Generate selector factory */
getSelectors<T>(selectors: E2ESelectors<T>): E2ESelectors<T>;
}
/** Main e2e export - hybrid function and object */
const e2e: (() => Cypress.cy) & E2EObject;Structured test scenario creation with automatic setup, cleanup, and context management. Perfect for organizing complex test suites.
function e2eScenario(args: ScenarioArguments): void;
interface ScenarioArguments {
/** Test suite name */
describeName: string;
/** Test case name */
itName: string;
/** Test implementation function */
scenario: () => void;
/** Skip execution if true */
skipScenario?: boolean;
/** Auto-add data source for test */
addScenarioDataSource?: boolean;
/** Auto-add dashboard for test */
addScenarioDashBoard?: boolean;
/** Use API login instead of UI (default: true) */
loginViaApi?: boolean;
}Pre-built test flows for common Grafana operations including dashboard management, data source operations, panel configuration, and authentication.
/** Login via UI or API */
function login(username?: string, password?: string, loginViaApi?: boolean): void;
/** Create dashboard with configuration */
function addDashboard(config?: Partial<AddDashboardConfig>): void;
/** Delete dashboard via UI or API */
function deleteDashboard(config: DeleteDashboardConfig): void;
/** Add data source with configuration */
function addDataSource(config?: Partial<AddDataSourceConfig>): void;
/** Add new panel to dashboard */
function addPanel(config?: Partial<PartialAddPanelConfig>): void;
/** Edit existing panel */
function editPanel(config: Partial<PartialEditPanelConfig>): void;Performance benchmark testing for measuring Grafana operation performance and collecting application statistics.
function benchmark(args: BenchmarkArguments): void;
interface BenchmarkArguments {
/** Benchmark name */
name: string;
/** Dashboard configuration */
dashboard: {
folder: string;
delayAfterOpening: number;
skipPanelValidation: boolean;
};
/** Number of iterations */
repeat: number;
/** Duration per test */
duration: number;
/** App statistics collection */
appStats?: {
startCollecting?(window: Window): void;
collect(window: Window): Record<string, unknown>;
};
/** Skip execution if true */
skipScenario?: boolean;
}CSS selector utilities for creating robust element selectors for Grafana's UI components.
interface Selector {
/** Create aria-label selector */
fromAriaLabel(selector: string): string;
/** Create data-testid selector */
fromDataTestId(selector: string): string;
/** Pass-through selector */
fromSelector(selector: string): string;
}interface ScenarioContext {
/** Dashboards to clean up */
addedDashboards: DeleteDashboardConfig[];
/** Data sources to clean up */
addedDataSources: DeleteDataSourceConfig[];
/** Last dashboard title */
lastAddedDashboard: string;
/** Last dashboard UID */
lastAddedDashboardUid: string;
/** Last data source name */
lastAddedDataSource: string;
/** Last data source ID */
lastAddedDataSourceId: string;
/** Preferences change flag */
hasChangedUserPreferences: boolean;
}
interface DeleteDashboardConfig {
title?: string;
uid?: string;
quick?: boolean;
}
interface DeleteDataSourceConfig {
/** Data source name */
name?: string;
/** Data source ID */
id?: string;
/** Use quick delete (skip confirmation) */
quick?: boolean;
}
interface E2ESelectors<T = any> {
[key: string]: string | E2ESelectors<any>;
}