Merge pull request #3427 from benjiwheeler/join-flow-autocomplete-3

turn off automplete and autocorrect for join-flow inputs
This commit is contained in:
Benjamin Wheeler 2019-10-11 16:28:25 -04:00 committed by GitHub
commit 757ac80677
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 24 additions and 1 deletions

View file

@ -89,8 +89,12 @@ const FormikRadioButton = ({
>
{isCustomInput && (
<FormikInput
autoCapitalize="off"
autoComplete="off"
autoCorrect="off"
className="formik-radio-input"
name="custom"
spellCheck={false}
wrapperClassName="formik-radio-input-wrapper"
/* eslint-disable react/jsx-no-bind */
onChange={event => onSetCustom(event.target.value)}

View file

@ -161,6 +161,9 @@ class EmailStep extends React.Component {
onSubmit={handleSubmit}
>
<FormikInput
autoCapitalize="off"
autoComplete="off"
autoCorrect="off"
className={classNames(
'join-flow-input',
'join-flow-input-tall',
@ -170,6 +173,7 @@ class EmailStep extends React.Component {
id="email"
name="email"
placeholder={this.props.intl.formatMessage({id: 'general.emailAddress'})}
type="email"
validate={this.validateEmail}
validationClassName="validation-full-width-input"
/* eslint-disable react/jsx-no-bind */

View file

@ -22,7 +22,10 @@ const JoinFlowStep = ({
titleClassName,
waiting
}) => (
<form onSubmit={onSubmit}>
<form
autoComplete="off"
onSubmit={onSubmit}
>
<div className="join-flow-outer-content">
{headerImgSrc && (
<div

View file

@ -143,6 +143,9 @@ class UsernameStep extends React.Component {
{this.props.intl.formatMessage({id: 'registration.createUsername'})}
</div>
<FormikInput
autoCapitalize="off"
autoComplete="off"
autoCorrect="off"
className={classNames(
'join-flow-input'
)}
@ -150,6 +153,7 @@ class UsernameStep extends React.Component {
id="username"
name="username"
placeholder={this.props.intl.formatMessage({id: 'general.username'})}
spellCheck={false}
toolTip={this.state.focused === 'username' && !touched.username &&
this.props.intl.formatMessage({id: 'registration.usernameAdviceShort'})}
validate={this.validateUsernameIfPresent}
@ -170,6 +174,9 @@ class UsernameStep extends React.Component {
{this.props.intl.formatMessage({id: 'registration.choosePasswordStepTitle'})}
</div>
<FormikInput
autoCapitalize="off"
autoComplete={values.showPassword ? 'off' : 'new-password'}
autoCorrect="off"
className={classNames(
'join-flow-input',
{'join-flow-input-password':
@ -179,6 +186,7 @@ class UsernameStep extends React.Component {
id="password"
name="password"
placeholder={this.props.intl.formatMessage({id: 'general.password'})}
spellCheck={false}
toolTip={this.state.focused === 'password' && !touched.password &&
this.props.intl.formatMessage({id: 'registration.passwordAdviceShort'})}
type={values.showPassword ? 'text' : 'password'}
@ -195,6 +203,9 @@ class UsernameStep extends React.Component {
/* eslint-enable react/jsx-no-bind */
/>
<FormikInput
autoCapitalize="off"
autoComplete={values.showPassword ? 'off' : 'new-password'}
autoCorrect="off"
className={classNames(
'join-flow-input',
'join-flow-password-confirm',
@ -210,6 +221,7 @@ class UsernameStep extends React.Component {
placeholder={this.props.intl.formatMessage({
id: 'registration.confirmPasswordInstruction'
})}
spellCheck={false}
toolTip={
this.state.focused === 'passwordConfirm' && !touched.passwordConfirm &&
this.props.intl.formatMessage({