Skip to content

Commit 4322e2d

Browse files
kibanamachinegeorgianaonoleata1904adcoelho
authored
[8.19] [ResponseOps] Fixes for a11y issues (#224838) (#226110)
# Backport This will backport the following commits from `main` to `8.19`: - [[ResponseOps] Fixes for a11y issues (#224838)](#224838) <!--- Backport version: 9.6.6 --> ### Questions ? Please refer to the [Backport tool documentation](https://github.com/sorenlouv/backport) <!--BACKPORT [{"author":{"name":"Georgiana-Andreea Onoleață","email":"[email protected]"},"sourceCommit":{"committedDate":"2025-07-02T09:10:42Z","message":"[ResponseOps] Fixes for a11y issues (#224838)\n\nCloses https://github.com/elastic/kibana/issues/224043\nCloses https://github.com/elastic/kibana/issues/224021\nCloses https://github.com/elastic/kibana/issues/224031\nCloses https://github.com/elastic/kibana/issues/224029\nCloses https://github.com/elastic/kibana/issues/224022\nCloses https://github.com/elastic/kibana/issues/223893\nCloses https://github.com/elastic/kibana/issues/223892\nCloses https://github.com/elastic/kibana/issues/223876\nCloses https://github.com/elastic/kibana/issues/223549\nCloses #223512 \nCloses https://github.com/elastic/kibana/issues/223514\n\n## Summary\n\n- added missing `aria-labels`\n\n---------\n\nCo-authored-by: Antonio <[email protected]>","sha":"62dfee23e40ce2314e4007dc19a4a628305672f9","branchLabelMapping":{"^v9.2.0$":"main","^v(\\d+).(\\d+).\\d+$":"$1.$2"}},"sourcePullRequest":{"labels":["bug","release_note:skip","Team:ResponseOps","backport:version","v9.1.0","v8.19.0","v9.2.0","v8.18.4","v9.0.4","v8.17.9"],"title":"[ResponseOps] Fixes for a11y issues","number":224838,"url":"https://github.com/elastic/kibana/pull/224838","mergeCommit":{"message":"[ResponseOps] Fixes for a11y issues (#224838)\n\nCloses https://github.com/elastic/kibana/issues/224043\nCloses https://github.com/elastic/kibana/issues/224021\nCloses https://github.com/elastic/kibana/issues/224031\nCloses https://github.com/elastic/kibana/issues/224029\nCloses https://github.com/elastic/kibana/issues/224022\nCloses https://github.com/elastic/kibana/issues/223893\nCloses https://github.com/elastic/kibana/issues/223892\nCloses https://github.com/elastic/kibana/issues/223876\nCloses https://github.com/elastic/kibana/issues/223549\nCloses #223512 \nCloses https://github.com/elastic/kibana/issues/223514\n\n## Summary\n\n- added missing `aria-labels`\n\n---------\n\nCo-authored-by: Antonio <[email protected]>","sha":"62dfee23e40ce2314e4007dc19a4a628305672f9"}},"sourceBranch":"main","suggestedTargetBranches":["9.1","8.19","8.18","9.0","8.17"],"targetPullRequestStates":[{"branch":"9.1","label":"v9.1.0","branchLabelMappingKey":"^v(\\d+).(\\d+).\\d+$","isSourceBranch":false,"state":"NOT_CREATED"},{"branch":"8.19","label":"v8.19.0","branchLabelMappingKey":"^v(\\d+).(\\d+).\\d+$","isSourceBranch":false,"state":"NOT_CREATED"},{"branch":"main","label":"v9.2.0","branchLabelMappingKey":"^v9.2.0$","isSourceBranch":true,"state":"MERGED","url":"https://github.com/elastic/kibana/pull/224838","number":224838,"mergeCommit":{"message":"[ResponseOps] Fixes for a11y issues (#224838)\n\nCloses https://github.com/elastic/kibana/issues/224043\nCloses https://github.com/elastic/kibana/issues/224021\nCloses https://github.com/elastic/kibana/issues/224031\nCloses https://github.com/elastic/kibana/issues/224029\nCloses https://github.com/elastic/kibana/issues/224022\nCloses https://github.com/elastic/kibana/issues/223893\nCloses https://github.com/elastic/kibana/issues/223892\nCloses https://github.com/elastic/kibana/issues/223876\nCloses https://github.com/elastic/kibana/issues/223549\nCloses #223512 \nCloses https://github.com/elastic/kibana/issues/223514\n\n## Summary\n\n- added missing `aria-labels`\n\n---------\n\nCo-authored-by: Antonio <[email protected]>","sha":"62dfee23e40ce2314e4007dc19a4a628305672f9"}},{"branch":"8.18","label":"v8.18.4","branchLabelMappingKey":"^v(\\d+).(\\d+).\\d+$","isSourceBranch":false,"state":"NOT_CREATED"},{"branch":"9.0","label":"v9.0.4","branchLabelMappingKey":"^v(\\d+).(\\d+).\\d+$","isSourceBranch":false,"state":"NOT_CREATED"},{"branch":"8.17","label":"v8.17.9","branchLabelMappingKey":"^v(\\d+).(\\d+).\\d+$","isSourceBranch":false,"state":"NOT_CREATED"}]}] BACKPORT--> Co-authored-by: Georgiana-Andreea Onoleață <[email protected]> Co-authored-by: Antonio <[email protected]>
1 parent ac95f4a commit 4322e2d

File tree

21 files changed

+130
-31
lines changed

21 files changed

+130
-31
lines changed

‎src/platform/packages/shared/kbn-alerts-ui-shared/src/rule_settings/rule_settings_flapping_title_tooltip.tsx‎

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -62,6 +62,13 @@ const flappingOffContentSettings = i18n.translate(
6262
}
6363
);
6464

