Skip to content

Commit

Permalink
[fix] TextInput autoComplete behavior
Browse files Browse the repository at this point in the history
Fix 'autoComplete' behavior now that Chrome has fixed broken behavior for 'off'.
Add fallback support for React Native's 'autoCompleteType' prop.

Close necolas#1404
  • Loading branch information
necolas committed Dec 18, 2019
1 parent 1f8d815 commit 65be12b
Show file tree
Hide file tree
Showing 3 changed files with 10 additions and 5 deletions.
7 changes: 6 additions & 1 deletion src/exports/TextInput/__tests__/index-test.js
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,12 @@ describe('components/TextInput', () => {

test('value "off"', () => {
const input = findNativeInput(shallow(<TextInput autoComplete="off" />));
expect(input.prop('autoComplete')).toEqual('noop');
expect(input.prop('autoComplete')).toEqual('off');
});

test('autoCompleteType fallback', () => {
const input = findNativeInput(shallow(<TextInput autoCompleteType="off" />));
expect(input.prop('autoComplete')).toEqual('off');
});
});

Expand Down
7 changes: 3 additions & 4 deletions src/exports/TextInput/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -95,7 +95,8 @@ class TextInput extends React.Component<TextInputProps> {
render() {
const {
autoCapitalize = 'sentences',
autoComplete = 'on',
autoComplete,
autoCompleteType,
autoCorrect = true,
autoFocus,
defaultValue,
Expand Down Expand Up @@ -144,9 +145,7 @@ class TextInput extends React.Component<TextInputProps> {

Object.assign(supportedProps, {
autoCapitalize,
// Browser's treat autocomplete "off" as "on"
// https://bugs.chromium.org/p/chromium/issues/detail?id=468153#c164
autoComplete: autoComplete === 'off' ? 'noop' : autoComplete,
autoComplete: autoComplete || autoCompleteType || 'on',
autoCorrect: autoCorrect ? 'on' : 'off',
autoFocus,
classList: [classes.textinput],
Expand Down
1 change: 1 addition & 0 deletions src/exports/TextInput/types.js
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,7 @@ export type TextInputProps = {
...ViewProps,
autoCapitalize?: 'characters' | 'none' | 'sentences' | 'words',
autoComplete?: string,
autoCompleteType?: string, // Compat with React Native (Bug react-native#26003)
autoCorrect?: boolean,
autoFocus?: boolean,
blurOnSubmit?: boolean,
Expand Down

0 comments on commit 65be12b

Please sign in to comment.