enable jsx-a11y/no-autofocus (#56288)

.eslintrc

@@ -101,7 +101,12 @@
         "jsx-a11y/media-has-caption": "error",
         "jsx-a11y/mouse-events-have-key-events": "off",
         "jsx-a11y/no-access-key": "error",
-        "jsx-a11y/no-autofocus": "off",
+        "jsx-a11y/no-autofocus": [
+          "error",
+          {
+            "ignoreNonDOM": true
+          }
+        ],
         "jsx-a11y/no-distracting-elements": "error",
         "jsx-a11y/no-interactive-element-to-noninteractive-role": "error",
         "jsx-a11y/no-noninteractive-element-interactions": [

packages/grafana-ui/src/components/Segment/SegmentInput.tsx

@@ -74,6 +74,8 @@ export function SegmentInput<T>({
     <input
       {...rest}
       ref={ref}
+      // this needs to autofocus, but it's ok as it's only rendered by choice
+      // eslint-disable-next-line jsx-a11y/no-autofocus
       autoFocus
       className={cx(`gf-form gf-form-input`, inputWidthStyle)}
       value={value}

public/app/features/search/components/DashboardSearch.tsx

@@ -41,7 +41,6 @@ export function DashboardSearch({}: Props) {
               onKeyDown={onKeyDown}
               spellCheck={false}
               className={styles.input}
-              autoFocus
             />
           </div>
 

public/app/features/search/components/DashboardSearchModal.tsx

@@ -70,7 +70,6 @@ export function DashboardSearchModal({ isOpen }: Props) {
                   tabIndex={0}
                   spellCheck={false}
                   className={styles.input}
-                  autoFocus
                 />
               </div>