65+
const alertFlappingTitleInfo = i18n.translate(
66+
'alertsUIShared.ruleSettingsFlappingTitleTooltip.alertFlappingTitleInfo',
67+
{
68+
defaultMessage: 'Rule settings flapping title info',
69+
}
70+
);
71+
6572
interface RuleSettingsFlappingTitleTooltipProps {
6673
isOpen: boolean;
6774
setIsPopoverOpen: (isOpen: boolean) => void;
@@ -87,7 +94,7 @@ export const RuleSettingsFlappingTitleTooltip = (props: RuleSettingsFlappingTitl
8794
display="empty"
8895
color="primary"
8996
iconType="question"
90-
aria-label="Flapping title info"
97+
aria-label={alertFlappingTitleInfo}
9198
onClick={() => setIsPopoverOpen(!isOpen)}
9299
/>
93100
}

‎src/platform/packages/shared/kbn-alerts-ui-shared/src/rule_settings/rule_settings_range_input.tsx‎

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -30,8 +30,14 @@ export const RuleSettingsRangeInput = memo((props: RuleSettingsRangeInputProps)
3030
<div>
3131
{label}
3232
&nbsp;
33-
{labelPopoverText && (
34-
<EuiIconTip color="subdued" size="s" type="question" content={labelPopoverText} />
33+
{labelPopoverText && label && (
34+
<EuiIconTip
35+
color="subdued"
36+
size="s"
37+
type="question"
38+
content={labelPopoverText}
39+
aria-label={String(label)}
40+
/>
3541
)}
3642
</div>
3743
);

‎src/platform/packages/shared/response-ops/alerts-fields-browser/components/categories_selector/categories_selector.tsx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -145,6 +145,7 @@ const CategoriesSelectorComponent: React.FC<CategoriesSelectorProps> = ({
145145
isOpen={isPopoverOpen}
146146
closePopover={closePopover}
147147
panelPaddingSize="none"
148+
aria-label={i18n.FILTER_OPTIONS_LABEL}
148149
>
149150
<div
150151
css={styles.selectableContainer}

‎src/platform/packages/shared/response-ops/alerts-fields-browser/components/field_browser_modal/field_browser_modal.tsx‎

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -137,7 +137,11 @@ const FieldBrowserModalComponent: React.FC<FieldBrowserModalProps> = ({
137137
];
138138

139139
return (
140-
<EuiModal onClose={closeAndRestoreFocus} style={{ width, maxWidth: width }}>
140+
<EuiModal
141+
onClose={closeAndRestoreFocus}
142+
style={{ width, maxWidth: width }}
143+
aria-label={i18n.FIELDS_BROWSER}
144+
>
141145
<div data-test-subj="fields-browser-container" className="eui-yScroll">
142146
<EuiModalHeader>
143147
<EuiModalHeaderTitle>{i18n.FIELDS_BROWSER}</EuiModalHeaderTitle>

‎src/platform/packages/shared/response-ops/alerts-fields-browser/components/search/search.tsx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,7 @@ export const Search = React.memo<Props>(({ isSearching, onSearchInputChange, sea
2727
placeholder={i18n.FILTER_PLACEHOLDER}
2828
value={searchInput}
2929
fullWidth
30+
aria-label={i18n.FIELDS_SEARCH}
3031
/>
3132
));
3233
Search.displayName = 'Search';

‎src/platform/packages/shared/response-ops/alerts-fields-browser/translations.ts‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -42,6 +42,10 @@ export const FIELDS_BROWSER = i18n.translate('responseOpsAlertsFieldsBrowser.fie
4242
defaultMessage: 'Fields',
4343
});
4444

45+
export const FIELDS_SEARCH = i18n.translate('responseOpsAlertsFieldsBrowser.fieldBrowserSearch', {
46+
defaultMessage: 'Search',
47+
});
48+
4549
export const DESCRIPTION = i18n.translate('responseOpsAlertsFieldsBrowser.descriptionLabel', {
4650
defaultMessage: 'Description',
4751
});
@@ -87,6 +91,13 @@ export const NO_FIELDS_MATCH = i18n.translate('responseOpsAlertsFieldsBrowser.no
8791
defaultMessage: 'No fields match',
8892
});
8993

94+
export const FILTER_OPTIONS_LABEL = i18n.translate(
95+
'responseOpsAlertsFieldsBrowser.filterOptionsLabel',
96+
{
97+
defaultMessage: 'Search field for filtering options',
98+
}
99+
);
100+
90101
export const NO_FIELDS_MATCH_INPUT = (searchInput: string) =>
91102
i18n.translate('responseOpsAlertsFieldsBrowser.noFieldsMatchInputLabel', {
92103
defaultMessage: 'No fields match {searchInput}',

‎src/platform/packages/shared/response-ops/alerts-table/components/alerts_flyout.tsx‎

Lines changed: 23 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,8 @@ import {
2020
} from '@elastic/eui';
2121
import usePrevious from 'react-use/lib/usePrevious';
2222
import type { Alert } from '@kbn/alerting-types';
23+
import { ALERT_RULE_CATEGORY } from '@kbn/rule-data-utils';
24+
2325
import { DefaultAlertsFlyoutBody, DefaultAlertsFlyoutHeader } from './default_alerts_flyout';
2426
import {
2527
AdditionalContext,
@@ -59,6 +61,7 @@ export const AlertsFlyout = <AC extends AdditionalContext>({
5961
} = renderContext;
6062
const Footer: FlyoutSectionRenderer<AC> | undefined = renderFlyoutFooter;
6163
const prevAlert = usePrevious(alert);
64+
6265
const props = useMemo(
6366
() =>
6467
({
@@ -100,8 +103,27 @@ export const AlertsFlyout = <AC extends AdditionalContext>({
100103
[Footer, props]
101104
);
102105

106+
const ALERT_FLYOUT_ARIA_LABEL =
107+
alert && alert[ALERT_RULE_CATEGORY]
108+
? i18n.translate('xpack.triggersActionsUI.sections.alertsTable.alertsFlyout.ariaLabel', {
109+
defaultMessage: '{alertCategory}',
110+
values: { alertCategory: String(alert[ALERT_RULE_CATEGORY]) },
111+
})
112+
: i18n.translate(
113+
'xpack.triggersActionsUI.sections.alertsTable.alertsFlyout.ariaLabelDefault',
114+
{
115+
defaultMessage: 'Alert details',
116+
}
117+
);
118+
103119
return (
104-
<EuiFlyout onClose={onClose} size="m" data-test-subj="alertsFlyout" ownFocus={flyoutOwnsFocus}>
120+
<EuiFlyout
121+
onClose={onClose}
122+
size="m"
123+
data-test-subj="alertsFlyout"
124+
ownFocus={flyoutOwnsFocus}
125+
aria-label={ALERT_FLYOUT_ARIA_LABEL}
126+
>
105127
{isLoading && <EuiProgress size="xs" color="accent" data-test-subj="alertsFlyoutLoading" />}
106128
<EuiFlyoutHeader hasBorder>
107129
<FlyoutHeader />

‎src/platform/packages/shared/response-ops/rule_form/src/rule_actions/rule_actions_connectors_modal.tsx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -49,6 +49,7 @@ export const RuleActionsConnectorsModal = () => {
4949
overflow: responsiveOverflow,
5050
}}
5151
data-test-subj="ruleActionsConnectorsModal"
52+
aria-label={ACTION_TYPE_MODAL_TITLE}
5253
>
5354
<EuiModalHeader>
5455
<EuiModalHeaderTitle size="s">{ACTION_TYPE_MODAL_TITLE}</EuiModalHeaderTitle>

‎src/platform/packages/shared/response-ops/rule_form/src/rule_definition/rule_consumer_selection.tsx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -98,6 +98,7 @@ export const RuleConsumerSelection = (props: RuleConsumerSelectionProps) => {
9898
isInvalid={!!baseErrors?.consumer?.length}
9999
error={baseErrors?.consumer}
100100
data-test-subj="ruleConsumerSelection"
101+
aria-label={CONSUMER_SELECT_TITLE}
101102
>
102103
<EuiComboBox
103104
fullWidth

‎src/platform/packages/shared/response-ops/rule_form/src/rule_definition/rule_definition.tsx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -344,6 +344,7 @@ export const RuleDefinition = () => {
344344
position="right"
345345
type="question"
346346
content={ALERT_DELAY_HELP_TEXT}
347+
aria-label={ALERT_DELAY_HELP_TEXT}
347348
/>
348349
</p>
349350
</EuiText>

0 commit comments

Comments
 (0)