Enable "Event Generating Elements Should Be Instrumented" ESLint rule…

… for more O11y Apps (#165647) Co-authored-by: kibanamachine <[email protected]>
elastic · Sep 5, 2023 · 772bc0c · 772bc0c
1 parent 33dcda7
commit 772bc0c
Show file tree

Hide file tree

Showing 80 changed files with 172 additions and 20 deletions.
diff --git a/.eslintrc.js b/.eslintrc.js
@@ -909,11 +909,15 @@ module.exports = {
     {
       files: [
         'x-pack/plugins/apm/**/*.{js,mjs,ts,tsx}',
-        'x-pack/plugins/observability/**/*.{js,mjs,ts,tsx}',
         'x-pack/plugins/exploratory_view/**/*.{js,mjs,ts,tsx}',
-        'x-pack/plugins/ux/**/*.{js,mjs,ts,tsx}',
-        'x-pack/plugins/synthetics/**/*.{js,mjs,ts,tsx}',
         'x-pack/plugins/infra/**/*.{js,mjs,ts,tsx}',
+        'x-pack/plugins/observability/**/*.{js,mjs,ts,tsx}',
+        'x-pack/plugins/observability_ai_assistant/**/*.{js,mjs,ts,tsx}',
+        'x-pack/plugins/observability_onboarding/**/*.{js,mjs,ts,tsx}',
+        'x-pack/plugins/observability_shared/**/*.{js,mjs,ts,tsx}',
+        'x-pack/plugins/profiling/**/*.{js,mjs,ts,tsx}',
+        'x-pack/plugins/synthetics/**/*.{js,mjs,ts,tsx}',
+        'x-pack/plugins/ux/**/*.{js,mjs,ts,tsx}',
       ],
       rules: {
         '@kbn/telemetry/event_generating_elements_should_be_instrumented': 'error',

diff --git a/packages/kbn-eslint-plugin-telemetry/helpers/check_node_for_existing_data_test_subj_prop.ts b/packages/kbn-eslint-plugin-telemetry/helpers/check_node_for_existing_data_test_subj_prop.ts
@@ -37,7 +37,7 @@ export function checkNodeForExistingDataTestSubjProp(
   const variable = getScope().variables.find((v) => v.name === name); // the variable definition of the spreaded variable
 
   return variable && variable.defs.length > 0
-    ? variable.defs[0].node.init.properties.find((property: TSESTree.Property) => {
+    ? variable.defs[0].node.init?.properties.find((property: TSESTree.Property) => {
         if ('value' in property.key) {
           return property.key.value === 'data-test-subj';
         }

diff --git a/...bn-eslint-plugin-telemetry/rules/event_generating_elements_should_be_instrumented.test.ts b/...bn-eslint-plugin-telemetry/rules/event_generating_elements_should_be_instrumented.test.ts
@@ -63,7 +63,8 @@ for (const [name, tester] of [tsTester, babelTester]) {
           ],
           output: `<${element} data-test-subj="Value${element
             .replace('Eui', '')
-            .replace('Empty', '')}">Value</${element}>`,
+            .replace('Empty', '')
+            .replace('Icon', '')}">Value</${element}>`,
         })),
       }
     );

diff --git a/...ges/kbn-eslint-plugin-telemetry/rules/event_generating_elements_should_be_instrumented.ts b/...ges/kbn-eslint-plugin-telemetry/rules/event_generating_elements_should_be_instrumented.ts
@@ -17,6 +17,7 @@ import { getFunctionName } from '../helpers/get_function_name';
 export const EVENT_GENERATING_ELEMENTS = [
   'EuiButton',
   'EuiButtonEmpty',
+  'EuiButtonIcon',
   'EuiLink',
   'EuiFieldText',
   'EuiFieldSearch',
@@ -74,7 +75,7 @@ export const EventGeneratingElementsShouldBeInstrumented: Rule.RuleModule = {
         const intent = getIntentFromNode(parent);
 
         // 4. The element name that generates the events
-        const element = name.replace('Eui', '').replace('Empty', '');
+        const element = name.replace('Eui', '').replace('Empty', '').replace('Icon', '');
 
         const suggestion = `${appName}${componentName}${intent}${element}`; // 'o11yHeaderActionsSubmitButton'
 

diff --git a/x-pack/plugins/apm/public/components/app/help_popover/help_popover.tsx b/x-pack/plugins/apm/public/components/app/help_popover/help_popover.tsx
@@ -51,6 +51,7 @@ export function HelpPopoverButton({
 
   return (
     <EuiButtonIcon
+      data-test-subj="apmHelpPopoverButtonButton"
       className="apmHelpPopover__buttonIcon"
       size="s"
       iconType="help"

diff --git a/x-pack/plugins/apm/public/components/app/onboarding/agent_config_table.tsx b/x-pack/plugins/apm/public/components/app/onboarding/agent_config_table.tsx
@@ -53,6 +53,7 @@ function ConfigurationValueColumn({
       </EuiText>
       {value && (
         <EuiButtonIcon
+          data-test-subj="apmConfigurationValueColumnButton"
           aria-label={i18n.translate(
             'xpack.apm.onboarding.column.value.copyIconText',
             {

diff --git a/x-pack/plugins/apm/public/components/app/onboarding/instructions/otel_agent.tsx b/x-pack/plugins/apm/public/components/app/onboarding/instructions/otel_agent.tsx
@@ -152,6 +152,7 @@ function ConfigurationValueColumn({
       </EuiText>
       {value && (
         <EuiButtonIcon
+          data-test-subj="apmConfigurationValueColumnButton"
           aria-label={i18n.translate(
             'xpack.apm.onboarding.otel.column.value.copyIconText',
             {

diff --git a/x-pack/plugins/apm/public/components/app/settings/agent_configurations/list/index.tsx b/x-pack/plugins/apm/public/components/app/settings/agent_configurations/list/index.tsx
@@ -202,6 +202,7 @@ export function AgentConfigurationList({
             name: '',
             render: (config: Config) => (
               <EuiButtonIcon
+                data-test-subj="apmColumnsButton"
                 aria-label="Edit"
                 iconType="pencil"
                 href={apmRouter.link('/settings/agent-configuration/edit', {
@@ -218,6 +219,7 @@ export function AgentConfigurationList({
             name: '',
             render: (config: Config) => (
               <EuiButtonIcon
+                data-test-subj="apmColumnsButton"
                 aria-label="Delete"
                 iconType="trash"
                 onClick={() => setConfigToBeDeleted(config)}

diff --git a/...gins/apm/public/components/app/settings/agent_keys/create_agent_key/agent_key_callout.tsx b/...gins/apm/public/components/app/settings/agent_keys/create_agent_key/agent_key_callout.tsx
@@ -58,6 +58,7 @@ export function AgentKeyCallOut({ name, token }: Props) {
             <EuiCopy textToCopy={token}>
               {(copy) => (
                 <EuiButtonIcon
+                  data-test-subj="apmAgentKeyCallOutButton"
                   iconType="copyClipboard"
                   onClick={copy}
                   color="success"

diff --git a/.../apm/public/components/fleet_integration/apm_agents/runtime_attachment/discovery_rule.tsx b/.../apm/public/components/fleet_integration/apm_agents/runtime_attachment/discovery_rule.tsx
@@ -99,6 +99,7 @@ export function DiscoveryRule({
               <EuiFlexGroup>
                 <EuiFlexItem grow={false}>
                   <EuiButtonIcon
+                    data-test-subj="apmDiscoveryRuleButton"
                     iconType="pencil"
                     color="primary"
                     onClick={() => {
@@ -108,6 +109,7 @@ export function DiscoveryRule({
                 </EuiFlexItem>
                 <EuiFlexItem grow={false}>
                   <EuiButtonIcon
+                    data-test-subj="apmDiscoveryRuleButton"
                     iconType="trash"
                     color="danger"
                     onClick={() => {

diff --git a/x-pack/plugins/apm/public/components/shared/popover_tooltip/index.tsx b/x-pack/plugins/apm/public/components/shared/popover_tooltip/index.tsx
@@ -28,6 +28,7 @@ export function PopoverTooltip({
       closePopover={() => setIsPopoverOpen(false)}
       button={
         <EuiButtonIcon
+          data-test-subj="apmPopoverTooltipButton"
           aria-label={ariaLabel}
           onClick={(event: React.MouseEvent<HTMLButtonElement>) => {
             setIsPopoverOpen(!isPopoverOpen);

diff --git a/x-pack/plugins/apm/public/components/shared/span_links/span_links_table.tsx b/x-pack/plugins/apm/public/components/shared/span_links/span_links_table.tsx
@@ -142,6 +142,7 @@ export function SpanLinksTable({ items }: Props) {
           <EuiPopover
             button={
               <EuiButtonIcon
+                data-test-subj="apmColumnsButton"
                 aria-label="Edit"
                 iconType="boxesHorizontal"
                 onClick={() => {

diff --git a/x-pack/plugins/apm/public/tutorial/config_agent/opentelemetry_instructions.tsx b/x-pack/plugins/apm/public/tutorial/config_agent/opentelemetry_instructions.tsx
@@ -83,6 +83,7 @@ export function OpenTelemetryInstructions({
           </EuiText>
           {value && (
             <EuiButtonIcon
+              data-test-subj="apmColumnsButton"
               aria-label={i18n.translate(
                 'xpack.apm.tutorial.config_otel.column.value.copyIconText',
                 {

diff --git a/...w/public/components/shared/exploratory_view/components/url_search/selectable_url_list.tsx b/...w/public/components/shared/exploratory_view/components/url_search/selectable_url_list.tsx
@@ -136,6 +136,7 @@ export function SelectableUrlList({
           </EuiFlexItem>
           <EuiFlexItem grow={false}>
             <EuiButtonIcon
+              data-test-subj="exploratoryViewPopOverTitleButton"
               color="text"
               onClick={() => closePopover()}
               aria-label={i18n.translate('xpack.exploratoryView.search.url.close', {

diff --git a/...y_view/public/components/shared/exploratory_view/series_editor/columns/series_actions.tsx b/...y_view/public/components/shared/exploratory_view/series_editor/columns/series_actions.tsx
@@ -72,6 +72,7 @@ export function SeriesActions({ seriesId, series, seriesConfig, onEditClick }: P
 
   const popoverButton = (
     <EuiButtonIcon
+      data-test-subj="exploratoryViewSeriesActionsButton"
       iconType="boxesHorizontal"
       onClick={changePopoverVisibility}
       color="text"

diff --git a/...tory_view/public/components/shared/exploratory_view/series_editor/columns/series_name.tsx b/...tory_view/public/components/shared/exploratory_view/series_editor/columns/series_name.tsx
@@ -101,6 +101,7 @@ export function SeriesName({ series, seriesId }: Props) {
       )}
       <EuiFlexItem grow={false}>
         <EuiButtonIcon
+          data-test-subj="exploratoryViewSeriesNameButton"
           onClick={() => setIsEditingEnabled(!isEditingEnabled)}
           iconType="pencil"
           aria-label={i18n.translate('xpack.exploratoryView.expView.seriesEditor.editName', {

diff --git a/x-pack/plugins/infra/public/alerting/inventory/components/expression.tsx b/x-pack/plugins/infra/public/alerting/inventory/components/expression.tsx
@@ -578,6 +578,7 @@ export const ExpressionRow: React.FC<ExpressionRowProps> = (props) => {
       <EuiFlexGroup gutterSize="xs">
         <EuiFlexItem grow={false}>
           <EuiButtonIcon
+            data-test-subj="infraExpressionRowButton"
             iconType={isExpanded ? 'arrowDown' : 'arrowRight'}
             onClick={toggle}
             aria-label={i18n.translate('xpack.infra.metrics.alertFlyout.expandRowLabel', {
@@ -629,6 +630,7 @@ export const ExpressionRow: React.FC<ExpressionRowProps> = (props) => {
                   />
                 </StyledHealth>
                 <EuiButtonIcon
+                  data-test-subj="infraExpressionRowButton"
                   aria-label={i18n.translate(
                     'xpack.infra.metrics.alertFlyout.removeWarningThreshold',
                     {
@@ -668,6 +670,7 @@ export const ExpressionRow: React.FC<ExpressionRowProps> = (props) => {
         {canDelete && (
           <EuiFlexItem grow={false}>
             <EuiButtonIcon
+              data-test-subj="infraExpressionRowButton"
               aria-label={i18n.translate('xpack.infra.metrics.alertFlyout.removeCondition', {
                 defaultMessage: 'Remove condition',
               })}

diff --git a/x-pack/plugins/infra/public/alerting/inventory/components/metric.tsx b/x-pack/plugins/infra/public/alerting/inventory/components/metric.tsx
@@ -330,6 +330,7 @@ export const ClosablePopoverTitle = ({ children, onClose }: ClosablePopoverTitle
         <EuiFlexItem>{children}</EuiFlexItem>
         <EuiFlexItem grow={false}>
           <EuiButtonIcon
+            data-test-subj="infraClosablePopoverTitleButton"
             iconType="cross"
             color="danger"
             aria-label={i18n.translate(

diff --git a/x-pack/plugins/infra/public/alerting/inventory/components/node_type.tsx b/x-pack/plugins/infra/public/alerting/inventory/components/node_type.tsx
@@ -98,6 +98,7 @@ export const ClosablePopoverTitle = ({ children, onClose }: ClosablePopoverTitle
         <EuiFlexItem>{children}</EuiFlexItem>
         <EuiFlexItem grow={false}>
           <EuiButtonIcon
+            data-test-subj="infraClosablePopoverTitleButton"
             iconType="cross"
             color="danger"
             aria-label={i18n.translate(

diff --git a/...ck/plugins/infra/public/alerting/log_threshold/components/expression_editor/criterion.tsx b/...ck/plugins/infra/public/alerting/log_threshold/components/expression_editor/criterion.tsx
@@ -295,6 +295,7 @@ export const Criterion: React.FC<Props> = ({
       {canDelete && (
         <EuiFlexItem grow={false}>
           <EuiButtonIcon
+            data-test-subj="infraCriterionButton"
             aria-label={i18n.translate('xpack.infra.logs.alertFlyout.removeCondition', {
               defaultMessage: 'Remove condition',
             })}

diff --git a/x-pack/plugins/infra/public/alerting/metric_anomaly/components/node_type.tsx b/x-pack/plugins/infra/public/alerting/metric_anomaly/components/node_type.tsx
@@ -100,6 +100,7 @@ export const ClosablePopoverTitle = ({ children, onClose }: ClosablePopoverTitle
         <EuiFlexItem>{children}</EuiFlexItem>
         <EuiFlexItem grow={false}>
           <EuiButtonIcon
+            data-test-subj="infraClosablePopoverTitleButton"
             iconType="cross"
             color="danger"
             aria-label={i18n.translate(

diff --git a/x-pack/plugins/infra/public/alerting/metric_anomaly/components/severity_threshold.tsx b/x-pack/plugins/infra/public/alerting/metric_anomaly/components/severity_threshold.tsx
@@ -123,6 +123,7 @@ export const ClosablePopoverTitle = ({ children, onClose }: ClosablePopoverTitle
         <EuiFlexItem>{children}</EuiFlexItem>
         <EuiFlexItem grow={false}>
           <EuiButtonIcon
+            data-test-subj="infraClosablePopoverTitleButton"
             iconType="cross"
             color="danger"
             aria-label={i18n.translate(

diff --git a/...infra/public/alerting/metric_threshold/components/custom_equation/metric_row_controls.tsx b/...infra/public/alerting/metric_threshold/components/custom_equation/metric_row_controls.tsx
@@ -18,6 +18,7 @@ export const MetricRowControls = ({ onDelete, disableDelete }: MetricRowControlP
     <>
       <EuiFlexItem grow={0}>
         <EuiButtonIcon
+          data-test-subj="infraMetricRowControlsButton"
           iconType="trash"
           color="danger"
           style={{ marginBottom: '0.2em' }}

diff --git a/x-pack/plugins/infra/public/alerting/metric_threshold/components/expression_row.tsx b/x-pack/plugins/infra/public/alerting/metric_threshold/components/expression_row.tsx
@@ -316,6 +316,7 @@ export const ExpressionRow: React.FC<ExpressionRowProps> = (props) => {
                   />
                 </StyledHealth>
                 <EuiButtonIcon
+                  data-test-subj="infraExpressionRowButton"
                   aria-label={i18n.translate(
                     'xpack.infra.metrics.alertFlyout.removeWarningThreshold',
                     {
@@ -350,6 +351,7 @@ export const ExpressionRow: React.FC<ExpressionRowProps> = (props) => {
         {canDelete && (
           <EuiFlexItem grow={false}>
             <EuiButtonIcon
+              data-test-subj="infraExpressionRowButton"
               aria-label={i18n.translate('xpack.infra.metrics.alertFlyout.removeCondition', {
                 defaultMessage: 'Remove condition',
               })}

diff --git a/x-pack/plugins/infra/public/components/basic_table/row_expansion_button.tsx b/x-pack/plugins/infra/public/components/basic_table/row_expansion_button.tsx
@@ -27,6 +27,7 @@ export const RowExpansionButton = <Item extends any>({
 
   return (
     <EuiButtonIcon
+      data-test-subj="infraRowExpansionButtonButton"
       onClick={handleClick}
       aria-label={isExpanded ? collapseAriaLabel : expandAriaLabel}
       iconType={isExpanded ? 'arrowUp' : 'arrowDown'}

diff --git a/x-pack/plugins/infra/public/components/logging/log_highlights_menu.tsx b/x-pack/plugins/infra/public/components/logging/log_highlights_menu.tsx
@@ -114,6 +114,7 @@ export const LogHighlightsMenu: React.FC<LogHighlightsMenuProps> = ({
           </EuiFlexItem>
           <EuiFlexItem grow={false}>
             <EuiButtonIcon
+              data-test-subj="infraLogHighlightsMenuButton"
               aria-label={goToPreviousHighlightLabel}
               iconType="arrowUp"
               onClick={goToPreviousHighlight}
@@ -123,6 +124,7 @@ export const LogHighlightsMenu: React.FC<LogHighlightsMenuProps> = ({
           </EuiFlexItem>
           <EuiFlexItem grow={false}>
             <EuiButtonIcon
+              data-test-subj="infraLogHighlightsMenuButton"
               aria-label={goToNextHighlightLabel}
               iconType="arrowDown"
               onClick={goToNextHighlight}
@@ -132,6 +134,7 @@ export const LogHighlightsMenu: React.FC<LogHighlightsMenuProps> = ({
           </EuiFlexItem>
           <EuiFlexItem grow={false}>
             <EuiButtonIcon
+              data-test-subj="infraLogHighlightsMenuButton"
               aria-label={clearTermsButtonLabel}
               color="danger"
               isDisabled={highlightTerm === ''}

diff --git a/x-pack/plugins/infra/public/containers/react_query_provider.tsx b/x-pack/plugins/infra/public/containers/react_query_provider.tsx
@@ -39,6 +39,7 @@ function HideableReactQueryDevTools() {
   return !isHidden ? (
     <div>
       <EuiButtonIcon
+        data-test-subj="infraHideableReactQueryDevToolsButton"
         iconType="cross"
         color="primary"
         style={{ zIndex: 99999, position: 'fixed', bottom: '40px', left: '40px' }}

diff --git a/x-pack/plugins/infra/public/pages/logs/log_entry_rate/sections/anomalies/table.tsx b/x-pack/plugins/infra/public/pages/logs/log_entry_rate/sections/anomalies/table.tsx
@@ -299,6 +299,7 @@ const PaginationControls = ({
       <EuiFlexItem grow={false}>
         <EuiFlexGroup>
           <EuiButtonIcon
+            data-test-subj="infraPaginationControlsButton"
             iconType="arrowLeft"
             isDisabled={!fetchPreviousPage || isLoading}
             onClick={fetchPreviousPage}
@@ -308,6 +309,7 @@ const PaginationControls = ({
             <strong>{page}</strong>
           </span>
           <EuiButtonIcon
+            data-test-subj="infraPaginationControlsButton"
             iconType="arrowRight"
             isDisabled={!fetchNextPage || isLoading}
             onClick={fetchNextPage}

diff --git a/...etrics/inventory_view/components/ml/anomaly_detection/anomalies_table/anomalies_table.tsx b/...etrics/inventory_view/components/ml/anomaly_detection/anomalies_table/anomalies_table.tsx
@@ -146,6 +146,7 @@ const AnomalyActionMenu = ({
         panelPaddingSize="none"
         button={
           <EuiButtonIcon
+            data-test-subj="infraAnomalyActionMenuButton"
             iconType="boxesHorizontal"
             onClick={handleToggleMenu}
             aria-label={i18n.translate('xpack.infra.ml.anomalyFlyout.actions.openActionMenu', {

diff --git a/...ges/metrics/inventory_view/components/ml/anomaly_detection/anomalies_table/pagination.tsx b/...ges/metrics/inventory_view/components/ml/anomaly_detection/anomalies_table/pagination.tsx
@@ -36,6 +36,7 @@ export const PaginationControls = ({
       <EuiFlexItem grow={false}>
         <EuiFlexGroup>
           <EuiButtonIcon
+            data-test-subj="infraPaginationControlsButton"
             iconType="arrowLeft"
             isDisabled={!fetchPreviousPage || isLoading}
             onClick={fetchPreviousPage}
@@ -45,6 +46,7 @@ export const PaginationControls = ({
             <strong>{page}</strong>
           </span>
           <EuiButtonIcon
+            data-test-subj="infraPaginationControlsButton"
             iconType="arrowRight"
             isDisabled={!fetchNextPage || isLoading}
             onClick={fetchNextPage}

diff --git a/x-pack/plugins/infra/public/pages/metrics/inventory_view/components/node_details/overlay.tsx b/x-pack/plugins/infra/public/pages/metrics/inventory_view/components/node_details/overlay.tsx
@@ -148,7 +148,12 @@ export const NodeContextPopover = ({
                     </EuiButtonEmpty>
                   </EuiFlexItem>
                   <EuiFlexItem grow={false}>
-                    <EuiButtonIcon size="s" onClick={onClose} iconType="cross" />
+                    <EuiButtonIcon
+                      data-test-subj="infraNodeContextPopoverButton"
+                      size="s"
+                      onClick={onClose}
+                      iconType="cross"
+                    />
                   </EuiFlexItem>
                 </EuiFlexGroup>
               </EuiFlexItem>

diff --git a/...fra/public/pages/metrics/inventory_view/components/node_details/tabs/properties/table.tsx b/...fra/public/pages/metrics/inventory_view/components/node_details/tabs/properties/table.tsx
@@ -65,6 +65,7 @@ export const Table = (props: Props) => {
                     )}
                   >
                     <EuiButtonIcon
+                      data-test-subj="infraColumnsButton"
                       color="text"
                       size="s"
                       iconType="filter"

diff --git a/...ublic/pages/metrics/inventory_view/components/waffle/metric_control/metrics_edit_mode.tsx b/...ublic/pages/metrics/inventory_view/components/waffle/metric_control/metrics_edit_mode.tsx
@@ -39,6 +39,7 @@ export const MetricsEditMode = withTheme(
           >
             <EuiFlexItem grow={false} style={{ width: ICON_WIDTH }}>
               <EuiButtonIcon
+                data-test-subj="infraMetricsEditModeButton"
                 iconType="pencil"
                 onClick={() => onEdit(metric)}
                 aria-label={i18n.translate(
@@ -55,6 +56,7 @@ export const MetricsEditMode = withTheme(
             </EuiFlexItem>
             <EuiFlexItem grow={false} style={{ width: ICON_WIDTH, textAlign: 'right' }}>
               <EuiButtonIcon
+                data-test-subj="infraMetricsEditModeButton"
                 iconType="trash"
                 color="danger"
                 onClick={() => onDelete(metric)}

diff --git a/x-pack/plugins/infra/public/pages/metrics/metric_detail/components/metadata_details.tsx b/x-pack/plugins/infra/public/pages/metrics/metric_detail/components/metadata_details.tsx
@@ -142,6 +142,7 @@ export const MetadataDetails = (props: Props) => {
       {filteredFields.length > NUMBER_OF_COLUMNS ? (
         <Controls>
           <EuiButtonIcon
+            data-test-subj="infraMetadataDetailsButton"
             iconType={isOpen ? 'arrowUp' : 'arrowDown'}
             onClick={toggleIsOpen}
             aria-label={i18n.translate('xpack.infra.nodeDetails.labels.showMoreDetails', {

diff --git a/...k/plugins/observability/public/components/threshold/components/closable_popover_title.tsx b/...k/plugins/observability/public/components/threshold/components/closable_popover_title.tsx
@@ -21,6 +21,7 @@ export function ClosablePopoverTitle({ children, onClose }: ClosablePopoverTitle
         <EuiFlexItem>{children}</EuiFlexItem>
         <EuiFlexItem grow={false}>
           <EuiButtonIcon
+            data-test-subj="o11yClosablePopoverTitleButton"
             iconType="cross"
             color="danger"
             aria-label={i18n.translate(

diff --git a/...ervability/public/components/threshold/components/custom_equation/metric_row_controls.tsx b/...ervability/public/components/threshold/components/custom_equation/metric_row_controls.tsx
@@ -18,6 +18,7 @@ export function MetricRowControls({ onDelete, disableDelete }: MetricRowControlP
     <>
       <EuiFlexItem grow={0}>
         <EuiButtonIcon
+          data-test-subj="o11yMetricRowControlsButton"
           aria-label={DELETE_LABEL}
           iconType="trash"
           color="danger"