Dashboards: Add ids to auto grid inputs for improved a11y (#106430)

public/app/features/dashboard-scene/scene/layout-auto-grid/AutoGridLayoutManagerEditor.tsx

@@ -104,9 +104,15 @@ function GridLayoutColumns({ layoutManager }: { layoutManager: AutoGridLayoutMan
         className={styles.wideSelector}
       >
         {isStandardMinWidth ? (
-          <Combobox options={minWidthOptions} value={columnWidth} onChange={onNamedMinWidthChanged} />
+          <Combobox
+            id="min-column-width"
+            options={minWidthOptions}
+            value={columnWidth}
+            onChange={onNamedMinWidthChanged}
+          />
         ) : (
           <Input
+            id="min-column-width"
             defaultValue={columnWidth}
             onBlur={onCustomMinWidthChanged}
             ref={(ref) => setInputRef(ref)}
@@ -130,6 +136,7 @@ function GridLayoutColumns({ layoutManager }: { layoutManager: AutoGridLayoutMan
       </Field>
       <Field label={t('dashboard.auto-grid.options.max-columns', 'Max columns')} className={styles.narrowSelector}>
         <Combobox
+          id="max-columns"
           options={colOptions}
           value={String(maxColumnCount)}
           onChange={({ value }) => layoutManager.onMaxColumnCountChanged(parseInt(value, 10))}
@@ -210,9 +217,10 @@ function GridLayoutRows({ layoutManager }: { layoutManager: AutoGridLayoutManage
         className={styles.wideSelector}
       >
         {isStandardHeight ? (
-          <Combobox options={minWidthOptions} value={rowHeight} onChange={onNamedMinHeightChanged} />
+          <Combobox id="min-height" options={minWidthOptions} value={rowHeight} onChange={onNamedMinHeightChanged} />
         ) : (
           <Input
+            id="min-height"
             defaultValue={rowHeight}
             onBlur={onCustomHeightChanged}
             ref={(ref) => setInputRef(ref)}
@@ -235,7 +243,11 @@ function GridLayoutRows({ layoutManager }: { layoutManager: AutoGridLayoutManage
         )}
       </Field>
       <Field label={t('dashboard.auto-grid.options.height-fill', 'Fill screen')} className={styles.narrowSelector}>
-        <InlineSwitch value={fillScreen} onChange={() => layoutManager.onFillScreenChanged(!fillScreen)} />
+        <InlineSwitch
+          id="fill-screen-toggle"
+          value={fillScreen}
+          onChange={() => layoutManager.onFillScreenChanged(!fillScreen)}
+        />
       </Field>
     </Stack>
   );