diff --git a/packages/react-native-web/src/exports/TextInput/__tests__/index-test.js b/packages/react-native-web/src/exports/TextInput/__tests__/index-test.js index 9e8fccd3..f815b5e7 100644 --- a/packages/react-native-web/src/exports/TextInput/__tests__/index-test.js +++ b/packages/react-native-web/src/exports/TextInput/__tests__/index-test.js @@ -350,12 +350,6 @@ describe('components/TextInput', () => { // assert.equal(input.node.selectionStart, 0) }); - test('prop "value"', () => { - const value = 'value'; - const input = findNativeInput(shallow()); - expect(input.prop('value')).toEqual(value); - }); - describe('prop "selection"', () => { test('set cursor location', () => { const cursorLocation = { start: 3, end: 3 }; @@ -374,4 +368,21 @@ describe('components/TextInput', () => { expect(inputCustomSelection.instance().selectionEnd).toEqual(cursorLocation.end); }); }); + + test('prop "spellCheck"', () => { + // default (inherets from autoCorrect) + let input = findNativeInput(shallow()); + expect(input.prop('spellCheck')).toEqual(true); + input = findNativeInput(shallow()); + expect(input.prop('spellCheck')).toEqual(false); + // false + input = findNativeInput(shallow()); + expect(input.prop('spellCheck')).toEqual(false); + }); + + test('prop "value"', () => { + const value = 'value'; + const input = findNativeInput(shallow()); + expect(input.prop('value')).toEqual(value); + }); }); diff --git a/packages/react-native-web/src/exports/TextInput/index.js b/packages/react-native-web/src/exports/TextInput/index.js index a31e6bcc..1ef27726 100644 --- a/packages/react-native-web/src/exports/TextInput/index.js +++ b/packages/react-native-web/src/exports/TextInput/index.js @@ -110,6 +110,7 @@ class TextInput extends Component<*> { start: number.isRequired, end: number }), + spellCheck: bool, style: StyleSheetPropType(TextInputStylePropTypes), value: string, /* react-native compat */ @@ -130,7 +131,6 @@ class TextInput extends Component<*> { returnKeyType: string, selectionColor: ColorPropType, selectionState: any, - spellCheck: bool, textBreakStrategy: string, underlineColorAndroid: ColorPropType /* eslint-enable */ @@ -185,6 +185,7 @@ class TextInput extends Component<*> { onSubmitEditing, selection, selectTextOnFocus, + spellCheck, /* react-native compat */ caretHidden, clearButtonMode, @@ -202,7 +203,6 @@ class TextInput extends Component<*> { returnKeyType, selectionColor, selectionState, - spellCheck, textBreakStrategy, underlineColorAndroid, /* eslint-enable */ @@ -250,6 +250,7 @@ class TextInput extends Component<*> { onSelect: normalizeEventHandler(this._handleSelectionChange), readOnly: !editable, ref: this._setNode, + spellCheck: spellCheck != null ? spellCheck : autoCorrect, style: [styles.initial, style] }); diff --git a/website/storybook/1-components/TextInput/TextInputScreen.js b/website/storybook/1-components/TextInput/TextInputScreen.js index cd76398b..f8d0d6eb 100644 --- a/website/storybook/1-components/TextInput/TextInputScreen.js +++ b/website/storybook/1-components/TextInput/TextInputScreen.js @@ -95,7 +95,7 @@ const TextInputScreen = () => ( {' '} }} /> + +