diff --git a/packages/table/src/cell/editableCell.tsx b/packages/table/src/cell/editableCell.tsx index 44c4844d25..99e0427973 100644 --- a/packages/table/src/cell/editableCell.tsx +++ b/packages/table/src/cell/editableCell.tsx @@ -22,6 +22,7 @@ import { Hotkey, Hotkeys, HotkeysTarget, + IEditableTextProps, Utils as CoreUtils, } from "@blueprintjs/core"; @@ -65,6 +66,11 @@ export interface IEditableCellProps extends ICellProps { * were originally provided via props. */ onConfirm?: (value: string, rowIndex?: number, columnIndex?: number) => void; + + /** + * Props that should be passed to the EditableText when it is used to edit + */ + editableTextProps?: IEditableTextProps; } export interface IEditableCellState { @@ -121,17 +127,27 @@ export class EditableCell extends React.Component", () => { it("renders", () => { const elem = mount(); - expect(elem.find(`.${Classes.TABLE_TRUNCATED_TEXT}`).text()).to.equal("test-value-5000"); + expect(elem.find(`.${TableClasses.TABLE_TRUNCATED_TEXT}`).text()).to.equal("test-value-5000"); }); it("renders loading state", () => { @@ -39,10 +40,10 @@ describe("", () => { const VALUE_2 = "bar"; const elem = mount(); - expect(elem.find(`.${Classes.TABLE_TRUNCATED_TEXT}`).text()).to.equal(VALUE_1); + expect(elem.find(`.${TableClasses.TABLE_TRUNCATED_TEXT}`).text()).to.equal(VALUE_1); elem.setProps({ value: VALUE_2 }); - expect(elem.find(`.${Classes.TABLE_TRUNCATED_TEXT}`).text()).to.equal(VALUE_2); + expect(elem.find(`.${TableClasses.TABLE_TRUNCATED_TEXT}`).text()).to.equal(VALUE_2); }); it("edits", () => { @@ -83,7 +84,7 @@ describe("", () => { // start editing elem.setState({ isEditing: true, dirtyValue: "test-value-5000" }); - const input = elem.find(`.${Classes.TABLE_EDITABLE_TEXT} input`); + const input = elem.find(`.${TableClasses.TABLE_EDITABLE_TEXT} input`); expect(input.length).to.equal(1); // make changes @@ -139,11 +140,41 @@ describe("", () => { it("defaults to no wrapText", () => { const elem = mount(); - expect(elem.find(`.${Classes.TABLE_NO_WRAP_TEXT}`).exists()).to.be.true; + expect(elem.find(`.${TableClasses.TABLE_NO_WRAP_TEXT}`).exists()).to.be.true; }); it("wraps text when wrapText is true", () => { const elem = mount(); - expect(elem.find(`.${Classes.TABLE_NO_WRAP_TEXT}`).exists()).to.be.false; + expect(elem.find(`.${TableClasses.TABLE_NO_WRAP_TEXT}`).exists()).to.be.false; + }); + + it("Passes editableTextProps to inner EditableText", () => { + const onCancel = sinon.spy(); + const onChange = sinon.spy(); + const onConfirm = sinon.spy(); + + const elem = mount( + , + ); + + // start editing + elem.setState({ isEditing: true, dirtyValue: "test-value-5000" }); + const input = elem.find("input"); + // input props that EditableCell does not care about should pass through unchanged + expect(input.prop("maxLength")).to.equal(345); + expect(elem.find(`.${Classes.EDITABLE_TEXT}`).prop("className")).to.contain("input-only-class"); + + // But special values should be overridden by EditableCell + expect(input.prop("value")).to.equal("test-value-5000"); }); });