diff --git a/docs/components/TextInput.md b/docs/components/TextInput.md index 4d0dbd1a..8e2ce968 100644 --- a/docs/components/TextInput.md +++ b/docs/components/TextInput.md @@ -106,7 +106,8 @@ Callback that is called when the text input is focused. Callback that is called when a key is pressed. This will be called with `{ nativeEvent: { key: keyValue } }` where keyValue is 'Enter` or 'Backspace' for respective keys and the typed-in character otherwise including ' ' for space. -Fires before onChange callbacks. +Modifier keys are also included in the nativeEvent. Fires before onChange +callbacks. **onSelectionChange**: ?function diff --git a/src/components/TextInput/__tests__/index-test.js b/src/components/TextInput/__tests__/index-test.js index 0be0e031..0696b6dc 100644 --- a/src/components/TextInput/__tests__/index-test.js +++ b/src/components/TextInput/__tests__/index-test.js @@ -147,7 +147,7 @@ describe('components/TextInput', () => { }); describe('prop "onKeyPress"', () => { - test('enter', done => { + test('enter key', done => { const input = findNativeInput(mount()); input.simulate('keyPress', { which: 13 }); function onKeyPress(e) { @@ -156,7 +156,7 @@ describe('components/TextInput', () => { } }); - test('space', done => { + test('space key', done => { const input = findNativeInput(mount()); input.simulate('keyPress', { which: 32 }); function onKeyPress(e) { @@ -165,7 +165,7 @@ describe('components/TextInput', () => { } }); - test('backspace', done => { + test('backspace key', done => { const input = findNativeInput(mount()); input.simulate('keyDown', { which: 8 }); function onKeyPress(e) { @@ -174,7 +174,7 @@ describe('components/TextInput', () => { } }); - test('text', done => { + test('text key', done => { const input = findNativeInput(mount()); input.simulate('keyPress', { which: 97 }); function onKeyPress(e) { @@ -182,6 +182,33 @@ describe('components/TextInput', () => { done(); } }); + + test('target element is included', done => { + const input = findNativeInput(mount()); + input.simulate('keyPress'); + function onKeyPress(e) { + expect(e.nativeEvent.target).toBeDefined(); + done(); + } + }); + + test('modifier keys', done => { + const input = findNativeInput(mount()); + input.simulate('keyPress', { + altKey: true, + ctrlKey: true, + metaKey: true, + shiftKey: true, + which: 97 + }); + function onKeyPress(e) { + expect(e.nativeEvent.altKey).toEqual(true); + expect(e.nativeEvent.ctrlKey).toEqual(true); + expect(e.nativeEvent.metaKey).toEqual(true); + expect(e.nativeEvent.shiftKey).toEqual(true); + done(); + } + }); }); test('prop "onSelectionChange"', done => { diff --git a/src/components/TextInput/index.js b/src/components/TextInput/index.js index 3467d5bd..16837c4c 100644 --- a/src/components/TextInput/index.js +++ b/src/components/TextInput/index.js @@ -306,7 +306,15 @@ class TextInput extends Component { } if (keyValue) { - onKeyPress({ nativeEvent: { key: keyValue } }); + const nativeEvent = { + altKey: e.altKey, + ctrlKey: e.ctrlKey, + key: keyValue, + metaKey: e.metaKey, + shiftKey: e.shiftKey, + target: e.target + }; + onKeyPress({ nativeEvent }); } }