From 17ada0dd5afb2ff2c39f7a3af67c5604631959d7 Mon Sep 17 00:00:00 2001
From: 7PH <benjamin.raymond@sonarsource.com>
Date: Tue, 7 Feb 2023 11:35:17 +0100
Subject: [PATCH] SONAR-18357 Remove select clear button from tab navigation in
 quality profiles page

---
 server/sonar-web/src/main/js/components/controls/Select.tsx   | 4 +++-
 .../controls/__tests__/__snapshots__/Select-test.tsx.snap     | 1 +
 server/sonar-web/src/main/js/components/controls/buttons.tsx  | 1 +
 3 files changed, 5 insertions(+), 1 deletion(-)

diff --git a/server/sonar-web/src/main/js/components/controls/Select.tsx b/server/sonar-web/src/main/js/components/controls/Select.tsx
index 4b418357134..3d35a3d6806 100644
--- a/server/sonar-web/src/main/js/components/controls/Select.tsx
+++ b/server/sonar-web/src/main/js/components/controls/Select.tsx
@@ -70,7 +70,9 @@ export function clearIndicator<
   const { innerProps } = props;
   return (
     <div {...innerProps} className="spacer-left spacer-right">
-      <ClearButton className="button-tiny" iconProps={{ size: 12 }} />
+      {/* We use tabindex="-1" to prevent the clear button from being focused via tabbing.*/}
+      {/* This is done to align with react-select default behavior and because backspace already clears the select value. */}
+      <ClearButton className="button-tiny" iconProps={{ size: 12 }} tabIndex={-1} />
     </div>
   );
 }
diff --git a/server/sonar-web/src/main/js/components/controls/__tests__/__snapshots__/Select-test.tsx.snap b/server/sonar-web/src/main/js/components/controls/__tests__/__snapshots__/Select-test.tsx.snap
index 8413389018c..49cb58d74e3 100644
--- a/server/sonar-web/src/main/js/components/controls/__tests__/__snapshots__/Select-test.tsx.snap
+++ b/server/sonar-web/src/main/js/components/controls/__tests__/__snapshots__/Select-test.tsx.snap
@@ -11,6 +11,7 @@ exports[`Select should render clearIndicator correctly 1`] = `
         "size": 12,
       }
     }
+    tabIndex={-1}
   />
 </div>
 `;
diff --git a/server/sonar-web/src/main/js/components/controls/buttons.tsx b/server/sonar-web/src/main/js/components/controls/buttons.tsx
index e00a00300d5..30e037e39b1 100644
--- a/server/sonar-web/src/main/js/components/controls/buttons.tsx
+++ b/server/sonar-web/src/main/js/components/controls/buttons.tsx
@@ -40,6 +40,7 @@ type AllowedButtonAttributes = Pick<
   | 'onBlur'
   | 'onMouseOver'
   | 'onMouseLeave'
+  | 'tabIndex'
 >;
 
 interface ButtonProps extends AllowedButtonAttributes {
-- 
2.39.5