From 4275f2dc8c14ed4b38ab6e13ff99221178f1990d Mon Sep 17 00:00:00 2001
From: Jev Forsberg <46619047+baldm0mma@users.noreply.github.com>
Date: Tue, 21 Nov 2023 09:31:56 -0700
Subject: [PATCH] Chore: Update e2e selectors for Transformations (#78426)

* baldm0mma/e2e_selector_migration/ update labels

* baldm0mma/e2e_selector_migration/ run prettier

* baldm0mma/e2e_selector_migration/ add test

* baldm0mma/ update results

* baldm0mma/e2e_selector_migration/ update betterer
---
 .betterer.results                                             | 4 +---
 e2e/panels-suite/panelEdit_transforms.spec.ts                 | 1 +
 packages/grafana-e2e-selectors/src/selectors/components.ts    | 4 ++--
 .../features/transformers/editors/ReduceTransformerEditor.tsx | 4 ++--
 4 files changed, 6 insertions(+), 7 deletions(-)

diff --git a/.betterer.results b/.betterer.results
index b27d682ee35..f2a8a36ed1c 100644
--- a/.betterer.results
+++ b/.betterer.results
@@ -4979,9 +4979,7 @@ exports[`better eslint`] = {
       [0, 0, 0, "Styles should be written using objects.", "2"]
     ],
     "public/app/features/transformers/editors/ReduceTransformerEditor.tsx:5381": [
-      [0, 0, 0, "Use data-testid for E2E selectors instead of aria-label", "0"],
-      [0, 0, 0, "Use data-testid for E2E selectors instead of aria-label", "1"],
-      [0, 0, 0, "Do not use any type assertions.", "2"]
+      [0, 0, 0, "Do not use any type assertions.", "0"]
     ],
     "public/app/features/transformers/editors/RenameByRegexTransformer.tsx:5381": [
       [0, 0, 0, "Styles should be written using objects.", "0"],
diff --git a/e2e/panels-suite/panelEdit_transforms.spec.ts b/e2e/panels-suite/panelEdit_transforms.spec.ts
index 5cc191d000d..5027da1670c 100644
--- a/e2e/panels-suite/panelEdit_transforms.spec.ts
+++ b/e2e/panels-suite/panelEdit_transforms.spec.ts
@@ -11,5 +11,6 @@ describe('Panel edit tests - transformations', () => {
     e2e.components.Tab.title('Transform data').should('be.visible').click();
     e2e.components.TransformTab.newTransform('Reduce').scrollIntoView().should('be.visible').click();
     e2e.components.Transforms.Reduce.calculationsLabel().should('be.visible');
+    e2e.components.Transforms.Reduce.modeLabel().should('be.visible');
   });
 });
diff --git a/packages/grafana-e2e-selectors/src/selectors/components.ts b/packages/grafana-e2e-selectors/src/selectors/components.ts
index a4d03a8d1f2..6154f3e3bdd 100644
--- a/packages/grafana-e2e-selectors/src/selectors/components.ts
+++ b/packages/grafana-e2e-selectors/src/selectors/components.ts
@@ -229,8 +229,8 @@ export const Components = {
   Transforms: {
     card: (name: string) => `data-testid New transform ${name}`,
     Reduce: {
-      modeLabel: 'Transform mode label',
-      calculationsLabel: 'Transform calculations label',
+      modeLabel: 'data-testid Transform mode label',
+      calculationsLabel: 'data-testid Transform calculations label',
     },
     SpatialOperations: {
       actionLabel: 'root Action field property editor',
diff --git a/public/app/features/transformers/editors/ReduceTransformerEditor.tsx b/public/app/features/transformers/editors/ReduceTransformerEditor.tsx
index f3415aa335a..5e5640dbf74 100644
--- a/public/app/features/transformers/editors/ReduceTransformerEditor.tsx
+++ b/public/app/features/transformers/editors/ReduceTransformerEditor.tsx
@@ -58,7 +58,7 @@ export const ReduceTransformerEditor = ({ options, onChange }: TransformerUIProp
 
   return (
     <>
-      <InlineField label="Mode" aria-label={selectors.components.Transforms.Reduce.modeLabel} grow labelWidth={16}>
+      <InlineField label="Mode" data-testid={selectors.components.Transforms.Reduce.modeLabel} grow labelWidth={16}>
         <Select
           options={modes}
           value={modes.find((v) => v.value === options.mode) || modes[0]}
@@ -67,7 +67,7 @@ export const ReduceTransformerEditor = ({ options, onChange }: TransformerUIProp
       </InlineField>
       <InlineField
         label="Calculations"
-        aria-label={selectors.components.Transforms.Reduce.calculationsLabel}
+        data-testid={selectors.components.Transforms.Reduce.calculationsLabel}
         grow
         labelWidth={16}
       >