[table] fix(EditableCell): support tabIndex prop correctly (#3687)

palantir · Aug 19, 2019 · 3632e68 · 3632e68 · blueprint-bot · Aug 19, 2019
1 parent 659034c
commit 3632e68
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 2 deletions.
diff --git a/packages/table/src/cell/editableCell.tsx b/packages/table/src/cell/editableCell.tsx
@@ -190,8 +190,10 @@ export class EditableCell extends React.Component<IEditableCellProps, IEditableC
     }
 
     public renderHotkeys() {
+        const { tabIndex } = this.props;
+
         return (
-            <Hotkeys>
+            <Hotkeys tabIndex={tabIndex}>
                 <Hotkey
                     key="edit-cell"
                     label="Edit the currently focused cell"

diff --git a/packages/table/test/editableCellTests.tsx b/packages/table/test/editableCellTests.tsx
@@ -21,7 +21,7 @@ import * as sinon from "sinon";
 
 import { Classes } from "@blueprintjs/core";
 import * as TableClasses from "../src/common/classes";
-import { EditableCell } from "../src/index";
+import { Cell, EditableCell } from "../src/index";
 import { CellType, expectCellLoading } from "./cellTestUtils";
 
 describe("<EditableCell>", () => {
@@ -35,6 +35,22 @@ describe("<EditableCell>", () => {
         expectCellLoading(editableCellHarness.first().getDOMNode(), CellType.BODY_CELL);
     });
 
+    it("renders cell with default tabIndex as zero", () => {
+        const tabIndex = 0;
+        const elem = mount(<EditableCell value="test-value-5000" />);
+        const cellInstance = elem.find(Cell).instance() as Cell;
+
+        expect(cellInstance.props.tabIndex).to.equal(tabIndex);
+    });
+
+    it("renders cell with tabIndex", () => {
+        const tabIndex = 1;
+        const elem = mount(<EditableCell tabIndex={tabIndex} value="test-value-5000" />);
+        const cellInstance = elem.find(Cell).instance() as Cell;
+
+        expect(cellInstance.props.tabIndex).to.equal(tabIndex);
+    });
+
     it("renders new value if props.value changes", () => {
         const VALUE_1 = "foo";
         const VALUE_2 = "bar";