diff --git a/.betterer.results b/.betterer.results index d9d3f63aeb8..d5e479c07ba 100644 --- a/.betterer.results +++ b/.betterer.results @@ -422,6 +422,9 @@ exports[`better eslint`] = { "packages/grafana-data/test/__mocks__/pluginMocks.ts:5381": [ [0, 0, 0, "Unexpected any. Specify a different type.", "0"] ], + "packages/grafana-e2e-selectors/src/resolver.ts:5381": [ + [0, 0, 0, "Do not use any type assertions.", "0"] + ], "packages/grafana-o11y-ds-frontend/src/utils.ts:5381": [ [0, 0, 0, "Do not use any type assertions.", "0"] ], diff --git a/packages/grafana-e2e-selectors/package.json b/packages/grafana-e2e-selectors/package.json index 6d70f95cfe6..afaacce039d 100644 --- a/packages/grafana-e2e-selectors/package.json +++ b/packages/grafana-e2e-selectors/package.json @@ -41,6 +41,7 @@ "devDependencies": { "@rollup/plugin-node-resolve": "15.3.0", "@types/node": "20.16.15", + "@types/semver": "7.5.8", "esbuild": "0.24.0", "rimraf": "6.0.1", "rollup": "^4.22.4", @@ -50,6 +51,7 @@ }, "dependencies": { "@grafana/tsconfig": "^2.0.0", + "semver": "7.6.3", "tslib": "2.7.0", "typescript": "5.5.4" } diff --git a/packages/grafana-e2e-selectors/src/index.ts b/packages/grafana-e2e-selectors/src/index.ts index 8c17fa0afdf..32b22b5bb52 100644 --- a/packages/grafana-e2e-selectors/src/index.ts +++ b/packages/grafana-e2e-selectors/src/index.ts @@ -5,3 +5,4 @@ */ export * from './selectors'; export * from './types'; +export { resolveSelectors } from './resolver'; diff --git a/packages/grafana-e2e-selectors/src/resolver.test.ts b/packages/grafana-e2e-selectors/src/resolver.test.ts new file mode 100644 index 00000000000..fe294800416 --- /dev/null +++ b/packages/grafana-e2e-selectors/src/resolver.test.ts @@ -0,0 +1,68 @@ +import { resolveSelectors } from './resolver'; +import { versionedComponents } from './selectors/components'; +import { versionedPages } from './selectors/pages'; + +describe('Resolver', () => { + it('should resolve latest when no version is provided', () => { + const pages = resolveSelectors(versionedPages); + const components = resolveSelectors(versionedComponents); + expect(components.CodeEditor.container).toBe('data-testid Code editor container'); + expect(components.TimePicker.calendar.closeButton).toBe('data-testid Close time range Calendar'); + expect(components.Panels.Panel.status('Test')).toBe('data-testid Panel status Test'); + expect(components.PanelEditor.OptionsPane.fieldInput('Test')).toBe( + 'data-testid Panel editor option pane field input Test' + ); + expect(pages.Alerting.AddAlertRule.url).toBe('/alerting/new/alerting'); + expect(pages.AddDashboard.Settings.Variables.Edit.url('test')).toBe( + '/dashboard/new?orgId=1&editview=templating&editIndex=test' + ); + }); + + it('should resolve right selector versions when an older grafana version is provided', () => { + const pages = resolveSelectors(versionedPages, '10.0.14'); + const components = resolveSelectors(versionedComponents, '10.0.14'); + expect(components.CodeEditor.container).toBe('Code editor container'); + expect(components.TimePicker.calendar.closeButton).toBe('Close time range Calendar'); + expect(components.Panels.Panel.status('')).toBe('Panel status'); + expect(components.PanelEditor.OptionsPane.fieldInput('Test')).toBe( + 'data-testid Panel editor option pane field input Test' + ); + expect(pages.Alerting.AddAlertRule.url).toBe('/alerting/new'); + expect(pages.AddDashboard.Settings.Variables.Edit.url('test')).toBe( + '/dashboard/new?orgId=1&editview=templating&editIndex=test' + ); + }); + + it('should resolve the most recent selector version when a newer grafana version is provided', () => { + const pages = resolveSelectors( + { + Alerting: { + AddAlertRule: { + url: { + '11.4.0': '/alerting/new', + '11.1.0': '/alerting/old', + '9.0.15': '/alerting/new/alerting', + }, + }, + }, + }, + '25.1.0' + ); + expect(pages.Alerting.AddAlertRule.url).toBe('/alerting/new'); + }); + + it('should throw error if an invalid semver range is used in versioned selector', () => { + expect(() => + resolveSelectors({ + Alerting: { + AddAlertRule: { + url: { + abc: '/alerting/new', + '9.0.15': '/alerting/new/alerting', + }, + }, + }, + }) + ).toThrow(new Error("Invalid semver version: 'abc'")); + }); +}); diff --git a/packages/grafana-e2e-selectors/src/resolver.ts b/packages/grafana-e2e-selectors/src/resolver.ts new file mode 100644 index 00000000000..a1cd359a41f --- /dev/null +++ b/packages/grafana-e2e-selectors/src/resolver.ts @@ -0,0 +1,81 @@ +import { gte, compare, valid } from 'semver'; + +import { + FunctionSelector, + Selectors, + SelectorsOf, + StringSelector, + VersionedSelectorGroup, + VersionedSelectors, + CssSelector, + UrlSelector, + FunctionSelectorTwoArgs, +} from './types'; + +/** + * Resolves selectors based on the Grafana version + */ +export function resolveSelectors( + versionedSelectors: T, + grafanaVersion = 'latest' +): SelectorsOf { + const version = grafanaVersion.replace(/\-.*/, ''); + + return resolveSelectorGroup(versionedSelectors, version); +} + +function resolveSelectorGroup(group: T, grafanaVersion: string): SelectorsOf { + const result: Selectors = {}; + + for (const [key, value] of Object.entries(group)) { + if (isVersionedSelectorGroup(value)) { + result[key] = resolveSelectorGroup(value, grafanaVersion); + } else { + assertIsSemverValid(value, key); + result[key] = resolveSelector(value, grafanaVersion); + } + } + + return result as SelectorsOf; +} + +function isVersionedSelectorGroup( + target: VersionedSelectors | VersionedSelectorGroup +): target is VersionedSelectorGroup { + if (typeof target === 'object') { + const [first] = Object.keys(target); + return !valid(first); + } + + return false; +} + +function resolveSelector( + versionedSelector: VersionedSelectors, + grafanaVersion: string +): StringSelector | FunctionSelector | FunctionSelectorTwoArgs | CssSelector | UrlSelector { + let versionToUse; + let versions = Object.keys(versionedSelector).sort(compare); + + if (grafanaVersion === 'latest') { + return versionedSelector[versions[versions.length - 1]]; + } + + for (const version of versions) { + if (gte(grafanaVersion, version)) { + versionToUse = version; + } + } + + if (!versionToUse) { + versionToUse = versions[versions.length - 1]; + } + + return versionedSelector[versionToUse]; +} + +function assertIsSemverValid(versionedSelector: VersionedSelectors, selectorName: string) { + if (!Object.keys(versionedSelector).every((version) => valid(version))) { + throw new Error(`Invalid semver version: '${selectorName}'`); + } +} diff --git a/packages/grafana-e2e-selectors/src/selectors/README.md b/packages/grafana-e2e-selectors/src/selectors/README.md new file mode 100644 index 00000000000..35ceebd326d --- /dev/null +++ b/packages/grafana-e2e-selectors/src/selectors/README.md @@ -0,0 +1,38 @@ +# Versioned selectors + +The selectors defined in [pages.ts](./pages.ts) and [components.ts](./components.ts) are versioned. A versioned selector consists of an object literal where value is the selector context and key is the minimum Grafana version for which the value is valid. The versioning is important in plugin end-to-end testing, as it allows them to resolve the right selector values for a given Grafana version. + +```typescript +const components = { + PanelEditor: { + content: { + '11.1.0': 'data-testid Panel editor content', // resolved for Grafana >= 11.1.0 + '9.5.0': 'Panel editor content', // resolved for Grafana >= 9.5.0 <11.1.0 + }, + } + ... +} +``` + +A few things to keep in mind: + +- Strive to use e2e selector for all components in grafana/ui. +- Only create new selector in case you're creating a new piece of UI. If you're changing an existing piece of UI that already has a selector defined, you need to keep using that selector. Otherwise you might break plugin end-to-end tests. +- Prefer using string selectors in favour of function selectors. The purpose of the selectors is to provide a canonical way to select elements. + `pages.Dashboard.url('ud73s9')` is fine. + `components.Panels.Panel.title('Panel header')` is bad. + +## How to change the value of an existing selector + +1. Find the versioned selector object in [pages.ts](./pages.ts) or [components.ts](./components.ts). +2. Add a new key representing the minimum Grafana version. The version you specify should correspond to the version of Grafana where your changes will be released. In most cases, you can check the version specified in package.json of the main branch (`git show main:package.json | awk -F'"' '/"version": ".+"/{ print $4; exit; }'`), but if you know in advance that your change will be backported you can specify the version of the release with the lowest version number. The version you specify should not include tags such as `-pre` or build number. +3. Add a value for the selector. Remember that the selector needs to be backwards compatible, so you cannot change its signature. + +## How to add a new selector + +> [!CAUTION] +> If you're changing a part of the UI that already has a selector defined, you should reuse the existing selector to avoid breaking end-to-end tests in plugins. + +1. Add a new versioned selector object under an existing or new group in [pages.ts](./pages.ts) or [components.ts](./components.ts). +2. Add a new key representing the minimum Grafana version. The version you specify should correspond to the version of Grafana where this change will be released. You can check the version specified in package.json of the main branch (`git show main:package.json | awk -F'"' '/"version": ".+"/{ print $4; exit; }'`). The version you specify should not include tags such as `-pre` or build number. +3. Add a value for the selector. Prefer using string selectors as function selectors such as `selectors.components.Panels.Panel.title('Header')` require context awareness which makes them hard to use in end-to-end tests. diff --git a/packages/grafana-e2e-selectors/src/selectors/components.ts b/packages/grafana-e2e-selectors/src/selectors/components.ts index ddb683bf22c..df1f0b33333 100644 --- a/packages/grafana-e2e-selectors/src/selectors/components.ts +++ b/packages/grafana-e2e-selectors/src/selectors/components.ts @@ -4,609 +4,1233 @@ // but you still might need to select it for testing, // in that case please add the attribute data-testid={selector} in the component and // prefix your selector string with 'data-testid' so that when create the selectors we know to search for it on the right attribute + +import { VersionedSelectorGroup } from '../types'; + +import { MIN_GRAFANA_VERSION } from './constants'; + /** * Selectors grouped/defined in Components - * - * @alpha */ -export const Components = { +export const versionedComponents = { RadioButton: { - container: 'data-testid radio-button', + container: { + '10.2.3': 'data-testid radio-button', + }, }, Breadcrumbs: { - breadcrumb: (title: string) => `data-testid ${title} breadcrumb`, + breadcrumb: { + '9.4.0': (title: string) => `data-testid ${title} breadcrumb`, + }, }, TimePicker: { - openButton: 'data-testid TimePicker Open Button', - overlayContent: 'data-testid TimePicker Overlay Content', - fromField: 'data-testid Time Range from field', - toField: 'data-testid Time Range to field', - applyTimeRange: 'data-testid TimePicker submit button', - copyTimeRange: 'data-testid TimePicker copy button', - pasteTimeRange: 'data-testid TimePicker paste button', - calendar: { - label: 'data-testid Time Range calendar', - openButton: 'data-testid Open time range calendar', - closeButton: 'data-testid Close time range Calendar', + openButton: { + [MIN_GRAFANA_VERSION]: 'data-testid TimePicker Open Button', + }, + overlayContent: { + '10.2.3': 'data-testid TimePicker Overlay Content', + }, + fromField: { + '10.2.3': 'data-testid Time Range from field', + [MIN_GRAFANA_VERSION]: 'Time Range from field', + }, + toField: { + '10.2.3': 'data-testid Time Range to field', + [MIN_GRAFANA_VERSION]: 'Time Range to field', + }, + applyTimeRange: { + [MIN_GRAFANA_VERSION]: 'data-testid TimePicker submit button', + }, + copyTimeRange: { + '10.4.0': 'data-testid TimePicker copy button', + }, + pasteTimeRange: { + '10.4.0': 'data-testid TimePicker paste button', + }, + calendar: { + label: { + '10.2.3': 'data-testid Time Range calendar', + [MIN_GRAFANA_VERSION]: 'Time Range calendar', + }, + openButton: { + '10.2.3': 'data-testid Open time range calendar', + [MIN_GRAFANA_VERSION]: 'Open time range calendar', + }, + closeButton: { + '10.2.3': 'data-testid Close time range Calendar', + [MIN_GRAFANA_VERSION]: 'Close time range Calendar', + }, + }, + absoluteTimeRangeTitle: { + [MIN_GRAFANA_VERSION]: 'data-testid-absolute-time-range-narrow', }, - absoluteTimeRangeTitle: 'data-testid-absolute-time-range-narrow', }, DataSourcePermissions: { - form: () => 'form[name="addPermission"]', - roleType: 'Role to add new permission to', - rolePicker: 'Built-in role picker', - permissionLevel: 'Permission Level', + form: { '9.5.0': () => 'form[name="addPermission"]' }, + roleType: { + '9.5.0': 'Role to add new permission to', + }, + rolePicker: { + '9.5.0': 'Built-in role picker', + }, + permissionLevel: { + '9.5.0': 'Permission Level', + }, }, DateTimePicker: { - input: 'data-testid date-time-input', + input: { + '10.2.3': 'data-testid date-time-input', + }, }, DataSource: { TestData: { QueryTab: { - scenarioSelectContainer: 'Test Data Query scenario select container', - scenarioSelect: 'Test Data Query scenario select', - max: 'TestData max', - min: 'TestData min', - noise: 'TestData noise', - seriesCount: 'TestData series count', - spread: 'TestData spread', - startValue: 'TestData start value', - drop: 'TestData drop values', + scenarioSelectContainer: { + [MIN_GRAFANA_VERSION]: 'Test Data Query scenario select container', + }, + scenarioSelect: { + [MIN_GRAFANA_VERSION]: 'Test Data Query scenario select', + }, + max: { + [MIN_GRAFANA_VERSION]: 'TestData max', + }, + min: { + [MIN_GRAFANA_VERSION]: 'TestData min', + }, + noise: { + [MIN_GRAFANA_VERSION]: 'TestData noise', + }, + seriesCount: { + [MIN_GRAFANA_VERSION]: 'TestData series count', + }, + spread: { + [MIN_GRAFANA_VERSION]: 'TestData spread', + }, + startValue: { + [MIN_GRAFANA_VERSION]: 'TestData start value', + }, + drop: { + [MIN_GRAFANA_VERSION]: 'TestData drop values', + }, }, }, DataSourceHttpSettings: { - urlInput: 'data-testid Datasource HTTP settings url', + urlInput: { + '10.4.0': 'data-testid Datasource HTTP settings url', + [MIN_GRAFANA_VERSION]: 'Datasource HTTP settings url', + }, }, Jaeger: { - traceIDInput: 'Trace ID', + traceIDInput: { + [MIN_GRAFANA_VERSION]: 'Trace ID', + }, }, Prometheus: { configPage: { - connectionSettings: 'Data source connection URL', // aria-label in grafana experimental - manageAlerts: 'prometheus-alerts-manager', // id for switch component - scrapeInterval: 'data-testid scrape interval', - queryTimeout: 'data-testid query timeout', - defaultEditor: 'data-testid default editor', - disableMetricLookup: 'disable-metric-lookup', // id for switch component - prometheusType: 'data-testid prometheus type', - prometheusVersion: 'data-testid prometheus version', - cacheLevel: 'data-testid cache level', - incrementalQuerying: 'prometheus-incremental-querying', // id for switch component - queryOverlapWindow: 'data-testid query overlap window', - disableRecordingRules: 'disable-recording-rules', // id for switch component - customQueryParameters: 'data-testid custom query parameters', - httpMethod: 'data-testid http method', - exemplarsAddButton: 'data-testid Add exemplar config button', - internalLinkSwitch: 'data-testid Internal link switch', - codeModeMetricNamesSuggestionLimit: 'data-testid code mode metric names suggestion limit', + connectionSettings: { + [MIN_GRAFANA_VERSION]: 'Data source connection URL', // aria-label in grafana experimental + }, + manageAlerts: { + '10.4.0': 'prometheus-alerts-manager', // id for switch component + }, + scrapeInterval: { + '10.4.0': 'data-testid scrape interval', + }, + queryTimeout: { + '10.4.0': 'data-testid query timeout', + }, + defaultEditor: { + '10.4.0': 'data-testid default editor', + }, + disableMetricLookup: { + '10.4.0': 'disable-metric-lookup', // id for switch component + }, + prometheusType: { + '10.4.0': 'data-testid prometheus type', + }, + prometheusVersion: { + '10.4.0': 'data-testid prometheus version', + }, + cacheLevel: { + '10.4.0': 'data-testid cache level', + }, + incrementalQuerying: { + '10.4.0': 'prometheus-incremental-querying', // id for switch component + }, + queryOverlapWindow: { + '10.4.0': 'data-testid query overlap window', + }, + disableRecordingRules: { + '10.4.0': 'disable-recording-rules', // id for switch component + }, + customQueryParameters: { + '10.4.0': 'data-testid custom query parameters', + }, + httpMethod: { + '10.4.0': 'data-testid http method', + }, + exemplarsAddButton: { + '10.3.0': 'data-testid Add exemplar config button', + [MIN_GRAFANA_VERSION]: 'Add exemplar config button', + }, + internalLinkSwitch: { + '10.3.0': 'data-testid Internal link switch', + [MIN_GRAFANA_VERSION]: 'Internal link switch', + }, + codeModeMetricNamesSuggestionLimit: { + '11.1.0': 'data-testid code mode metric names suggestion limit', + }, }, queryEditor: { // kickstart: '', see QueryBuilder queryPatterns below - explain: 'data-testid prometheus explain switch wrapper', - editorToggle: 'data-testid QueryEditorModeToggle', // wrapper for toggle - options: 'data-testid prometheus options', // wrapper for options group - legend: 'data-testid prometheus legend wrapper', // wrapper for multiple compomnents - format: 'data-testid prometheus format', - step: 'prometheus-step', // id for autosize component - type: 'data-testid prometheus type', //wrapper for radio button group - exemplars: 'prometheus-exemplars', // id for editor switch component + explain: { + '10.4.0': 'data-testid prometheus explain switch wrapper', + }, + editorToggle: { + '10.4.0': 'data-testid QueryEditorModeToggle', // wrapper for toggle + }, + options: { + '10.4.0': 'data-testid prometheus options', // wrapper for options group + }, + legend: { + '10.4.0': 'data-testid prometheus legend wrapper', // wrapper for multiple compomnents + }, + format: { + '10.4.0': 'data-testid prometheus format', + }, + step: { + '10.4.0': 'prometheus-step', // id for autosize component + }, + type: { + '10.4.0': 'data-testid prometheus type', //wrapper for radio button group + }, + exemplars: { + '10.4.0': 'prometheus-exemplars', // id for editor switch component + }, builder: { // see QueryBuilder below for commented selectors // labelSelect: 'data-testid Select label', // valueSelect: 'data-testid Select value', // matchOperatorSelect: 'data-testid Select match operator', - metricSelect: 'data-testid metric select', - hints: 'data-testid prometheus hints', // wrapper for hints component - metricsExplorer: 'data-testid metrics explorer', - queryAdvisor: 'data-testid query advisor', + metricSelect: { + '10.4.0': 'data-testid metric select', + }, + hints: { + '10.4.0': 'data-testid prometheus hints', // wrapper for hints component + }, + metricsExplorer: { + '10.4.0': 'data-testid metrics explorer', + }, + queryAdvisor: { + '10.4.0': 'data-testid query advisor', + }, }, code: { - queryField: 'data-testid prometheus query field', - metricsCountInfo: 'data-testid metrics count disclaimer', + queryField: { + '10.4.0': 'data-testid prometheus query field', + }, + metricsCountInfo: { + '11.1.0': 'data-testid metrics count disclaimer', + }, metricsBrowser: { - openButton: 'data-testid open metrics browser', - selectMetric: 'data-testid select a metric', - seriesLimit: 'data-testid series limit', - metricList: 'data-testid metric list', - labelNamesFilter: 'data-testid label names filter', - labelValuesFilter: 'data-testid label values filter', - useQuery: 'data-testid use query', - useAsRateQuery: 'data-testid use as rate query', - validateSelector: 'data-testid validate selector', - clear: 'data-testid clear', + openButton: { + '10.4.0': 'data-testid open metrics browser', + }, + selectMetric: { + '10.4.0': 'data-testid select a metric', + }, + seriesLimit: { + '10.3.1': 'data-testid series limit', + }, + metricList: { + '10.4.0': 'data-testid metric list', + }, + labelNamesFilter: { + '10.4.0': 'data-testid label names filter', + }, + labelValuesFilter: { + '10.4.0': 'data-testid label values filter', + }, + useQuery: { + '10.4.0': 'data-testid use query', + }, + useAsRateQuery: { + '10.4.0': 'data-testid use as rate query', + }, + validateSelector: { + '10.4.0': 'data-testid validate selector', + }, + clear: { + '10.4.0': 'data-testid clear', + }, }, }, }, - exemplarMarker: 'data-testid Exemplar marker', + exemplarMarker: { + '10.3.0': 'data-testid Exemplar marker', + [MIN_GRAFANA_VERSION]: 'Exemplar marker', + }, variableQueryEditor: { - queryType: 'data-testid query type', + queryType: { + '10.4.0': 'data-testid query type', + }, labelnames: { - metricRegex: 'data-testid label names metric regex', + metricRegex: { + '10.4.0': 'data-testid label names metric regex', + }, }, labelValues: { - labelSelect: 'data-testid label values label select', + labelSelect: { + '10.4.0': 'data-testid label values label select', + }, // metric select see queryEditor: builder for more context // label select for metric filtering see queryEditor: builder for more context }, metricNames: { - metricRegex: 'data-testid metric names metric regex', + metricRegex: { + '10.4.0': 'data-testid metric names metric regex', + }, + }, + varQueryResult: { + '10.4.0': 'data-testid variable query result', + }, + seriesQuery: { + '10.4.0': 'data-testid prometheus series query', + }, + classicQuery: { + '10.4.0': 'data-testid prometheus classic query', }, - varQueryResult: 'data-testid variable query result', - seriesQuery: 'data-testid prometheus series query', - classicQuery: 'data-testid prometheus classic query', }, annotations: { - minStep: 'prometheus-annotation-min-step', // id for autosize input - title: 'data-testid prometheus annotation title', - tags: 'data-testid prometheus annotation tags', - text: 'data-testid prometheus annotation text', - seriesValueAsTimestamp: 'data-testid prometheus annotation series value as timestamp', + minStep: { + '10.4.0': 'prometheus-annotation-min-step', // id for autosize input + }, + title: { + '10.4.0': 'data-testid prometheus annotation title', + }, + tags: { + '10.4.0': 'data-testid prometheus annotation tags', + }, + text: { + '10.4.0': 'data-testid prometheus annotation text', + }, + seriesValueAsTimestamp: { + '10.4.0': 'data-testid prometheus annotation series value as timestamp', + }, }, }, }, Menu: { - MenuComponent: (title: string) => `${title} menu`, - MenuGroup: (title: string) => `${title} menu group`, - MenuItem: (title: string) => `${title} menu item`, + MenuComponent: { + [MIN_GRAFANA_VERSION]: (title: string) => `${title} menu`, + }, + MenuGroup: { + [MIN_GRAFANA_VERSION]: (title: string) => `${title} menu group`, + }, + MenuItem: { + [MIN_GRAFANA_VERSION]: (title: string) => `${title} menu item`, + }, SubMenu: { - container: 'data-testid SubMenu container', - icon: 'data-testid SubMenu icon', + container: { + '10.3.0': 'data-testid SubMenu container', + [MIN_GRAFANA_VERSION]: 'SubMenu container', + }, + icon: { + '10.3.0': 'data-testid SubMenu icon', + [MIN_GRAFANA_VERSION]: 'SubMenu icon', + }, }, }, Panels: { Panel: { - title: (title: string) => `data-testid Panel header ${title}`, - content: 'data-testid panel content', - headerItems: (item: string) => `data-testid Panel header item ${item}`, - menuItems: (item: string) => `data-testid Panel menu item ${item}`, - menu: (title: string) => `data-testid Panel menu ${title}`, - containerByTitle: (title: string) => `${title} panel`, - headerCornerInfo: (mode: string) => `Panel header ${mode}`, - status: (status: string) => `data-testid Panel status ${status}`, - loadingBar: () => `Panel loading bar`, - HoverWidget: { - container: 'data-testid hover-header-container', - dragIcon: 'data-testid drag-icon', + title: { + [MIN_GRAFANA_VERSION]: (title: string) => `data-testid Panel header ${title}`, + }, + content: { + '11.1.0': 'data-testid panel content', + }, + headerItems: { + '10.2.0': (item: string) => `data-testid Panel header item ${item}`, + }, + menuItems: { + '9.5.0': (item: string) => `data-testid Panel menu item ${item}`, + }, + menu: { + '9.5.0': (title: string) => `data-testid Panel menu ${title}`, + }, + containerByTitle: { + [MIN_GRAFANA_VERSION]: (title: string) => `${title} panel`, + }, + headerCornerInfo: { + [MIN_GRAFANA_VERSION]: (mode: string) => `Panel header ${mode}`, + }, + status: { + '10.2.0': (status: string) => `data-testid Panel status ${status}`, + [MIN_GRAFANA_VERSION]: (_: string) => 'Panel status', + }, + loadingBar: { + '10.0.0': () => `Panel loading bar`, + }, + HoverWidget: { + container: { + '10.1.0': 'data-testid hover-header-container', + [MIN_GRAFANA_VERSION]: 'hover-header-container', + }, + dragIcon: { + '10.0.0': 'data-testid drag-icon', + }, + }, + PanelDataErrorMessage: { + '10.4.0': 'data-testid Panel data error message', }, - PanelDataErrorMessage: 'data-testid Panel data error message', }, Visualization: { Graph: { - container: 'Graph container', + container: { + '9.5.0': 'Graph container', + }, VisualizationTab: { - legendSection: 'Legend section', + legendSection: { + [MIN_GRAFANA_VERSION]: 'Legend section', + }, }, Legend: { - legendItemAlias: (name: string) => `gpl alias ${name}`, - showLegendSwitch: 'gpl show legend', + legendItemAlias: { + [MIN_GRAFANA_VERSION]: (name: string) => `gpl alias ${name}`, + }, + showLegendSwitch: { + [MIN_GRAFANA_VERSION]: 'gpl show legend', + }, }, xAxis: { - labels: () => 'div.flot-x-axis > div.flot-tick-label', + labels: { + [MIN_GRAFANA_VERSION]: () => 'div.flot-x-axis > div.flot-tick-label', + }, }, }, BarGauge: { - /** - * @deprecated use valueV2 from Grafana 8.3 instead - */ - value: 'Bar gauge value', - valueV2: 'data-testid Bar gauge value', + valueV2: { + [MIN_GRAFANA_VERSION]: 'data-testid Bar gauge value', + }, }, PieChart: { - svgSlice: 'data testid Pie Chart Slice', + svgSlice: { + '10.3.0': 'data testid Pie Chart Slice', + }, }, Text: { - container: () => '.markdown-html', + container: { [MIN_GRAFANA_VERSION]: () => '.markdown-html' }, }, Table: { - header: 'table header', - footer: 'table-footer', - body: 'data-testid table body', + header: { + [MIN_GRAFANA_VERSION]: 'table header', + }, + footer: { + [MIN_GRAFANA_VERSION]: 'table-footer', + }, + body: { + '10.2.0': 'data-testid table body', + }, }, }, }, VizLegend: { - seriesName: (name: string) => `data-testid VizLegend series ${name}`, + seriesName: { + '10.3.0': (name: string) => `data-testid VizLegend series ${name}`, + }, }, Drawer: { General: { - title: (title: string) => `Drawer title ${title}`, - expand: 'Drawer expand', - contract: 'Drawer contract', - close: 'data-testid Drawer close', - rcContentWrapper: () => '.rc-drawer-content-wrapper', - subtitle: 'data-testid drawer subtitle', + title: { + [MIN_GRAFANA_VERSION]: (title: string) => `Drawer title ${title}`, + }, + expand: { + [MIN_GRAFANA_VERSION]: 'Drawer expand', + }, + contract: { + [MIN_GRAFANA_VERSION]: 'Drawer contract', + }, + close: { + '10.3.0': 'data-testid Drawer close', + [MIN_GRAFANA_VERSION]: 'Drawer close', + }, + rcContentWrapper: { '9.4.0': () => '.rc-drawer-content-wrapper' }, + subtitle: { + '10.4.0': 'data-testid drawer subtitle', + }, }, DashboardSaveDrawer: { - saveButton: 'data-testid Save dashboard drawer button', - saveAsButton: 'data-testid Save as dashboard drawer button', - saveAsTitleInput: 'Save dashboard title field', + saveButton: { + '11.1.0': 'data-testid Save dashboard drawer button', + }, + saveAsButton: { + '11.1.0': 'data-testid Save as dashboard drawer button', + }, + saveAsTitleInput: { + '11.1.0': 'Save dashboard title field', + }, }, }, PanelEditor: { General: { - content: 'data-testid Panel editor content', + content: { + '11.1.0': 'data-testid Panel editor content', + [MIN_GRAFANA_VERSION]: 'Panel editor content', + }, }, OptionsPane: { - content: 'data-testid Panel editor option pane content', - select: 'Panel editor option pane select', - fieldLabel: (type: string) => `${type} field property editor`, - fieldInput: (title: string) => `data-testid Panel editor option pane field input ${title}`, + content: { + '11.1.0': 'data-testid Panel editor option pane content', + [MIN_GRAFANA_VERSION]: 'Panel editor option pane content', + }, + select: { + [MIN_GRAFANA_VERSION]: 'Panel editor option pane select', + }, + fieldLabel: { + [MIN_GRAFANA_VERSION]: (type: string) => `${type} field property editor`, + }, + fieldInput: { + '11.0.0': (title: string) => `data-testid Panel editor option pane field input ${title}`, + }, }, // not sure about the naming *DataPane* DataPane: { - content: 'data-testid Panel editor data pane content', + content: { + '11.1.0': 'data-testid Panel editor data pane content', + [MIN_GRAFANA_VERSION]: 'Panel editor data pane content', + }, + }, + applyButton: { + '9.2.0': 'data-testid Apply changes and go back to dashboard', + }, + toggleVizPicker: { + '10.0.0': 'data-testid toggle-viz-picker', + [MIN_GRAFANA_VERSION]: 'toggle-viz-picker', + }, + toggleVizOptions: { + '10.1.0': 'data-testid toggle-viz-options', + [MIN_GRAFANA_VERSION]: 'toggle-viz-options', + }, + toggleTableView: { + '11.1.0': 'data-testid toggle-table-view', + [MIN_GRAFANA_VERSION]: 'toggle-table-view', }, - applyButton: 'data-testid Apply changes and go back to dashboard', - toggleVizPicker: 'data-testid toggle-viz-picker', - toggleVizOptions: 'data-testid toggle-viz-options', - toggleTableView: 'data-testid toggle-table-view', // [Geomap] Map controls - showZoomField: 'Map controls Show zoom control field property editor', - showAttributionField: 'Map controls Show attribution field property editor', - showScaleField: 'Map controls Show scale field property editor', - showMeasureField: 'Map controls Show measure tools field property editor', - showDebugField: 'Map controls Show debug field property editor', + showZoomField: { + '10.2.0': 'Map controls Show zoom control field property editor', + }, + showAttributionField: { + '10.2.0': 'Map controls Show attribution field property editor', + }, + showScaleField: { + '10.2.0': 'Map controls Show scale field property editor', + }, + showMeasureField: { + '10.2.0': 'Map controls Show measure tools field property editor', + }, + showDebugField: { + '10.2.0': 'Map controls Show debug field property editor', + }, - measureButton: 'show measure tools', + measureButton: { + '9.2.0': 'show measure tools', + }, }, PanelInspector: { Data: { - content: 'Panel inspector Data content', + content: { + [MIN_GRAFANA_VERSION]: 'Panel inspector Data content', + }, }, Stats: { - content: 'Panel inspector Stats content', + content: { + [MIN_GRAFANA_VERSION]: 'Panel inspector Stats content', + }, }, Json: { - content: 'data-testid Panel inspector Json content', + content: { + '11.1.0': 'data-testid Panel inspector Json content', + [MIN_GRAFANA_VERSION]: 'Panel inspector Json content', + }, }, Query: { - content: 'Panel inspector Query content', - refreshButton: 'Panel inspector Query refresh button', - jsonObjectKeys: () => '.json-formatter-key', + content: { + [MIN_GRAFANA_VERSION]: 'Panel inspector Query content', + }, + refreshButton: { + [MIN_GRAFANA_VERSION]: 'Panel inspector Query refresh button', + }, + jsonObjectKeys: { + [MIN_GRAFANA_VERSION]: () => '.json-formatter-key', + }, }, }, Tab: { - title: (title: string) => `data-testid Tab ${title}`, - active: () => '[class*="-activeTabStyle"]', + title: { + '11.2.0': (title: string) => `data-testid Tab ${title}`, + }, + active: { [MIN_GRAFANA_VERSION]: () => '[class*="-activeTabStyle"]' }, }, RefreshPicker: { - /** - * @deprecated use runButtonV2 from Grafana 8.3 instead - */ - runButton: 'RefreshPicker run button', - /** - * @deprecated use intervalButtonV2 from Grafana 8.3 instead - */ - intervalButton: 'RefreshPicker interval button', - runButtonV2: 'data-testid RefreshPicker run button', - intervalButtonV2: 'data-testid RefreshPicker interval button', + runButtonV2: { + [MIN_GRAFANA_VERSION]: 'data-testid RefreshPicker run button', + }, + intervalButtonV2: { + [MIN_GRAFANA_VERSION]: 'data-testid RefreshPicker interval button', + }, }, QueryTab: { - content: 'Query editor tab content', - queryInspectorButton: 'Query inspector button', - queryHistoryButton: 'data-testid query-history-button', - addQuery: 'data-testid query-tab-add-query', - queryGroupTopSection: 'data-testid query group top section', - addExpression: 'data-testid query-tab-add-expression', + content: { + [MIN_GRAFANA_VERSION]: 'Query editor tab content', + }, + queryInspectorButton: { + [MIN_GRAFANA_VERSION]: 'Query inspector button', + }, + queryHistoryButton: { + '10.2.0': 'data-testid query-history-button', + [MIN_GRAFANA_VERSION]: 'query-history-button', + }, + addQuery: { + '10.2.0': 'data-testid query-tab-add-query', + [MIN_GRAFANA_VERSION]: 'Query editor add query button', + }, + queryGroupTopSection: { + '11.2.0': 'data-testid query group top section', + }, + addExpression: { + '11.2.0': 'data-testid query-tab-add-expression', + }, }, QueryHistory: { - queryText: 'Query text', + queryText: { + '9.0.0': 'Query text', + }, }, QueryEditorRows: { - rows: 'Query editor row', + rows: { + [MIN_GRAFANA_VERSION]: 'Query editor row', + }, }, QueryEditorRow: { - actionButton: (title: string) => `data-testid ${title}`, - title: (refId: string) => `Query editor row title ${refId}`, - container: (refId: string) => `Query editor row ${refId}`, + actionButton: { + '10.4.0': (title: string) => `data-testid ${title}`, + }, + title: { + [MIN_GRAFANA_VERSION]: (refId: string) => `Query editor row title ${refId}`, + }, + container: { + [MIN_GRAFANA_VERSION]: (refId: string) => `Query editor row ${refId}`, + }, }, AlertTab: { - content: 'data-testid Alert editor tab content', + content: { + '10.2.3': 'data-testid Alert editor tab content', + [MIN_GRAFANA_VERSION]: 'Alert editor tab content', + }, }, AlertRules: { - groupToggle: 'data-testid group-collapse-toggle', - toggle: 'data-testid collapse-toggle', - expandedContent: 'data-testid expanded-content', - previewButton: 'data-testid alert-rule preview-button', - ruleNameField: 'data-testid alert-rule name-field', - newFolderButton: 'data-testid alert-rule new-folder-button', - newFolderNameField: 'data-testid alert-rule name-folder-name-field', - newFolderNameCreateButton: 'data-testid alert-rule name-folder-name-create-button', - newEvaluationGroupButton: 'data-testid alert-rule new-evaluation-group-button', - newEvaluationGroupName: 'data-testid alert-rule new-evaluation-group-name', - newEvaluationGroupInterval: 'data-testid alert-rule new-evaluation-group-interval', - newEvaluationGroupCreate: 'data-testid alert-rule new-evaluation-group-create-button', + groupToggle: { + '11.0.0': 'data-testid group-collapse-toggle', + }, + toggle: { + '11.0.0': 'data-testid collapse-toggle', + }, + expandedContent: { + '11.0.0': 'data-testid expanded-content', + }, + previewButton: { + '11.1.0': 'data-testid alert-rule preview-button', + }, + ruleNameField: { + '11.1.0': 'data-testid alert-rule name-field', + }, + newFolderButton: { + '11.1.0': 'data-testid alert-rule new-folder-button', + }, + newFolderNameField: { + '11.1.0': 'data-testid alert-rule name-folder-name-field', + }, + newFolderNameCreateButton: { + '11.1.0': 'data-testid alert-rule name-folder-name-create-button', + }, + newEvaluationGroupButton: { + '11.1.0': 'data-testid alert-rule new-evaluation-group-button', + }, + newEvaluationGroupName: { + '11.1.0': 'data-testid alert-rule new-evaluation-group-name', + }, + newEvaluationGroupInterval: { + '11.1.0': 'data-testid alert-rule new-evaluation-group-interval', + }, + newEvaluationGroupCreate: { + '11.1.0': 'data-testid alert-rule new-evaluation-group-create-button', + }, }, Alert: { - /** - * @deprecated use alertV2 from Grafana 8.3 instead - */ - alert: (severity: string) => `Alert ${severity}`, - alertV2: (severity: string) => `data-testid Alert ${severity}`, + alertV2: { + [MIN_GRAFANA_VERSION]: (severity: string) => `data-testid Alert ${severity}`, + }, }, TransformTab: { - content: 'data-testid Transform editor tab content', - newTransform: (name: string) => `data-testid New transform ${name}`, - transformationEditor: (name: string) => `data-testid Transformation editor ${name}`, - transformationEditorDebugger: (name: string) => `data-testid Transformation editor debugger ${name}`, + content: { + '10.1.0': 'data-testid Transform editor tab content', + [MIN_GRAFANA_VERSION]: 'Transform editor tab content', + }, + newTransform: { + '10.1.0': (name: string) => `data-testid New transform ${name}`, + }, + transformationEditor: { + '10.1.0': (name: string) => `data-testid Transformation editor ${name}`, + }, + transformationEditorDebugger: { + '10.1.0': (name: string) => `data-testid Transformation editor debugger ${name}`, + }, }, Transforms: { - card: (name: string) => `data-testid New transform ${name}`, - disableTransformationButton: 'data-testid Disable transformation button', + card: { + '10.1.0': (name: string) => `data-testid New transform ${name}`, + }, + disableTransformationButton: { + '10.4.0': 'data-testid Disable transformation button', + }, Reduce: { - modeLabel: 'data-testid Transform mode label', - calculationsLabel: 'data-testid Transform calculations label', + modeLabel: { + '10.2.3': 'data-testid Transform mode label', + [MIN_GRAFANA_VERSION]: 'Transform mode label', + }, + calculationsLabel: { + '10.2.3': 'data-testid Transform calculations label', + [MIN_GRAFANA_VERSION]: 'Transform calculations label', + }, }, SpatialOperations: { - actionLabel: 'root Action field property editor', - locationLabel: 'root Location Mode field property editor', + actionLabel: { + '9.1.2': 'root Action field property editor', + }, + locationLabel: { + '10.2.0': 'root Location Mode field property editor', + }, location: { - autoOption: 'Auto location option', + autoOption: { + '9.1.2': 'Auto location option', + }, coords: { - option: 'Coords location option', - latitudeFieldLabel: 'root Latitude field field property editor', - longitudeFieldLabel: 'root Longitude field field property editor', + option: { + '9.1.2': 'Coords location option', + }, + latitudeFieldLabel: { + '9.1.2': 'root Latitude field field property editor', + }, + longitudeFieldLabel: { + '9.1.2': 'root Longitude field field property editor', + }, }, geohash: { - option: 'Geohash location option', - geohashFieldLabel: 'root Geohash field field property editor', + option: { + '9.1.2': 'Geohash location option', + }, + geohashFieldLabel: { + '9.1.2': 'root Geohash field field property editor', + }, }, lookup: { - option: 'Lookup location option', - lookupFieldLabel: 'root Lookup field field property editor', - gazetteerFieldLabel: 'root Gazetteer field property editor', + option: { + '9.1.2': 'Lookup location option', + }, + lookupFieldLabel: { + '9.1.2': 'root Lookup field field property editor', + }, + gazetteerFieldLabel: { + '9.1.2': 'root Gazetteer field property editor', + }, }, }, }, - searchInput: 'data-testid search transformations', - noTransformationsMessage: 'data-testid no transformations message', - addTransformationButton: 'data-testid add transformation button', - removeAllTransformationsButton: 'data-testid remove all transformations button', + searchInput: { + '10.2.3': 'data-testid search transformations', + [MIN_GRAFANA_VERSION]: 'search transformations', + }, + noTransformationsMessage: { + '10.2.3': 'data-testid no transformations message', + }, + addTransformationButton: { + '10.1.0': 'data-testid add transformation button', + [MIN_GRAFANA_VERSION]: 'add transformation button', + }, + removeAllTransformationsButton: { + '10.4.0': 'data-testid remove all transformations button', + }, }, NavBar: { Configuration: { - button: 'Configuration', + button: { + '9.5.0': 'Configuration', + }, }, Toggle: { - button: 'data-testid Toggle menu', + button: { + '10.2.3': 'data-testid Toggle menu', + [MIN_GRAFANA_VERSION]: 'Toggle menu', + }, }, Reporting: { - button: 'Reporting', + button: { + '9.5.0': 'Reporting', + }, }, }, NavMenu: { - Menu: 'data-testid navigation mega-menu', - item: 'data-testid Nav menu item', + Menu: { + '10.2.3': 'data-testid navigation mega-menu', + }, + item: { + '9.5.0': 'data-testid Nav menu item', + }, }, NavToolbar: { - container: 'data-testid Nav toolbar', - commandPaletteTrigger: 'data-testid Command palette trigger', - shareDashboard: 'data-testid Share dashboard', - markAsFavorite: 'data-testid Mark as favorite', + container: { + '9.4.0': 'data-testid Nav toolbar', + }, + commandPaletteTrigger: { + '11.4.0': 'data-testid Command palette trigger', + }, + shareDashboard: { + '11.1.0': 'data-testid Share dashboard', + }, + markAsFavorite: { + '11.1.0': 'data-testid Mark as favorite', + }, editDashboard: { - editButton: 'data-testid Edit dashboard button', - saveButton: 'data-testid Save dashboard button', - exitButton: 'data-testid Exit edit mode button', - settingsButton: 'data-testid Dashboard settings', - addRowButton: 'data-testid Add row button', - addLibraryPanelButton: 'data-testid Add a panel from the panel library button', - addVisualizationButton: 'data-testid Add new visualization menu item', - pastePanelButton: 'data-testid Paste panel button', - discardChangesButton: 'data-testid Discard changes button', - discardLibraryPanelButton: 'data-testid Discard library panel button', - unlinkLibraryPanelButton: 'data-testid Unlink library panel button', - saveLibraryPanelButton: 'data-testid Save library panel button', - backToDashboardButton: 'data-testid Back to dashboard button', + editButton: { + '11.1.0': 'data-testid Edit dashboard button', + }, + saveButton: { + '11.1.0': 'data-testid Save dashboard button', + }, + exitButton: { + '11.1.0': 'data-testid Exit edit mode button', + }, + settingsButton: { + '11.1.0': 'data-testid Dashboard settings', + }, + addRowButton: { + '11.1.0': 'data-testid Add row button', + }, + addLibraryPanelButton: { + '11.1.0': 'data-testid Add a panel from the panel library button', + }, + addVisualizationButton: { + '11.1.0': 'data-testid Add new visualization menu item', + }, + pastePanelButton: { + '11.1.0': 'data-testid Paste panel button', + }, + discardChangesButton: { + '11.1.0': 'data-testid Discard changes button', + }, + discardLibraryPanelButton: { + '11.1.0': 'data-testid Discard library panel button', + }, + unlinkLibraryPanelButton: { + '11.1.0': 'data-testid Unlink library panel button', + }, + saveLibraryPanelButton: { + '11.1.0': 'data-testid Save library panel button', + }, + backToDashboardButton: { + '11.1.0': 'data-testid Back to dashboard button', + }, }, }, PageToolbar: { - container: () => '.page-toolbar', - item: (tooltip: string) => `${tooltip}`, - itemButton: (title: string) => `data-testid ${title}`, + container: { [MIN_GRAFANA_VERSION]: () => '.page-toolbar' }, + item: { + [MIN_GRAFANA_VERSION]: (tooltip: string) => `${tooltip}`, + }, + itemButton: { + '9.5.0': (title: string) => `data-testid ${title}`, + }, }, QueryEditorToolbarItem: { - button: (title: string) => `QueryEditor toolbar item button ${title}`, + button: { + [MIN_GRAFANA_VERSION]: (title: string) => `QueryEditor toolbar item button ${title}`, + }, }, BackButton: { - backArrow: 'data-testid Go Back', + backArrow: { + '10.3.0': 'data-testid Go Back', + [MIN_GRAFANA_VERSION]: 'Go Back', + }, }, OptionsGroup: { - group: (title?: string) => (title ? `data-testid Options group ${title}` : 'data-testid Options group'), - toggle: (title?: string) => - title ? `data-testid Options group ${title} toggle` : 'data-testid Options group toggle', + group: { + '11.1.0': (title?: string) => (title ? `data-testid Options group ${title}` : 'data-testid Options group'), + [MIN_GRAFANA_VERSION]: (title?: string) => (title ? `Options group ${title}` : 'Options group'), + }, + toggle: { + '11.1.0': (title?: string) => + title ? `data-testid Options group ${title} toggle` : 'data-testid Options group toggle', + [MIN_GRAFANA_VERSION]: (title?: string) => (title ? `Options group ${title} toggle` : 'Options group toggle'), + }, }, PluginVisualization: { - item: (title: string) => `Plugin visualization item ${title}`, - current: () => '[class*="-currentVisualizationItem"]', + item: { + [MIN_GRAFANA_VERSION]: (title: string) => `Plugin visualization item ${title}`, + }, + current: { + [MIN_GRAFANA_VERSION]: () => '[class*="-currentVisualizationItem"]', + }, }, Select: { - option: 'data-testid Select option', - toggleAllOptions: 'data-testid toggle all options', - input: () => 'input[id*="time-options-input"]', - singleValue: () => 'div[class*="-singleValue"]', + option: { + '11.1.0': 'data-testid Select option', + [MIN_GRAFANA_VERSION]: 'Select option', + }, + toggleAllOptions: { + '11.3.0': 'data-testid toggle all options', + }, + input: { + [MIN_GRAFANA_VERSION]: () => 'input[id*="time-options-input"]', + }, + singleValue: { + [MIN_GRAFANA_VERSION]: () => 'div[class*="-singleValue"]', + }, }, FieldConfigEditor: { - content: 'Field config editor content', + content: { + [MIN_GRAFANA_VERSION]: 'Field config editor content', + }, }, OverridesConfigEditor: { - content: 'Field overrides editor content', + content: { + [MIN_GRAFANA_VERSION]: 'Field overrides editor content', + }, }, FolderPicker: { - /** - * @deprecated use containerV2 from Grafana 8.3 instead - */ - container: 'Folder picker select container', - containerV2: 'data-testid Folder picker select container', - input: 'data-testid folder-picker-input', + containerV2: { + [MIN_GRAFANA_VERSION]: 'data-testid Folder picker select container', + }, + input: { + '10.4.0': 'data-testid folder-picker-input', + }, }, ReadonlyFolderPicker: { - container: 'data-testid Readonly folder picker select container', + container: { + [MIN_GRAFANA_VERSION]: 'data-testid Readonly folder picker select container', + }, }, DataSourcePicker: { - container: 'data-testid Data source picker select container', - /** - * @deprecated use inputV2 instead - */ - input: () => 'input[id="data-source-picker"]', - inputV2: 'data-testid Select a data source', - dataSourceList: 'data-testid Data source list dropdown', + container: { + '10.0.0': 'data-testid Data source picker select container', + [MIN_GRAFANA_VERSION]: 'Data source picker select container', + }, + inputV2: { + '10.1.0': 'data-testid Select a data source', + [MIN_GRAFANA_VERSION]: 'Select a data source', + }, + dataSourceList: { + '10.4.0': 'data-testid Data source list dropdown', + }, advancedModal: { - dataSourceList: 'data-testid Data source list', - builtInDataSourceList: 'data-testid Built in data source list', + dataSourceList: { + '10.4.0': 'data-testid Data source list', + }, + builtInDataSourceList: { + '10.4.0': 'data-testid Built in data source list', + }, }, }, TimeZonePicker: { - /** - * @deprecated use TimeZonePicker.containerV2 from Grafana 8.3 instead - */ - container: 'Time zone picker select container', - containerV2: 'data-testid Time zone picker select container', - changeTimeSettingsButton: 'data-testid Time zone picker Change time settings button', + containerV2: { + [MIN_GRAFANA_VERSION]: 'data-testid Time zone picker select container', + }, + changeTimeSettingsButton: { + '11.0.0': 'data-testid Time zone picker Change time settings button', + }, }, WeekStartPicker: { - /** - * @deprecated use WeekStartPicker.containerV2 from Grafana 8.3 instead - */ - container: 'Choose starting day of the week', - containerV2: 'data-testid Choose starting day of the week', - placeholder: 'Choose starting day of the week', + containerV2: { + [MIN_GRAFANA_VERSION]: 'data-testid Choose starting day of the week', + }, + placeholder: { + [MIN_GRAFANA_VERSION]: 'Choose starting day of the week', + }, }, TraceViewer: { - spanBar: 'data-testid SpanBar--wrapper', + spanBar: { + '9.0.0': 'data-testid SpanBar--wrapper', + }, + }, + QueryField: { + container: { + '10.3.0': 'data-testid Query field', + [MIN_GRAFANA_VERSION]: 'Query field', + }, }, - QueryField: { container: 'data-testid Query field' }, QueryBuilder: { - queryPatterns: 'data-testid Query patterns', - labelSelect: 'data-testid Select label', - inputSelect: 'data-testid Select label-input', - valueSelect: 'data-testid Select value', - matchOperatorSelect: 'data-testid Select match operator', + queryPatterns: { + '10.3.0': 'data-testid Query patterns', + [MIN_GRAFANA_VERSION]: 'Query patterns', + }, + labelSelect: { + '10.3.0': 'data-testid Select label', + [MIN_GRAFANA_VERSION]: 'Select label', + }, + inputSelect: { + '11.1.0': 'data-testid Select label-input', + }, + valueSelect: { + '10.3.0': 'data-testid Select value', + [MIN_GRAFANA_VERSION]: 'Select value', + }, + matchOperatorSelect: { + '10.3.0': 'data-testid Select match operator', + [MIN_GRAFANA_VERSION]: 'Select match operator', + }, }, ValuePicker: { - button: (name: string) => `data-testid Value picker button ${name}`, - select: (name: string) => `data-testid Value picker select ${name}`, + button: { + '10.3.0': (name: string) => `data-testid Value picker button ${name}`, + }, + select: { + '10.3.0': (name: string) => `data-testid Value picker select ${name}`, + }, }, Search: { - /** - * @deprecated use sectionV2 from Grafana 8.3 instead - */ - section: 'Search section', - sectionV2: 'data-testid Search section', - /** - * @deprecated use itemsV2 from Grafana 8.3 instead - */ - items: 'Search items', - itemsV2: 'data-testid Search items', - cards: 'data-testid Search cards', - collapseFolder: (sectionId: string) => `data-testid Collapse folder ${sectionId}`, - expandFolder: (sectionId: string) => `data-testid Expand folder ${sectionId}`, - dashboardItem: (item: string) => `${Components.Search.dashboardItems} ${item}`, - dashboardCard: (item: string) => `data-testid Search card ${item}`, - folderHeader: (folderName: string) => `data-testid Folder header ${folderName}`, - folderContent: (folderName: string) => `data-testid Folder content ${folderName}`, - dashboardItems: 'data-testid Dashboard search item', + sectionV2: { + [MIN_GRAFANA_VERSION]: 'data-testid Search section', + }, + itemsV2: { + [MIN_GRAFANA_VERSION]: 'data-testid Search items', + }, + cards: { + [MIN_GRAFANA_VERSION]: 'data-testid Search cards', + }, + collapseFolder: { + [MIN_GRAFANA_VERSION]: (sectionId: string) => `data-testid Collapse folder ${sectionId}`, + }, + expandFolder: { + [MIN_GRAFANA_VERSION]: (sectionId: string) => `data-testid Expand folder ${sectionId}`, + }, + dashboardItem: { + [MIN_GRAFANA_VERSION]: (item: string) => `data-testid Dashboard search item ${item}`, + }, + dashboardCard: { + [MIN_GRAFANA_VERSION]: (item: string) => `data-testid Search card ${item}`, + }, + folderHeader: { + '9.3.0': (folderName: string) => `data-testid Folder header ${folderName}`, + }, + folderContent: { + '9.3.0': (folderName: string) => `data-testid Folder content ${folderName}`, + }, + dashboardItems: { + [MIN_GRAFANA_VERSION]: 'data-testid Dashboard search item', + }, }, DashboardLinks: { - container: 'data-testid Dashboard link container', - dropDown: 'data-testid Dashboard link dropdown', - link: 'data-testid Dashboard link', + container: { + [MIN_GRAFANA_VERSION]: 'data-testid Dashboard link container', + }, + dropDown: { + [MIN_GRAFANA_VERSION]: 'data-testid Dashboard link dropdown', + }, + link: { + [MIN_GRAFANA_VERSION]: 'data-testid Dashboard link', + }, }, LoadingIndicator: { - icon: 'data-testid Loading indicator', + icon: { + '10.4.0': 'data-testid Loading indicator', + [MIN_GRAFANA_VERSION]: 'Loading indicator', + }, }, CallToActionCard: { - /** - * @deprecated use buttonV2 from Grafana 8.3 instead - */ - button: (name: string) => `Call to action button ${name}`, - buttonV2: (name: string) => `data-testid Call to action button ${name}`, + buttonV2: { + [MIN_GRAFANA_VERSION]: (name: string) => `data-testid Call to action button ${name}`, + }, }, DataLinksContextMenu: { - singleLink: 'data-testid Data link', + singleLink: { + '10.3.0': 'data-testid Data link', + [MIN_GRAFANA_VERSION]: 'Data link', + }, }, CodeEditor: { - container: 'data-testid Code editor container', + container: { + '10.2.3': 'data-testid Code editor container', + [MIN_GRAFANA_VERSION]: 'Code editor container', + }, }, ReactMonacoEditor: { - editorLazy: 'data-testid ReactMonacoEditor editorLazy', + editorLazy: { + '11.1.0': 'data-testid ReactMonacoEditor editorLazy', + }, }, DashboardImportPage: { - textarea: 'data-testid-import-dashboard-textarea', - submit: 'data-testid-load-dashboard', + textarea: { + [MIN_GRAFANA_VERSION]: 'data-testid-import-dashboard-textarea', + }, + submit: { + [MIN_GRAFANA_VERSION]: 'data-testid-load-dashboard', + }, }, ImportDashboardForm: { - name: 'data-testid-import-dashboard-title', - submit: 'data-testid-import-dashboard-submit', + name: { + [MIN_GRAFANA_VERSION]: 'data-testid-import-dashboard-title', + }, + submit: { + [MIN_GRAFANA_VERSION]: 'data-testid-import-dashboard-submit', + }, }, PanelAlertTabContent: { - content: 'data-testid Unified alert editor tab content', + content: { + '10.2.3': 'data-testid Unified alert editor tab content', + [MIN_GRAFANA_VERSION]: 'Unified alert editor tab content', + }, }, VisualizationPreview: { - card: (name: string) => `data-testid suggestion-${name}`, + card: { + [MIN_GRAFANA_VERSION]: (name: string) => `data-testid suggestion-${name}`, + }, }, ColorSwatch: { - name: `data-testid-colorswatch`, + name: { + [MIN_GRAFANA_VERSION]: 'data-testid-colorswatch', + }, }, DashboardRow: { - title: (title: string) => `data-testid dashboard-row-title-${title}`, + title: { + [MIN_GRAFANA_VERSION]: (title: string) => `data-testid dashboard-row-title-${title}`, + }, }, UserProfile: { - profileSaveButton: 'data-testid-user-profile-save', - preferencesSaveButton: 'data-testid-shared-prefs-save', - orgsTable: 'data-testid-user-orgs-table', - sessionsTable: 'data-testid-user-sessions-table', - extensionPointTabs: 'data-testid-extension-point-tabs', - extensionPointTab: (tabId: string) => `data-testid-extension-point-tab-${tabId}`, + profileSaveButton: { + [MIN_GRAFANA_VERSION]: 'data-testid-user-profile-save', + }, + preferencesSaveButton: { + [MIN_GRAFANA_VERSION]: 'data-testid-shared-prefs-save', + }, + orgsTable: { + [MIN_GRAFANA_VERSION]: 'data-testid-user-orgs-table', + }, + sessionsTable: { + [MIN_GRAFANA_VERSION]: 'data-testid-user-sessions-table', + }, + extensionPointTabs: { + '10.2.3': 'data-testid-extension-point-tabs', + }, + extensionPointTab: { + '10.2.3': (tabId: string) => `data-testid-extension-point-tab-${tabId}`, + }, }, FileUpload: { - inputField: 'data-testid-file-upload-input-field', - fileNameSpan: 'data-testid-file-upload-file-name', + inputField: { + '9.0.0': 'data-testid-file-upload-input-field', + }, + fileNameSpan: { + '9.0.0': 'data-testid-file-upload-file-name', + }, }, DebugOverlay: { - wrapper: 'debug-overlay', + wrapper: { + '9.2.0': 'debug-overlay', + }, }, OrgRolePicker: { - input: 'Role', + input: { + '9.5.0': 'Role', + }, }, AnalyticsToolbarButton: { - button: 'Dashboard insights', + button: { + '9.5.0': 'Dashboard insights', + }, }, Variables: { - variableOption: 'data-testid variable-option', - variableLinkWrapper: 'data-testid variable-link-wrapper', + variableOption: { + '9.5.0': 'data-testid variable-option', + }, + variableLinkWrapper: { + '11.1.1': 'data-testid variable-link-wrapper', + }, }, Annotations: { - annotationsTypeInput: 'data-testid annotations-type-input', - annotationsChoosePanelInput: 'data-testid choose-panels-input', + annotationsTypeInput: { + '11.1.0': 'data-testid annotations-type-input', + [MIN_GRAFANA_VERSION]: 'annotations-type-input', + }, + annotationsChoosePanelInput: { + '11.1.0': 'data-testid choose-panels-input', + [MIN_GRAFANA_VERSION]: 'choose-panels-input', + }, editor: { - testButton: 'data-testid annotations-test-button', - resultContainer: 'data-testid annotations-query-result-container', + testButton: { + '11.0.0': 'data-testid annotations-test-button', + }, + resultContainer: { + '11.0.0': 'data-testid annotations-query-result-container', + }, }, }, Tooltip: { - container: 'data-testid tooltip', + container: { + '10.2.0': 'data-testid tooltip', + }, }, ReturnToPrevious: { - buttonGroup: 'data-testid dismissable button group', - backButton: 'data-testid back', - dismissButton: 'data-testid dismiss', + buttonGroup: { + '11.0.0': 'data-testid dismissable button group', + }, + backButton: { + '11.0.0': 'data-testid back', + }, + dismissButton: { + '11.0.0': 'data-testid dismiss', + }, }, SQLQueryEditor: { - selectColumn: 'data-testid select-column', - selectAggregation: 'data-testid select-aggregation', - selectAlias: 'data-testid select-alias', - filterConjunction: 'data-testid filter-conjunction', - filterField: 'data-testid filter-field', - filterOperator: 'data-testid filter-operator', - headerTableSelector: 'data-testid header-table-selector', - headerFilterSwitch: 'data-testid header-filter-switch', - headerGroupSwitch: 'data-testid header-group-switch', - headerOrderSwitch: 'data-testid header-order-switch', - headerPreviewSwitch: 'data-testid header-preview-switch', + selectColumn: { + '11.0.0': 'data-testid select-column', + }, + selectAggregation: { + '11.0.0': 'data-testid select-aggregation', + }, + selectAlias: { + '11.0.0': 'data-testid select-alias', + }, + filterConjunction: { + '11.0.0': 'data-testid filter-conjunction', + }, + filterField: { + '11.0.0': 'data-testid filter-field', + }, + filterOperator: { + '11.0.0': 'data-testid filter-operator', + }, + headerTableSelector: { + '11.0.0': 'data-testid header-table-selector', + }, + headerFilterSwitch: { + '11.0.0': 'data-testid header-filter-switch', + }, + headerGroupSwitch: { + '11.0.0': 'data-testid header-group-switch', + }, + headerOrderSwitch: { + '11.0.0': 'data-testid header-order-switch', + }, + headerPreviewSwitch: { + '11.0.0': 'data-testid header-preview-switch', + }, }, EntityNotFound: { - container: 'data-testid entity-not-found', + container: { + '11.2.0': 'data-testid entity-not-found', + }, }, -}; +} satisfies VersionedSelectorGroup; + +export type VersionedComponents = typeof versionedComponents; diff --git a/packages/grafana-e2e-selectors/src/selectors/constants.ts b/packages/grafana-e2e-selectors/src/selectors/constants.ts new file mode 100644 index 00000000000..cda08ecaf1c --- /dev/null +++ b/packages/grafana-e2e-selectors/src/selectors/constants.ts @@ -0,0 +1 @@ +export const MIN_GRAFANA_VERSION = '8.5.0'; diff --git a/packages/grafana-e2e-selectors/src/selectors/index.ts b/packages/grafana-e2e-selectors/src/selectors/index.ts index 88ebc406b5f..bfe90848026 100644 --- a/packages/grafana-e2e-selectors/src/selectors/index.ts +++ b/packages/grafana-e2e-selectors/src/selectors/index.ts @@ -1,21 +1,24 @@ +import { resolveSelectors } from '../resolver'; import { E2ESelectors } from '../types'; -import { Components } from './components'; -import { Pages } from './pages'; +import { versionedComponents, VersionedComponents } from './components'; +import { versionedPages, VersionedPages } from './pages'; -/** - * Exposes selectors in package for easy use in e2e tests and in production code - * - * @alpha - */ -export const selectors: { pages: E2ESelectors; components: E2ESelectors } = { - pages: Pages, - components: Components, -}; +const Pages = resolveSelectors(versionedPages); +const Components = resolveSelectors(versionedComponents); +const selectors = { pages: Pages, components: Components }; /** * Exposes Pages, Component selectors and E2ESelectors type in package for easy use in e2e tests and in production code - * - * @alpha */ -export { Pages, Components, type E2ESelectors }; +export { + Pages, + Components, + selectors, + versionedComponents, + versionedPages, + resolveSelectors, + type VersionedPages, + type VersionedComponents, + type E2ESelectors, +}; diff --git a/packages/grafana-e2e-selectors/src/selectors/pages.ts b/packages/grafana-e2e-selectors/src/selectors/pages.ts index be04b0e8296..d9e2c219f30 100644 --- a/packages/grafana-e2e-selectors/src/selectors/pages.ts +++ b/packages/grafana-e2e-selectors/src/selectors/pages.ts @@ -1,451 +1,1001 @@ -import { Components } from './components'; +import { VersionedSelectorGroup } from '../types'; + +import { MIN_GRAFANA_VERSION } from './constants'; /** * Selectors grouped/defined in Pages - * - * @alpha */ -export const Pages = { +export const versionedPages = { + Alerting: { + AddAlertRule: { + url: { + '10.1.0': '/alerting/new/alerting', + [MIN_GRAFANA_VERSION]: '/alerting/new', + }, + }, + EditAlertRule: { + url: { + [MIN_GRAFANA_VERSION]: (alertRuleUid: string) => `alerting/${alertRuleUid}/edit`, + }, + }, + }, Login: { - url: '/login', - username: 'data-testid Username input field', - password: 'data-testid Password input field', - submit: 'data-testid Login button', - skip: 'data-testid Skip change password button', + url: { + [MIN_GRAFANA_VERSION]: '/login', + }, + username: { + '10.2.3': 'data-testid Username input field', + [MIN_GRAFANA_VERSION]: 'Username input field', + }, + password: { + '10.2.3': 'data-testid Password input field', + [MIN_GRAFANA_VERSION]: 'Password input field', + }, + submit: { + '10.2.3': 'data-testid Login button', + [MIN_GRAFANA_VERSION]: 'Login button', + }, + skip: { + '10.2.3': 'data-testid Skip change password button', + }, }, Home: { - url: '/', + url: { + [MIN_GRAFANA_VERSION]: '/', + }, }, DataSource: { - name: 'data-testid Data source settings page name input field', - delete: 'Data source settings page Delete button', - readOnly: 'data-testid Data source settings page read only message', - saveAndTest: 'data-testid Data source settings page Save and Test button', - alert: 'data-testid Data source settings page Alert', + name: { + '10.3.0': 'data-testid Data source settings page name input field', + [MIN_GRAFANA_VERSION]: 'Data source settings page name input field', + }, + delete: { + [MIN_GRAFANA_VERSION]: 'Data source settings page Delete button', + }, + readOnly: { + '10.3.0': 'data-testid Data source settings page read only message', + [MIN_GRAFANA_VERSION]: 'Data source settings page read only message', + }, + saveAndTest: { + '10.0.0': 'data-testid Data source settings page Save and Test button', + [MIN_GRAFANA_VERSION]: 'Data source settings page Save and Test button', + }, + alert: { + '10.3.0': 'data-testid Data source settings page Alert', + [MIN_GRAFANA_VERSION]: 'Data source settings page Alert', + }, }, DataSources: { - url: '/datasources', - dataSources: (dataSourceName: string) => `Data source list item ${dataSourceName}`, + url: { + [MIN_GRAFANA_VERSION]: '/datasources', + }, + dataSources: { + [MIN_GRAFANA_VERSION]: (dataSourceName: string) => `Data source list item ${dataSourceName}`, + }, }, EditDataSource: { - url: (dataSourceUid: string) => `/datasources/edit/${dataSourceUid}`, - settings: 'Datasource settings page basic settings', + url: { + '9.5.0': (dataSourceUid: string) => `/datasources/edit/${dataSourceUid}`, + }, + settings: { + '9.5.0': 'Datasource settings page basic settings', + }, }, AddDataSource: { - url: '/datasources/new', - /** @deprecated Use dataSourcePluginsV2 */ - dataSourcePlugins: (pluginName: string) => `Data source plugin item ${pluginName}`, - dataSourcePluginsV2: (pluginName: string) => `Add new data source ${pluginName}`, + url: { + [MIN_GRAFANA_VERSION]: '/datasources/new', + }, + dataSourcePluginsV2: { + '9.3.1': (pluginName: string) => `Add new data source ${pluginName}`, + [MIN_GRAFANA_VERSION]: (pluginName: string) => `Data source plugin item ${pluginName}`, + }, }, ConfirmModal: { - delete: 'data-testid Confirm Modal Danger Button', + delete: { + '10.0.0': 'data-testid Confirm Modal Danger Button', + [MIN_GRAFANA_VERSION]: 'Confirm Modal Danger Button', + }, }, AddDashboard: { - url: '/dashboard/new', - itemButton: (title: string) => `data-testid ${title}`, - addNewPanel: 'data-testid Add new panel', - addNewRow: 'data-testid Add new row', - addNewPanelLibrary: 'data-testid Add new panel from panel library', - }, - Dashboard: { - url: (uid: string) => `/d/${uid}`, - DashNav: { - /** - * @deprecated use navV2 from Grafana 8.3 instead - */ - nav: 'Dashboard navigation', - navV2: 'data-testid Dashboard navigation', - publicDashboardTag: 'data-testid public dashboard tag', - shareButton: 'data-testid share-button', - scrollContainer: 'data-testid Dashboard canvas scroll container', - newShareButton: { - container: 'data-testid new share button', - shareLink: 'data-testid new share link-button', - arrowMenu: 'data-testid new share button arrow menu', - menu: { - container: 'data-testid new share button menu', - shareInternally: 'data-testid new share button share internally', - shareExternally: 'data-testid new share button share externally', - shareSnapshot: 'data-testid new share button share snapshot', - }, - }, - NewExportButton: { - container: 'data-testid new export button', - arrowMenu: 'data-testid new export button arrow menu', - Menu: { - container: 'data-testid new export button menu', - exportAsJson: 'data-testid new export button export as json', - }, - }, - playlistControls: { - prev: 'data-testid playlist previous dashboard button', - stop: 'data-testid playlist stop dashboard button', - next: 'data-testid playlist next dashboard button', - }, + url: { + [MIN_GRAFANA_VERSION]: '/dashboard/new', }, - Controls: 'data-testid dashboard controls', - SubMenu: { - submenu: 'Dashboard submenu', - submenuItem: 'data-testid template variable', - submenuItemLabels: (item: string) => `data-testid Dashboard template variables submenu Label ${item}`, - submenuItemValueDropDownValueLinkTexts: (item: string) => - `data-testid Dashboard template variables Variable Value DropDown value link text ${item}`, - submenuItemValueDropDownDropDown: 'Variable options', - submenuItemValueDropDownOptionTexts: (item: string) => - `data-testid Dashboard template variables Variable Value DropDown option text ${item}`, - Annotations: { - annotationsWrapper: 'data-testid annotation-wrapper', - annotationLabel: (label: string) => `data-testid Dashboard annotations submenu Label ${label}`, - annotationToggle: (label: string) => `data-testid Dashboard annotations submenu Toggle ${label}`, - }, + itemButton: { + '9.5.0': (title: string) => `data-testid ${title}`, + }, + addNewPanel: { + '11.1.0': 'data-testid Add new panel', + [MIN_GRAFANA_VERSION]: 'Add new panel', + }, + itemButtonAddViz: { + [MIN_GRAFANA_VERSION]: 'Add new visualization menu item', + }, + addNewRow: { + '11.1.0': 'data-testid Add new row', + [MIN_GRAFANA_VERSION]: 'Add new row', + }, + addNewPanelLibrary: { + '11.1.0': 'data-testid Add new panel from panel library', + [MIN_GRAFANA_VERSION]: 'Add new panel from panel library', }, Settings: { - Actions: { - close: 'data-testid dashboard-settings-close', - }, - General: { - deleteDashBoard: 'data-testid Dashboard settings page delete dashboard button', - sectionItems: (item: string) => `Dashboard settings section item ${item}`, - saveDashBoard: 'Dashboard settings aside actions Save button', - saveAsDashBoard: 'Dashboard settings aside actions Save As button', - /** - * @deprecated use components.TimeZonePicker.containerV2 from Grafana 8.3 instead - */ - timezone: 'Time zone picker select container', - title: 'General', - }, Annotations: { List: { - /** - * @deprecated use addAnnotationCTAV2 from Grafana 8.3 instead - */ - addAnnotationCTA: Components.CallToActionCard.button('Add annotation query'), - addAnnotationCTAV2: Components.CallToActionCard.buttonV2('Add annotation query'), - annotations: 'data-testid list-annotations', + url: { + [MIN_GRAFANA_VERSION]: '/dashboard/new?orgId=1&editview=annotations', + }, }, - Settings: { - name: 'data-testid Annotations settings name input', - }, - NewAnnotation: { - panelFilterSelect: 'data-testid annotations-panel-filter', - showInLabel: 'data-testid show-in-label', - previewInDashboard: 'data-testid annotations-preview', - delete: 'data-testid annotations-delete', - apply: 'data-testid annotations-apply', - enable: 'data-testid annotation-enable', - hide: 'data-testid annotation-hide', + Edit: { + url: { + [MIN_GRAFANA_VERSION]: (annotationIndex: string) => + `/dashboard/new?editview=annotations&editIndex=${annotationIndex}`, + }, }, }, Variables: { List: { - /** - * @deprecated use addVariableCTAV2 from Grafana 8.3 instead - */ - addVariableCTA: Components.CallToActionCard.button('Add variable'), - addVariableCTAV2: Components.CallToActionCard.buttonV2('Add variable'), - newButton: 'Variable editor New variable button', - table: 'Variable editor Table', - tableRowNameFields: (variableName: string) => `Variable editor Table Name field ${variableName}`, - tableRowDefinitionFields: (variableName: string) => `Variable editor Table Definition field ${variableName}`, - tableRowArrowUpButtons: (variableName: string) => `Variable editor Table ArrowUp button ${variableName}`, - tableRowArrowDownButtons: (variableName: string) => `Variable editor Table ArrowDown button ${variableName}`, - tableRowDuplicateButtons: (variableName: string) => `Variable editor Table Duplicate button ${variableName}`, - tableRowRemoveButtons: (variableName: string) => `Variable editor Table Remove button ${variableName}`, + url: { + [MIN_GRAFANA_VERSION]: '/dashboard/new?orgId=1&editview=templating', + }, }, Edit: { + url: { + [MIN_GRAFANA_VERSION]: (annotationIndex: string) => + `/dashboard/new?orgId=1&editview=templating&editIndex=${annotationIndex}`, + }, + }, + }, + }, + }, + Dashboard: { + url: { + [MIN_GRAFANA_VERSION]: (uid: string) => `/d/${uid}`, + }, + DashNav: { + nav: { + [MIN_GRAFANA_VERSION]: 'Dashboard navigation', + }, + navV2: { + [MIN_GRAFANA_VERSION]: 'data-testid Dashboard navigation', + }, + publicDashboardTag: { + '9.1.0': 'data-testid public dashboard tag', + }, + shareButton: { + '10.4.0': 'data-testid share-button', + }, + scrollContainer: { + '11.1.0': 'data-testid Dashboard canvas scroll container', + }, + newShareButton: { + container: { + '11.1.0': 'data-testid new share button', + }, + shareLink: { + '11.1.0': 'data-testid new share link-button', + }, + arrowMenu: { + '11.1.0': 'data-testid new share button arrow menu', + }, + menu: { + container: { + '11.1.0': 'data-testid new share button menu', + }, + shareInternally: { + '11.1.0': 'data-testid new share button share internally', + }, + shareExternally: { + '11.1.1': 'data-testid new share button share externally', + }, + shareSnapshot: { + '11.2.0': 'data-testid new share button share snapshot', + }, + }, + }, + NewExportButton: { + container: { + '11.2.0': 'data-testid new export button', + }, + arrowMenu: { + '11.2.0': 'data-testid new export button arrow menu', + }, + Menu: { + container: { + '11.2.0': 'data-testid new export button menu', + }, + exportAsJson: { + '11.2.0': 'data-testid new export button export as json', + }, + }, + }, + playlistControls: { + prev: { + '11.0.0': 'data-testid playlist previous dashboard button', + }, + stop: { + '11.0.0': 'data-testid playlist stop dashboard button', + }, + next: { + '11.0.0': 'data-testid playlist next dashboard button', + }, + }, + }, + Controls: { + '11.1.0': 'data-testid dashboard controls', + }, + SubMenu: { + submenu: { + [MIN_GRAFANA_VERSION]: 'Dashboard submenu', + }, + submenuItem: { + [MIN_GRAFANA_VERSION]: 'data-testid template variable', + }, + submenuItemLabels: { + [MIN_GRAFANA_VERSION]: (item: string) => `data-testid Dashboard template variables submenu Label ${item}`, + }, + submenuItemValueDropDownValueLinkTexts: { + [MIN_GRAFANA_VERSION]: (item: string) => + `data-testid Dashboard template variables Variable Value DropDown value link text ${item}`, + }, + submenuItemValueDropDownDropDown: { + [MIN_GRAFANA_VERSION]: 'Variable options', + }, + submenuItemValueDropDownOptionTexts: { + [MIN_GRAFANA_VERSION]: (item: string) => + `data-testid Dashboard template variables Variable Value DropDown option text ${item}`, + }, + Annotations: { + annotationsWrapper: { + '10.0.0': 'data-testid annotation-wrapper', + }, + annotationLabel: { + '10.0.0': (label: string) => `data-testid Dashboard annotations submenu Label ${label}`, + }, + annotationToggle: { + '10.0.0': (label: string) => `data-testid Dashboard annotations submenu Toggle ${label}`, + }, + }, + }, + Settings: { + Actions: { + close: { + '9.5.0': 'data-testid dashboard-settings-close', + }, + }, + General: { + deleteDashBoard: { + '11.1.0': 'data-testid Dashboard settings page delete dashboard button', + }, + sectionItems: { + [MIN_GRAFANA_VERSION]: (item: string) => `Dashboard settings section item ${item}`, + }, + saveDashBoard: { + [MIN_GRAFANA_VERSION]: 'Dashboard settings aside actions Save button', + }, + saveAsDashBoard: { + [MIN_GRAFANA_VERSION]: 'Dashboard settings aside actions Save As button', + }, + title: { + '11.2.0': 'General', + }, + }, + Annotations: { + Edit: { + urlParams: { + [MIN_GRAFANA_VERSION]: (annotationIndex: string) => `editview=annotations&editIndex=${annotationIndex}`, + }, + }, + List: { + url: { + [MIN_GRAFANA_VERSION]: (dashboardUid: string) => `/d/${dashboardUid}?editview=annotations`, + }, + addAnnotationCTAV2: { + [MIN_GRAFANA_VERSION]: 'data-testid Call to action button Add annotation query', + }, + annotations: { + '10.4.0': 'data-testid list-annotations', + }, + }, + Settings: { + name: { + '11.1.0': 'data-testid Annotations settings name input', + [MIN_GRAFANA_VERSION]: 'Annotations settings name input', + }, + }, + NewAnnotation: { + panelFilterSelect: { + '10.0.0': 'data-testid annotations-panel-filter', + }, + showInLabel: { + '11.1.0': 'data-testid show-in-label', + }, + previewInDashboard: { + '10.0.0': 'data-testid annotations-preview', + }, + delete: { + '10.4.0': 'data-testid annotations-delete', + }, + apply: { + '10.4.0': 'data-testid annotations-apply', + }, + enable: { + '10.4.0': 'data-testid annotation-enable', + }, + hide: { + '10.4.0': 'data-testid annotation-hide', + }, + }, + }, + Variables: { + List: { + url: { + [MIN_GRAFANA_VERSION]: (dashboardUid: string) => `/d/${dashboardUid}?editview=templating`, + }, + addVariableCTAV2: { + [MIN_GRAFANA_VERSION]: 'data-testid Call to action button Add variable', + }, + newButton: { + [MIN_GRAFANA_VERSION]: 'Variable editor New variable button', + }, + table: { + [MIN_GRAFANA_VERSION]: 'Variable editor Table', + }, + tableRowNameFields: { + [MIN_GRAFANA_VERSION]: (variableName: string) => `Variable editor Table Name field ${variableName}`, + }, + tableRowDefinitionFields: { + '10.1.0': (variableName: string) => `Variable editor Table Definition field ${variableName}`, + }, + tableRowArrowUpButtons: { + [MIN_GRAFANA_VERSION]: (variableName: string) => `Variable editor Table ArrowUp button ${variableName}`, + }, + tableRowArrowDownButtons: { + [MIN_GRAFANA_VERSION]: (variableName: string) => `Variable editor Table ArrowDown button ${variableName}`, + }, + tableRowDuplicateButtons: { + [MIN_GRAFANA_VERSION]: (variableName: string) => `Variable editor Table Duplicate button ${variableName}`, + }, + tableRowRemoveButtons: { + [MIN_GRAFANA_VERSION]: (variableName: string) => `Variable editor Table Remove button ${variableName}`, + }, + }, + Edit: { + urlParams: { + [MIN_GRAFANA_VERSION]: (editIndex: string) => `editview=templating&editIndex=${editIndex}`, + }, General: { - headerLink: 'Variable editor Header link', - modeLabelNew: 'Variable editor Header mode New', + headerLink: { + [MIN_GRAFANA_VERSION]: 'Variable editor Header link', + }, + modeLabelNew: { + [MIN_GRAFANA_VERSION]: 'Variable editor Header mode New', + }, /** * @deprecated */ - modeLabelEdit: 'Variable editor Header mode Edit', - generalNameInput: 'Variable editor Form Name field', - generalNameInputV2: 'data-testid Variable editor Form Name field', - generalTypeSelect: 'Variable editor Form Type select', - generalTypeSelectV2: 'data-testid Variable editor Form Type select', - generalLabelInput: 'Variable editor Form Label field', - generalLabelInputV2: 'data-testid Variable editor Form Label field', - generalHideSelect: 'Variable editor Form Hide select', - generalHideSelectV2: 'data-testid Variable editor Form Hide select', - selectionOptionsMultiSwitch: 'data-testid Variable editor Form Multi switch', - selectionOptionsIncludeAllSwitch: 'data-testid Variable editor Form IncludeAll switch', - selectionOptionsCustomAllInput: 'data-testid Variable editor Form IncludeAll field', - previewOfValuesOption: 'data-testid Variable editor Preview of Values option', - submitButton: 'data-testid Variable editor Run Query button', - applyButton: 'data-testid Variable editor Apply button', + modeLabelEdit: { + [MIN_GRAFANA_VERSION]: 'Variable editor Header mode Edit', + }, + generalNameInput: { + [MIN_GRAFANA_VERSION]: 'Variable editor Form Name field', + }, + generalNameInputV2: { + [MIN_GRAFANA_VERSION]: 'data-testid Variable editor Form Name field', + }, + generalTypeSelect: { + [MIN_GRAFANA_VERSION]: 'Variable editor Form Type select', + }, + generalTypeSelectV2: { + [MIN_GRAFANA_VERSION]: 'data-testid Variable editor Form Type select', + }, + generalLabelInput: { + [MIN_GRAFANA_VERSION]: 'Variable editor Form Label field', + }, + generalLabelInputV2: { + [MIN_GRAFANA_VERSION]: 'data-testid Variable editor Form Label field', + }, + generalHideSelect: { + [MIN_GRAFANA_VERSION]: 'Variable editor Form Hide select', + }, + generalHideSelectV2: { + [MIN_GRAFANA_VERSION]: 'data-testid Variable editor Form Hide select', + }, + selectionOptionsMultiSwitch: { + '10.4.0': 'data-testid Variable editor Form Multi switch', + [MIN_GRAFANA_VERSION]: 'Variable editor Form Multi switch', + }, + selectionOptionsIncludeAllSwitch: { + '10.4.0': 'data-testid Variable editor Form IncludeAll switch', + [MIN_GRAFANA_VERSION]: 'Variable editor Form IncludeAll switch', + }, + selectionOptionsCustomAllInput: { + '10.4.0': 'data-testid Variable editor Form IncludeAll field', + [MIN_GRAFANA_VERSION]: 'Variable editor Form IncludeAll field', + }, + previewOfValuesOption: { + '10.4.0': 'data-testid Variable editor Preview of Values option', + [MIN_GRAFANA_VERSION]: 'Variable editor Preview of Values option', + }, + submitButton: { + '10.4.0': 'data-testid Variable editor Run Query button', + [MIN_GRAFANA_VERSION]: 'Variable editor Submit button', + }, + applyButton: { + '9.3.0': 'data-testid Variable editor Apply button', + }, }, QueryVariable: { - queryOptionsDataSourceSelect: Components.DataSourcePicker.inputV2, - queryOptionsRefreshSelect: 'Variable editor Form Query Refresh select', - queryOptionsRefreshSelectV2: 'data-testid Variable editor Form Query Refresh select', - queryOptionsRegExInput: 'Variable editor Form Query RegEx field', - queryOptionsRegExInputV2: 'data-testid Variable editor Form Query RegEx field', - queryOptionsSortSelect: 'Variable editor Form Query Sort select', - queryOptionsSortSelectV2: 'data-testid Variable editor Form Query Sort select', - queryOptionsQueryInput: 'data-testid Variable editor Form Default Variable Query Editor textarea', - valueGroupsTagsEnabledSwitch: 'Variable editor Form Query UseTags switch', - valueGroupsTagsTagsQueryInput: 'Variable editor Form Query TagsQuery field', - valueGroupsTagsTagsValuesQueryInput: 'Variable editor Form Query TagsValuesQuery field', + queryOptionsDataSourceSelect: { + '10.4.0': 'data-testid Select a data source', + '10.0.0': 'data-testid Data source picker select container', + [MIN_GRAFANA_VERSION]: 'Data source picker select container', + }, + queryOptionsRefreshSelect: { + [MIN_GRAFANA_VERSION]: 'Variable editor Form Query Refresh select', + }, + queryOptionsRefreshSelectV2: { + [MIN_GRAFANA_VERSION]: 'data-testid Variable editor Form Query Refresh select', + }, + queryOptionsRegExInput: { + [MIN_GRAFANA_VERSION]: 'Variable editor Form Query RegEx field', + }, + queryOptionsRegExInputV2: { + [MIN_GRAFANA_VERSION]: 'data-testid Variable editor Form Query RegEx field', + }, + queryOptionsSortSelect: { + [MIN_GRAFANA_VERSION]: 'Variable editor Form Query Sort select', + }, + queryOptionsSortSelectV2: { + [MIN_GRAFANA_VERSION]: 'data-testid Variable editor Form Query Sort select', + }, + queryOptionsQueryInput: { + '10.4.0': 'data-testid Variable editor Form Default Variable Query Editor textarea', + }, + valueGroupsTagsEnabledSwitch: { + [MIN_GRAFANA_VERSION]: 'Variable editor Form Query UseTags switch', + }, + valueGroupsTagsTagsQueryInput: { + [MIN_GRAFANA_VERSION]: 'Variable editor Form Query TagsQuery field', + }, + valueGroupsTagsTagsValuesQueryInput: { + [MIN_GRAFANA_VERSION]: 'Variable editor Form Query TagsValuesQuery field', + }, }, ConstantVariable: { - constantOptionsQueryInput: 'Variable editor Form Constant Query field', - constantOptionsQueryInputV2: 'data-testid Variable editor Form Constant Query field', + constantOptionsQueryInput: { + [MIN_GRAFANA_VERSION]: 'Variable editor Form Constant Query field', + }, + constantOptionsQueryInputV2: { + [MIN_GRAFANA_VERSION]: 'data-testid Variable editor Form Constant Query field', + }, }, DatasourceVariable: { - datasourceSelect: 'data-testid datasource variable datasource type', + datasourceSelect: { + [MIN_GRAFANA_VERSION]: 'data-testid datasource variable datasource type', + }, }, TextBoxVariable: { - textBoxOptionsQueryInput: 'Variable editor Form TextBox Query field', - textBoxOptionsQueryInputV2: 'data-testid Variable editor Form TextBox Query field', + textBoxOptionsQueryInput: { + [MIN_GRAFANA_VERSION]: 'Variable editor Form TextBox Query field', + }, + textBoxOptionsQueryInputV2: { + [MIN_GRAFANA_VERSION]: 'data-testid Variable editor Form TextBox Query field', + }, }, CustomVariable: { - customValueInput: 'data-testid custom-variable-input', + customValueInput: { + [MIN_GRAFANA_VERSION]: 'data-testid custom-variable-input', + }, }, IntervalVariable: { - intervalsValueInput: 'data-testid interval variable intervals input', - autoEnabledCheckbox: 'data-testid interval variable auto value checkbox', - stepCountIntervalSelect: 'data-testid interval variable step count input', - minIntervalInput: 'data-testid interval variable mininum interval input', + intervalsValueInput: { + [MIN_GRAFANA_VERSION]: 'data-testid interval variable intervals input', + }, + autoEnabledCheckbox: { + '10.4.0': 'data-testid interval variable auto value checkbox', + }, + stepCountIntervalSelect: { + '10.4.0': 'data-testid interval variable step count input', + }, + minIntervalInput: { + '10.4.0': 'data-testid interval variable mininum interval input', + }, }, GroupByVariable: { - dataSourceSelect: Components.DataSourcePicker.inputV2, - infoText: 'data-testid group by variable info text', - modeToggle: 'data-testid group by variable mode toggle', + dataSourceSelect: { + '10.4.0': 'data-testid Select a data source', + }, + infoText: { + '10.4.0': 'data-testid group by variable info text', + }, + modeToggle: { + '10.4.0': 'data-testid group by variable mode toggle', + }, }, AdHocFiltersVariable: { - datasourceSelect: Components.DataSourcePicker.inputV2, - infoText: 'data-testid ad-hoc filters variable info text', - modeToggle: 'data-testid ad-hoc filters variable mode toggle', + datasourceSelect: { + '10.4.0': 'data-testid Select a data source', + }, + infoText: { + '10.4.0': 'data-testid ad-hoc filters variable info text', + }, + modeToggle: { + '11.0.0': 'data-testid ad-hoc filters variable mode toggle', + }, }, }, }, }, Annotations: { - marker: 'data-testid annotation-marker', + marker: { + '10.0.0': 'data-testid annotation-marker', + }, }, Rows: { Repeated: { ConfigSection: { - warningMessage: 'data-testid Repeated rows warning message', + warningMessage: { + '10.2.0': 'data-testid Repeated rows warning message', + }, }, }, }, }, Dashboards: { - url: '/dashboards', - /** - * @deprecated use components.Search.dashboardItem from Grafana 8.3 instead - */ - dashboards: (title: string) => `Dashboard search item ${title}`, + url: { + [MIN_GRAFANA_VERSION]: '/dashboards', + }, + dashboards: { + '10.2.0': (title: string) => `Dashboard search item ${title}`, + }, }, SaveDashboardAsModal: { - newName: 'Save dashboard title field', - save: 'Save dashboard button', + newName: { + '10.2.0': 'Save dashboard title field', + }, + save: { + '10.2.0': 'Save dashboard button', + }, }, SaveDashboardModal: { - save: 'Dashboard settings Save Dashboard Modal Save button', - saveVariables: 'Dashboard settings Save Dashboard Modal Save variables checkbox', - saveTimerange: 'Dashboard settings Save Dashboard Modal Save timerange checkbox', - saveRefresh: 'Dashboard settings Save Dashboard Modal Save refresh checkbox', + save: { + '10.2.0': 'Dashboard settings Save Dashboard Modal Save button', + }, + saveVariables: { + '10.2.0': 'Dashboard settings Save Dashboard Modal Save variables checkbox', + }, + saveTimerange: { + '10.2.0': 'Dashboard settings Save Dashboard Modal Save timerange checkbox', + }, + saveRefresh: { + '11.1.0': 'Dashboard settings Save Dashboard Modal Save refresh checkbox', + }, }, SharePanelModal: { - linkToRenderedImage: 'Link to rendered image', + linkToRenderedImage: { + [MIN_GRAFANA_VERSION]: 'Link to rendered image', + }, }, ShareDashboardModal: { PublicDashboard: { - WillBePublicCheckbox: 'data-testid public dashboard will be public checkbox', - LimitedDSCheckbox: 'data-testid public dashboard limited datasources checkbox', - CostIncreaseCheckbox: 'data-testid public dashboard cost may increase checkbox', - PauseSwitch: 'data-testid public dashboard pause switch', - EnableAnnotationsSwitch: 'data-testid public dashboard on off switch for annotations', - CreateButton: 'data-testid public dashboard create button', - DeleteButton: 'data-testid public dashboard delete button', - CopyUrlInput: 'data-testid public dashboard copy url input', - CopyUrlButton: 'data-testid public dashboard copy url button', - SettingsDropdown: 'data-testid public dashboard settings dropdown', - TemplateVariablesWarningAlert: 'data-testid public dashboard disabled template variables alert', - UnsupportedDataSourcesWarningAlert: 'data-testid public dashboard unsupported data sources alert', - NoUpsertPermissionsWarningAlert: 'data-testid public dashboard no upsert permissions alert', - EnableTimeRangeSwitch: 'data-testid public dashboard on off switch for time range', + WillBePublicCheckbox: { + '9.1.0': 'data-testid public dashboard will be public checkbox', + }, + LimitedDSCheckbox: { + '9.1.0': 'data-testid public dashboard limited datasources checkbox', + }, + CostIncreaseCheckbox: { + '9.1.0': 'data-testid public dashboard cost may increase checkbox', + }, + PauseSwitch: { + '9.5.0': 'data-testid public dashboard pause switch', + }, + EnableAnnotationsSwitch: { + '9.3.0': 'data-testid public dashboard on off switch for annotations', + }, + CreateButton: { + '9.5.0': 'data-testid public dashboard create button', + }, + DeleteButton: { + '9.3.0': 'data-testid public dashboard delete button', + }, + CopyUrlInput: { + '9.1.0': 'data-testid public dashboard copy url input', + }, + CopyUrlButton: { + '9.1.0': 'data-testid public dashboard copy url button', + }, + SettingsDropdown: { + '10.1.0': 'data-testid public dashboard settings dropdown', + }, + TemplateVariablesWarningAlert: { + '9.1.0': 'data-testid public dashboard disabled template variables alert', + }, + UnsupportedDataSourcesWarningAlert: { + '9.5.0': 'data-testid public dashboard unsupported data sources alert', + }, + NoUpsertPermissionsWarningAlert: { + '9.5.0': 'data-testid public dashboard no upsert permissions alert', + }, + EnableTimeRangeSwitch: { + '9.4.0': 'data-testid public dashboard on off switch for time range', + }, EmailSharingConfiguration: { - Container: 'data-testid email sharing config container', - ShareType: 'data-testid public dashboard share type', - EmailSharingInput: 'data-testid public dashboard email sharing input', - EmailSharingInviteButton: 'data-testid public dashboard email sharing invite button', - EmailSharingList: 'data-testid public dashboard email sharing list', - DeleteEmail: 'data-testid public dashboard delete email button', - ReshareLink: 'data-testid public dashboard reshare link button', + Container: { + '9.5.0': 'data-testid email sharing config container', + }, + ShareType: { + '9.5.0': 'data-testid public dashboard share type', + }, + EmailSharingInput: { + '9.5.0': 'data-testid public dashboard email sharing input', + }, + EmailSharingInviteButton: { + '9.5.0': 'data-testid public dashboard email sharing invite button', + }, + EmailSharingList: { + '9.5.0': 'data-testid public dashboard email sharing list', + }, + DeleteEmail: { + '9.5.0': 'data-testid public dashboard delete email button', + }, + ReshareLink: { + '9.5.0': 'data-testid public dashboard reshare link button', + }, }, }, SnapshotScene: { - url: (key: string) => `/dashboard/snapshot/${key}`, - PublishSnapshot: 'data-testid publish snapshot button', - CopyUrlButton: 'data-testid snapshot copy url button', - CopyUrlInput: 'data-testid snapshot copy url input', + url: { + '11.1.0': (key: string) => `/dashboard/snapshot/${key}`, + }, + PublishSnapshot: { + '11.1.0': 'data-testid publish snapshot button', + }, + CopyUrlButton: { + '11.1.0': 'data-testid snapshot copy url button', + }, + CopyUrlInput: { + '11.1.0': 'data-testid snapshot copy url input', + }, }, }, ShareDashboardDrawer: { ShareInternally: { - container: 'data-testid share internally drawer container', - lockTimeRangeSwitch: 'data-testid share internally lock time range switch', - shortenUrlSwitch: 'data-testid share internally shorten url switch', - copyUrlButton: 'data-testid share internally copy url button', + container: { + '11.3.0': 'data-testid share internally drawer container', + }, + lockTimeRangeSwitch: { + '11.3.0': 'data-testid share internally lock time range switch', + }, + shortenUrlSwitch: { + '11.3.0': 'data-testid share internally shorten url switch', + }, + copyUrlButton: { + '11.3.0': 'data-testid share internally copy url button', + }, }, ShareExternally: { - container: 'data-testid share externally drawer container', - publicAlert: 'data-testid public share alert', - emailSharingAlert: 'data-testid email share alert', - shareTypeSelect: 'data-testid share externally share type select', + container: { + '11.3.0': 'data-testid share externally drawer container', + }, + publicAlert: { + '11.3.0': 'data-testid public share alert', + }, + emailSharingAlert: { + '11.3.0': 'data-testid email share alert', + }, + shareTypeSelect: { + '11.3.0': 'data-testid share externally share type select', + }, Creation: { PublicShare: { - createButton: 'data-testid public share dashboard create button', - cancelButton: 'data-testid public share dashboard cancel button', + createButton: { + '11.3.0': 'data-testid public share dashboard create button', + }, + cancelButton: { + '11.3.0': 'data-testid public share dashboard cancel button', + }, }, EmailShare: { - createButton: 'data-testid email share dashboard create button', - cancelButton: 'data-testid email share dashboard cancel button', + createButton: { + '11.3.0': 'data-testid email share dashboard create button', + }, + cancelButton: { + '11.3.0': 'data-testid email share dashboard cancel button', + }, + }, + willBePublicCheckbox: { + '11.3.0': 'data-testid share dashboard will be public checkbox', }, - willBePublicCheckbox: 'data-testid share dashboard will be public checkbox', }, Configuration: { - enableTimeRangeSwitch: 'data-testid share externally enable time range switch', - enableAnnotationsSwitch: 'data-testid share externally enable annotations switch', - copyUrlButton: 'data-testid share externally copy url button', - revokeAccessButton: 'data-testid share externally revoke access button', - toggleAccessButton: 'data-testid share externally pause or resume access button', + enableTimeRangeSwitch: { + '11.3.0': 'data-testid share externally enable time range switch', + }, + enableAnnotationsSwitch: { + '11.3.0': 'data-testid share externally enable annotations switch', + }, + copyUrlButton: { + '11.3.0': 'data-testid share externally copy url button', + }, + revokeAccessButton: { + '11.3.0': 'data-testid share externally revoke access button', + }, + toggleAccessButton: { + '11.3.0': 'data-testid share externally pause or resume access button', + }, }, }, ShareSnapshot: { - url: (key: string) => `/dashboard/snapshot/${key}`, - container: 'data-testid share snapshot drawer container', - publishSnapshot: 'data-testid share snapshot publish button', - copyUrlButton: 'data-testid share snapshot copy url button', + url: { + '11.3.0': (key: string) => `/dashboard/snapshot/${key}`, + }, + container: { + '11.3.0': 'data-testid share snapshot drawer container', + }, + publishSnapshot: { + '11.3.0': 'data-testid share snapshot publish button', + }, + copyUrlButton: { + '11.3.0': 'data-testid share snapshot copy url button', + }, }, }, ExportDashboardDrawer: { ExportAsJson: { - container: 'data-testid export as json drawer container', - codeEditor: 'data-testid export as json code editor', - exportExternallyToggle: 'data-testid export as json externally switch', - saveToFileButton: 'data-testid export as json save to file button', - copyToClipboardButton: 'data-testid export as json copy to clipboard button', - cancelButton: 'data-testid export as json cancel button', + container: { + '11.3.0': 'data-testid export as json drawer container', + }, + codeEditor: { + '11.3.0': 'data-testid export as json code editor', + }, + exportExternallyToggle: { + '11.3.0': 'data-testid export as json externally switch', + }, + saveToFileButton: { + '11.3.0': 'data-testid export as json save to file button', + }, + copyToClipboardButton: { + '11.3.0': 'data-testid export as json copy to clipboard button', + }, + cancelButton: { + '11.3.0': 'data-testid export as json cancel button', + }, }, }, PublicDashboard: { - page: 'public-dashboard-page', - NotAvailable: { - container: 'public-dashboard-not-available', - title: 'public-dashboard-title', - pausedDescription: 'public-dashboard-paused-description', + page: { + '9.5.0': 'public-dashboard-page', + }, + NotAvailable: { + container: { + '9.5.0': 'public-dashboard-not-available', + }, + title: { + '9.5.0': 'public-dashboard-title', + }, + pausedDescription: { + '9.5.0': 'public-dashboard-paused-description', + }, + }, + footer: { + '11.0.0': 'public-dashboard-footer', }, - footer: 'public-dashboard-footer', }, PublicDashboardScene: { - loadingPage: 'public-dashboard-scene-loading-page', - page: 'public-dashboard-scene-page', - controls: 'public-dashboard-controls', + loadingPage: { + '11.0.0': 'public-dashboard-scene-loading-page', + }, + page: { + '11.0.0': 'public-dashboard-scene-page', + }, + controls: { + '11.0.0': 'public-dashboard-controls', + }, }, RequestViewAccess: { - form: 'request-view-access-form', - recipientInput: 'request-view-access-recipient-input', - submitButton: 'request-view-access-submit-button', + form: { + '9.5.0': 'request-view-access-form', + }, + recipientInput: { + '9.5.0': 'request-view-access-recipient-input', + }, + submitButton: { + '9.5.0': 'request-view-access-submit-button', + }, }, PublicDashboardConfirmAccess: { - submitButton: 'data-testid confirm-access-submit-button', + submitButton: { + '10.2.0': 'data-testid confirm-access-submit-button', + }, }, Explore: { - url: '/explore', + url: { + [MIN_GRAFANA_VERSION]: '/explore', + }, General: { - container: 'data-testid Explore', - graph: 'Explore Graph', - table: 'Explore Table', - scrollView: 'data-testid explorer scroll view', + container: { + [MIN_GRAFANA_VERSION]: 'data-testid Explore', + }, + graph: { + [MIN_GRAFANA_VERSION]: 'Explore Graph', + }, + table: { + [MIN_GRAFANA_VERSION]: 'Explore Table', + }, + scrollView: { + '9.0.0': 'data-testid explorer scroll view', + }, }, QueryHistory: { - container: 'data-testid QueryHistory', + container: { + '11.1.0': 'data-testid QueryHistory', + }, }, }, SoloPanel: { - url: (page: string) => `/d-solo/${page}`, + url: { + [MIN_GRAFANA_VERSION]: (page: string) => `/d-solo/${page}`, + }, }, PluginsList: { - page: 'Plugins list page', - list: 'Plugins list', - listItem: 'Plugins list item', - signatureErrorNotice: 'data-testid Unsigned plugins notice', + page: { + [MIN_GRAFANA_VERSION]: 'Plugins list page', + }, + list: { + [MIN_GRAFANA_VERSION]: 'Plugins list', + }, + listItem: { + [MIN_GRAFANA_VERSION]: 'Plugins list item', + }, + signatureErrorNotice: { + '10.3.0': 'data-testid Unsigned plugins notice', + [MIN_GRAFANA_VERSION]: 'Unsigned plugins notice', + }, }, PluginPage: { - page: 'Plugin page', - signatureInfo: 'data-testid Plugin signature info', - disabledInfo: 'data-testid Plugin disabled info', + page: { + [MIN_GRAFANA_VERSION]: 'Plugin page', + }, + signatureInfo: { + '10.3.0': 'data-testid Plugin signature info', + [MIN_GRAFANA_VERSION]: 'Plugin signature info', + }, + disabledInfo: { + '10.3.0': 'data-testid Plugin disabled info', + [MIN_GRAFANA_VERSION]: 'Plugin disabled info', + }, }, PlaylistForm: { - name: 'Playlist name', - interval: 'Playlist interval', - itemDelete: 'data-testid playlist-form-delete-item', + name: { + [MIN_GRAFANA_VERSION]: 'Playlist name', + }, + interval: { + [MIN_GRAFANA_VERSION]: 'Playlist interval', + }, + itemDelete: { + '10.2.0': 'data-testid playlist-form-delete-item', + }, }, BrowseDashboards: { table: { - body: 'data-testid browse-dashboards-table', - row: (name: string) => `data-testid browse dashboards row ${name}`, - checkbox: (uid: string) => `data-testid ${uid} checkbox`, + body: { + '10.2.0': 'data-testid browse-dashboards-table', + }, + row: { + '10.2.0': (name: string) => `data-testid browse dashboards row ${name}`, + }, + checkbox: { + '10.0.0': (uid: string) => `data-testid ${uid} checkbox`, + }, }, NewFolderForm: { - form: 'data-testid new folder form', - nameInput: 'data-testid new-folder-name-input', - createButton: 'data-testid new-folder-create-button', + form: { + '10.2.0': 'data-testid new folder form', + }, + nameInput: { + '10.2.0': 'data-testid new-folder-name-input', + }, + createButton: { + '10.2.0': 'data-testid new-folder-create-button', + }, }, }, Search: { - url: '/?search=openn', + url: { + '9.3.0': '/?search=openn', + }, FolderView: { - url: '/?search=open&layout=folders', + url: { + '9.3.0': '/?search=open&layout=folders', + }, }, }, PublicDashboards: { ListItem: { - linkButton: 'public-dashboard-link-button', - configButton: 'public-dashboard-configuration-button', - trashcanButton: 'public-dashboard-remove-button', - pauseSwitch: 'data-testid public dashboard pause switch', + linkButton: { + '9.3.0': 'public-dashboard-link-button', + }, + configButton: { + '9.3.0': 'public-dashboard-configuration-button', + }, + trashcanButton: { + '9.3.0': 'public-dashboard-remove-button', + }, + pauseSwitch: { + '10.1.0': 'data-testid public dashboard pause switch', + }, }, }, UserListPage: { tabs: { - allUsers: 'data-testid all-users-tab', - orgUsers: 'data-testid org-users-tab', - anonUserDevices: 'data-testid anon-user-devices-tab', - publicDashboardsUsers: 'data-testid public-dashboards-users-tab', - users: 'data-testid users-tab', + allUsers: { + '10.0.0': 'data-testid all-users-tab', + }, + orgUsers: { + '10.0.0': 'data-testid org-users-tab', + }, + anonUserDevices: { + '10.2.3': 'data-testid anon-user-devices-tab', + }, + publicDashboardsUsers: { + '10.0.0': 'data-testid public-dashboards-users-tab', + }, + users: { + '10.0.0': 'data-testid users-tab', + }, }, org: { - url: '/org/users', + url: { + '9.5.0': '/org/users', + }, }, admin: { - url: '/admin/users', + url: { + '9.5.0': '/admin/users', + }, }, publicDashboards: { - container: 'data-testid public-dashboards-users-list', + container: { + '11.1.0': 'data-testid public-dashboards-users-list', + }, }, UserListAdminPage: { - container: 'data-testid user-list-admin-page', + container: { + '10.0.0': 'data-testid user-list-admin-page', + }, }, UsersListPage: { - container: 'data-testid users-list-page', + container: { + '10.0.0': 'data-testid users-list-page', + }, }, UserAnonListPage: { - container: 'data-testid user-anon-list-page', + container: { + '10.4.0': 'data-testid user-anon-list-page', + }, }, UsersListPublicDashboardsPage: { - container: 'data-testid users-list-public-dashboards-page', + container: { + '10.0.0': 'data-testid users-list-public-dashboards-page', + }, DashboardsListModal: { - listItem: (uid: string) => `data-testid dashboards-list-item-${uid}`, + listItem: { + '10.0.0': (uid: string) => `data-testid dashboards-list-item-${uid}`, + }, }, }, }, ProfilePage: { - url: '/profile', + url: { + '10.2.0': '/profile', + }, }, -}; + Plugin: { + url: { + [MIN_GRAFANA_VERSION]: (pluginId: string) => `/plugins/${pluginId}`, + }, + }, +} satisfies VersionedSelectorGroup; + +export type VersionedPages = typeof versionedPages; diff --git a/packages/grafana-e2e-selectors/src/types/selectors.ts b/packages/grafana-e2e-selectors/src/types/selectors.ts index 6b9e9a02294..036d6f36d4d 100644 --- a/packages/grafana-e2e-selectors/src/types/selectors.ts +++ b/packages/grafana-e2e-selectors/src/types/selectors.ts @@ -1,42 +1,67 @@ /** * A string selector - * - * @alpha */ export type StringSelector = string; /** - * A function selector with an argument - * - * @alpha + * A function selector with one argument */ export type FunctionSelector = (id: string) => string; +/** + * A function selector with two arguments + */ +export type FunctionSelectorTwoArgs = (arg1: string, arg2: string) => string; + /** * A function selector without argument - * - * @alpha */ export type CssSelector = () => string; -/** - * @alpha - */ export interface Selectors { - [key: string]: StringSelector | FunctionSelector | CssSelector | UrlSelector | Selectors; + [key: string]: StringSelector | FunctionSelector | FunctionSelectorTwoArgs | CssSelector | UrlSelector | Selectors; } -/** - * @alpha - */ export type E2ESelectors = { [P in keyof S]: S[P]; }; -/** - * @alpha - */ export interface UrlSelector extends Selectors { url: string | FunctionSelector; } + +export type VersionedFunctionSelector1 = Record; + +export type VersionedFunctionSelector2 = Record; + +export type VersionedStringSelector = Record; + +export type VersionedCssSelector = Record; + +export type VersionedUrlSelector = Record; + +export type VersionedSelectors = + | VersionedFunctionSelector1 + | VersionedFunctionSelector2 + | VersionedStringSelector + | VersionedCssSelector + | VersionedUrlSelector; + +export type VersionedSelectorGroup = { + [property: string]: VersionedSelectors | VersionedSelectorGroup; +}; + +export type SelectorsOf = { + [Property in keyof T]: T[Property] extends VersionedFunctionSelector1 + ? FunctionSelector + : T[Property] extends VersionedFunctionSelector2 + ? FunctionSelectorTwoArgs + : T[Property] extends VersionedStringSelector + ? StringSelector + : T[Property] extends VersionedCssSelector + ? CssSelector + : T[Property] extends VersionedUrlSelector + ? UrlSelector + : SelectorsOf; +}; diff --git a/yarn.lock b/yarn.lock index cb68c5c390b..7c092690394 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3609,12 +3609,14 @@ __metadata: "@grafana/tsconfig": "npm:^2.0.0" "@rollup/plugin-node-resolve": "npm:15.3.0" "@types/node": "npm:20.16.15" + "@types/semver": "npm:7.5.8" esbuild: "npm:0.24.0" rimraf: "npm:6.0.1" rollup: "npm:^4.22.4" rollup-plugin-dts: "npm:^6.1.1" rollup-plugin-esbuild: "npm:6.1.1" rollup-plugin-node-externals: "npm:^7.1.3" + semver: "npm:7.6.3" tslib: "npm:2.7.0" typescript: "npm:5.5.4" languageName: unknown