Selectors: Add selectors for alert rule steps (#99553)

* add selectors for alert rule steps

* refactor alert rule tests
This commit is contained in:
Erik Sundell 2025-01-27 13:57:31 +01:00 committed by GitHub
parent 103a8f0793
commit 394d081df2
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 14 additions and 7 deletions

View File

@ -661,6 +661,12 @@ export const versionedComponents = {
newEvaluationGroupCreate: {
'11.1.0': 'data-testid alert-rule new-evaluation-group-create-button',
},
step: {
'11.5.0': (stepNo: string) => `data-testid alert-rule step-${stepNo}`,
},
stepAdvancedModeSwitch: {
'11.5.0': (stepNo: string) => `data-testid advanced-mode-switch step-${stepNo}`,
},
},
Alert: {
alertV2: {

View File

@ -3,6 +3,7 @@ import * as React from 'react';
import { ReactElement } from 'react';
import { GrafanaTheme2 } from '@grafana/data';
import { selectors } from '@grafana/e2e-selectors';
import { FieldSet, InlineSwitch, Stack, Text, useStyles2 } from '@grafana/ui';
export interface RuleEditorSectionProps {
@ -25,8 +26,9 @@ export const RuleEditorSection = ({
switchMode,
}: React.PropsWithChildren<RuleEditorSectionProps>) => {
const styles = useStyles2(getStyles);
const AlertRuleSelectors = selectors.components.AlertRules;
return (
<div className={styles.parent}>
<div className={styles.parent} data-testid={AlertRuleSelectors.step(stepNo.toString())}>
<FieldSet
className={cx(fullWidth && styles.fullWidth)}
label={
@ -37,10 +39,7 @@ export const RuleEditorSection = ({
{switchMode && (
<Text variant="bodySmall">
<InlineSwitch
id={`advanced-switch-${stepNo}`}
data-testid={
switchMode.isAdvancedMode ? `advanced-switch-${stepNo}-advanced` : `advanced-switch-${stepNo}-basic`
}
data-testid={AlertRuleSelectors.stepAdvancedModeSwitch(stepNo.toString())}
value={switchMode.isAdvancedMode}
onChange={(event) => {
switchMode.setAdvancedMode(event.currentTarget.checked);

View File

@ -31,8 +31,10 @@ export const ui = {
contactPoint: byTestId('contact-point-picker'),
routingOptions: byText(/muting, grouping and timings \(optional\)/i),
},
switchModeBasic: (stepNo: GrafanaRuleFormStep) => byTestId(`advanced-switch-${stepNo}-basic`),
switchModeAdvanced: (stepNo: GrafanaRuleFormStep) => byTestId(`advanced-switch-${stepNo}-advanced`),
switchModeBasic: (stepNo: GrafanaRuleFormStep) =>
byTestId(selectors.components.AlertRules.stepAdvancedModeSwitch(stepNo.toString())),
switchModeAdvanced: (stepNo: GrafanaRuleFormStep) =>
byTestId(selectors.components.AlertRules.stepAdvancedModeSwitch(stepNo.toString())),
},
buttons: {
saveAndExit: byRole('button', { name: 'Save rule and exit' }),