[AO] update data-test-subj for the Threshold rule-related components to collect telemetry. (#161368)

## Summary

It fixes #161366
This commit is contained in:
Faisal Kanout 2023-07-07 21:08:45 +03:00 committed by GitHub
parent 67fc8333e7
commit f0bd9bfb89
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
10 changed files with 20 additions and 18 deletions

View file

@ -69,8 +69,8 @@ describe('AlertDetailsAppSection', () => {
it('should render rule and alert data', async () => {
const result = renderComponent();
expect((await result.findByTestId('metricThresholdAppSection')).children.length).toBe(3);
expect(result.getByTestId('threshold-2000-2500')).toBeTruthy();
expect((await result.findByTestId('thresholdRuleAppSection')).children.length).toBe(3);
expect(result.getByTestId('thresholdRule-2000-2500')).toBeTruthy();
});
it('should render rule link', async () => {
@ -81,7 +81,7 @@ describe('AlertDetailsAppSection', () => {
{
label: 'Rule',
value: (
<EuiLink data-test-subj="alertDetailsAppSectionRuleLink" href={ruleLink}>
<EuiLink data-test-subj="thresholdRuleAlertDetailsAppSectionRuleLink" href={ruleLink}>
Monitoring hosts
</EuiLink>
),

View file

@ -108,7 +108,7 @@ export default function AlertDetailsAppSection({
}
),
value: (
<EuiLink data-test-subj="alertDetailsAppSectionRuleLink" href={ruleLink}>
<EuiLink data-test-subj="thresholdRuleAlertDetailsAppSectionRuleLink" href={ruleLink}>
{rule.name}
</EuiLink>
),
@ -117,7 +117,7 @@ export default function AlertDetailsAppSection({
}, [alert, rule, ruleLink, setAlertSummaryFields]);
return !!rule.params.criteria ? (
<EuiFlexGroup direction="column" data-test-subj="metricThresholdAppSection">
<EuiFlexGroup direction="column" data-test-subj="thresholdRuleAppSection">
{rule.params.criteria.map((criterion, index) => (
<EuiFlexItem key={generateUniqueKey(criterion)}>
<EuiPanel hasBorder hasShadow={false}>

View file

@ -107,7 +107,7 @@ export const ChartContainer: React.FC = ({ children }) => (
export function NoDataState() {
return (
<EmptyContainer>
<EuiText color="subdued" data-test-subj="noChartData">
<EuiText color="subdued" data-test-subj="thresholdRuleNoChartData">
<FormattedMessage
id="xpack.observability.threshold.rule..charts.noDataMessage"
defaultMessage="No chart data available"
@ -120,7 +120,7 @@ export function NoDataState() {
export function LoadingState() {
return (
<EmptyContainer>
<EuiText color="subdued" data-test-subj="loadingData">
<EuiText color="subdued" data-test-subj="thresholdRuleLoadingData">
<EuiLoadingChart size="m" />
</EuiText>
</EmptyContainer>
@ -130,7 +130,7 @@ export function LoadingState() {
export function ErrorState() {
return (
<EmptyContainer>
<EuiText color="subdued" data-test-subj="chartErrorState">
<EuiText color="subdued" data-test-subj="thresholdRuleChartErrorState">
<FormattedMessage
id="xpack.observability.threshold.rule..charts.errorMessage"
defaultMessage="Uh oh, something went wrong"

View file

@ -84,6 +84,6 @@ describe('ExpressionChart', () => {
comparator: Comparator.GT_OR_EQ,
};
const { wrapper } = await setup(expression);
expect(wrapper.find('[data-test-subj~="noChartData"]').exists()).toBeTruthy();
expect(wrapper.find('[data-test-subj~="thresholdRuleNoChartData"]').exists()).toBeTruthy();
});
});

View file

@ -109,7 +109,10 @@ describe('ExpressionRow', () => {
const { wrapper } = await setup(expression as MetricExpression);
const helpText = wrapper.find('[data-test-subj="ofExpression"]').at(0).prop('helpText');
const helpText = wrapper
.find('[data-test-subj="thresholdRuleOfExpression"]')
.at(0)
.prop('helpText');
expect(helpText).toMatchSnapshot();
});

View file

@ -151,7 +151,7 @@ export const ExpressionRow: React.FC<ExpressionRowProps> = (props) => {
<EuiButtonIcon
iconType={isExpanded ? 'arrowDown' : 'arrowRight'}
onClick={toggle}
data-test-subj="expandRow"
data-test-subj="thresholdRuleExpandRow"
aria-label={i18n.translate(
'xpack.observability.threshold.rule.alertFlyout.expandRowLabel',
{
@ -164,7 +164,7 @@ export const ExpressionRow: React.FC<ExpressionRowProps> = (props) => {
<StyledExpressionRow style={{ gap: aggType !== 'custom' ? 24 : 12 }}>
<StyledExpression>
<EuiExpression
data-test-subj="customEquationWhen"
data-test-subj="thresholdRuleCustomEquationWhen"
description={i18n.translate(
'xpack.observability.thresholdRule.expressionItems.descriptionLabel',
{
@ -204,7 +204,7 @@ export const ExpressionRow: React.FC<ExpressionRowProps> = (props) => {
}}
/>
}
data-test-subj="ofExpression"
data-test-subj="thresholdRuleOfExpression"
/>
</StyledExpression>
)}

View file

@ -50,7 +50,7 @@ export function MetricsExplorerGroupBy({
return (
<EuiComboBox
data-test-subj="metricsExplorer-groupBy"
data-test-subj="thresholdRuleMetricsExplorer-groupBy"
placeholder={i18n.translate('xpack.observability.threshold.ruleExplorer.groupByLabel', {
defaultMessage: 'Everything',
})}

View file

@ -138,7 +138,6 @@ export function MetricsAlertDropdown() {
].concat(canCreateAlerts ? [infrastructureAlertsPanel, metricsAlertsPanel] : []),
[infrastructureAlertsPanel, metricsAlertsPanel, firstPanelMenuItems, canCreateAlerts]
);
return (
<>
<EuiPopover
@ -150,7 +149,7 @@ export function MetricsAlertDropdown() {
iconSide={'right'}
iconType={'arrowDown'}
onClick={togglePopover}
data-test-subj="thresholdRulestructure-alerts-and-rules"
data-test-subj="thresholdRuleStructure-alerts-and-rules"
>
<FormattedMessage
id="xpack.observability.threshold.rule.alertsButton"

View file

@ -39,6 +39,6 @@ describe('Threshold', () => {
it('shows component', () => {
const component = renderComponent();
expect(component.queryByTestId('threshold-90-93')).toBeTruthy();
expect(component.queryByTestId('thresholdRule-90-93')).toBeTruthy();
});
});

View file

@ -48,7 +48,7 @@ export function Threshold({
minWidth: '100%',
}}
hasShadow={false}
data-test-subj={`threshold-${threshold}-${value}`}
data-test-subj={`thresholdRule-${threshold}-${value}`}
>
<Chart>
<Settings theme={theme} baseTheme={baseTheme} />