IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-25 18:55:37 -06:00
Code Issues Packages Projects Releases Wiki Activity

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

Browse Source 
* 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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
packages/grafana-e2e-selectors/src/selectors/components.ts
View File

@ -661,6 +661,12 @@ export const versionedComponents = {
newEvaluationGroupCreate: { newEvaluationGroupCreate: {
'11.1.0': 'data-testid alert-rule new-evaluation-group-create-button', '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: { Alert: {
alertV2: { alertV2: {

9
public/app/features/alerting/unified/components/rule-editor/RuleEditorSection.tsx
View File

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

6
public/test/helpers/alertingRuleEditor.tsx
View File

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