fix tree selection via spacebar and release version patch

infinite-table · Oct 29, 2024 · cf78e9d · cf78e9d
1 parent 0644c26
commit cf78e9d
Show file tree

Hide file tree

Showing 2 changed files with 45 additions and 23 deletions.
diff --git a/examples/src/pages/tests/table/treegrid/selection.spec.ts b/examples/src/pages/tests/table/treegrid/selection.spec.ts
@@ -1,27 +1,45 @@
-import { test, expect } from '@testing';
+import { test, expect, Page } from '@testing';
+
+async function getCheckboxes(page: Page) {
+  let checkboxes = await page.$$('.InfiniteBody input[type="checkbox"]');
+
+  return await Promise.all(
+    checkboxes.map(
+      async (checkbox) =>
+        await checkbox.evaluate((el) =>
+          (el as HTMLInputElement).indeterminate
+            ? null
+            : (el as HTMLInputElement).checked,
+        ),
+    ),
+  );
+}
 
 export default test.describe('TreeSelectionProp', () => {
+  test('select via spacebar works', async ({ rowModel, page }) => {
+    await page.waitForInfinite();
+
+    await rowModel.clickRow(0);
+
+    await page.keyboard.press('Space');
+
+    expect(await getCheckboxes(page)).toEqual([
+      true,
+      true,
+      true,
+      true,
+      true,
+      true,
+      true,
+    ]);
+  });
+
   test('when defined, makes selectionMode default to multi-row', async ({
     page,
   }) => {
     await page.waitForInfinite();
 
-    async function getCheckboxes() {
-      let checkboxes = await page.$$('.InfiniteBody input[type="checkbox"]');
-
-      return await Promise.all(
-        checkboxes.map(
-          async (checkbox) =>
-            await checkbox.evaluate((el) =>
-              (el as HTMLInputElement).indeterminate
-                ? null
-                : (el as HTMLInputElement).checked,
-            ),
-        ),
-      );
-    }
-
-    let checkboxes = await getCheckboxes();
+    let checkboxes = await getCheckboxes(page);
     expect(checkboxes.length).toBe(7);
 
     const headerCheckbox = await page.locator(
@@ -40,7 +58,7 @@ export default test.describe('TreeSelectionProp', () => {
 
     await page.click('button:text("Select all")');
 
-    checkboxes = await getCheckboxes();
+    checkboxes = await getCheckboxes(page);
     expect(checkboxes).toEqual([true, true, true, true, true, true, true]);
 
     expect(

diff --git a/source/src/components/DataSource/TreeApi.ts b/source/src/components/DataSource/TreeApi.ts
@@ -292,25 +292,29 @@ export class TreeApiImpl<T> implements TreeApi<T> {
     this.actions.treeSelection = treeSelectionState;
   }
   isNodeSelected(nodePath: NodePath) {
-    const { treeSelection, selectionMode } = this.getState();
+    const {
+      treeSelectionState,
+      treeSelection: singleTreeSelection,
+      selectionMode,
+    } = this.getState();
 
     if (selectionMode === 'single-row') {
       const pk = nodePath[nodePath.length - 1];
-      if (Array.isArray(treeSelection)) {
+      if (Array.isArray(singleTreeSelection)) {
         // @ts-ignore
         return treeSelection.join(',') === nodePath.join(',');
       }
-      return (treeSelection as any) === pk;
+      return (singleTreeSelection as any) === pk;
     }
 
     if (selectionMode !== 'multi-row') {
       throw 'Selection mode is not multi-row or single-row';
     }
-    if (!(treeSelection instanceof TreeSelectionState)) {
+    if (!(treeSelectionState instanceof TreeSelectionState)) {
       throw 'Invalid tree selection';
     }
 
-    return treeSelection.isNodeSelected(nodePath);
+    return treeSelectionState.isNodeSelected(nodePath);
   }
 
   selectNode(nodePath: NodePath) {