Merge pull request #4862 from Expensify/joe-fix-android-autocomplete

Fix autocomplete issue in VBA flow
Expensify · Aug 26, 2021 · c1bc5bc · c1bc5bc
2 parents 7f921ef + db0e12a
commit c1bc5bc
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 1 deletion.
diff --git a/src/components/ExpensiTextInput/index.android.js b/src/components/ExpensiTextInput/index.android.js
@@ -7,6 +7,10 @@ const ExpensiTextInput = forwardRef((props, ref) => (
     <BaseExpensiTextInput
         // eslint-disable-next-line react/jsx-props-no-spreading
         {...props}
+
+        // Setting autoCompleteType to new-password throws an error on Android, so fall back to password in that case
+        // eslint-disable-next-line react/jsx-props-no-multi-spaces
+        autoCompleteType={props.autoCompleteType === 'new-password' ? 'password' : props.autoCompleteType}
         innerRef={ref}
         inputStyle={[
             styles.expensiTextInput,

diff --git a/src/components/ExpensiTextInput/index.ios.js b/src/components/ExpensiTextInput/index.ios.js
@@ -7,6 +7,10 @@ const ExpensiTextInput = forwardRef((props, ref) => (
     <BaseExpensiTextInput
         // eslint-disable-next-line react/jsx-props-no-spreading
         {...props}
+
+        // Setting autoCompleteType to new-password throws an error on iOS, so fall back to password in that case
+        // eslint-disable-next-line react/jsx-props-no-multi-spaces
+        autoCompleteType={props.autoCompleteType === 'new-password' ? 'password' : props.autoCompleteType}
         innerRef={ref}
         inputStyle={[styles.expensiTextInput]}
     />

diff --git a/src/pages/ReimbursementAccount/CompanyStep.js b/src/pages/ReimbursementAccount/CompanyStep.js
@@ -303,7 +303,6 @@ class CompanyStep extends React.Component {
                                 : ''}
                         />
                         <ExpensiTextInput
-                            autoCompleteType="password"
                             label={`Expensify ${this.props.translate('common.password')}`}
                             containerStyles={[styles.mt4]}
                             secureTextEntry
@@ -319,6 +318,10 @@ class CompanyStep extends React.Component {
                             errorText={error === this.props.translate('common.passwordCannotBeBlank')
                                 ? this.props.translate('common.passwordCannotBeBlank')
                                 : ''}
+
+                            // Use new-password to prevent an autoComplete bug https://github.com/Expensify/Expensify/issues/173177
+                            // eslint-disable-next-line react/jsx-props-no-multi-spaces
+                            autoCompleteType="new-password"
                         />
                         <CheckboxWithLabel
                             isChecked={this.state.hasNoConnectionToCannabis}