@linzjs/step-ag-grid 32.1.0 → 32.1.1

package/package.json

@@ -2,7 +2,7 @@
   "name": "@linzjs/step-ag-grid",
   "repository": "github:linz/step-ag-grid.git",
   "license": "MIT",
-  "version": "32.1.0",
+  "version": "32.1.1",
   "keywords": [
     "aggrid",
     "ag-grid",

package/src/components/gridPopoverEdit/GridEditBoolean.tsx

@@ -75,9 +75,16 @@ const BooleanCellRenderer = (props: CustomCellEditorProps) => {
     if (isDisabled) {
       return;
     }
-    const cell: HTMLElement | null = eGridCell?.querySelector('.ag-cell-focus .grid-edit-boolean input.ag-checkbox-input:not(:disabled)');
-    if (cell && cell.ownerDocument.activeElement !== cell) {
-      cell.focus();
+    const cell: HTMLElement | null = eGridCell?.querySelector(
+      '.ag-cell-focus .grid-edit-boolean input.ag-checkbox-input:not(:disabled)',
+    );
+    if (cell) {
+      // When you redraw a cell the activeElement moves to the cell div away from input
+      // Refocus here if the cell div is active back to the input
+      const activeElement = cell.ownerDocument.activeElement;
+      if (activeElement && activeElement.getAttribute('role') === 'gridcell' && activeElement !== cell) {
+        cell.focus();
+      }
     }
   });
 

package/src/stories/grid/GridPopoutEditBoolean.stories.tsx

@@ -18,6 +18,8 @@ import {
   primitiveToSelectOption,
   wait,
 } from '../..';
+import { expect, userEvent, waitFor } from 'storybook/test';
+
 import { waitForGridReady } from '../../utils/__tests__/storybookTestUtil';
 import { IFormTestRow } from './FormTest';
 
@@ -130,3 +132,23 @@ const GridPopoutEditBooleanTemplate: StoryFn<typeof Grid> = () => {
 
 export const _EditBoolean = GridPopoutEditBooleanTemplate.bind({});
 _EditBoolean.play = waitForGridReady;
+
+export const _EditBooleanRetainsFocusAfterToggle = GridPopoutEditBooleanTemplate.bind({});
+_EditBooleanRetainsFocusAfterToggle.play = async (context) => {
+  await waitForGridReady(context);
+  const { canvasElement } = context;
+
+  // Use bold2 (no async delay) so the redraw happens immediately
+  const getBoolInput = () =>
+    canvasElement.querySelector('.ag-cell[col-id="bold2"] input.ag-checkbox-input') as HTMLElement;
+
+  await userEvent.click(canvasElement.querySelector('.ag-cell[col-id="bold2"]') as HTMLElement);
+  await waitFor(() => expect(getBoolInput()).toHaveFocus(), { timeout: 500 });
+
+  // Space toggles the checkbox, which triggers redrawRows — ag-grid moves focus from the
+  // input to the cell div (role="gridcell"). The shared interval should detect this and restore focus.
+  await userEvent.keyboard(' ');
+
+  // Re-query the input each retry since redraw replaces the DOM node
+  await waitFor(() => expect(getBoolInput()).toHaveFocus(), { timeout: 500 });
+};