wassname/talk
1
0
Fork 0
mirror of https://github.com/wassname/talk.git synced 2026-07-13 17:45:56 +08:00
Code Issues Packages Projects Releases Wiki Activity

[next] Email/Password Improvements (#2400)

Browse Source 
* feat: improved some password/email fields

- All secret fields are now "hidden" by default
- All email fields now have autocomplete/spellcheck disabled with
  correct typings

* feat: add additional email validation
This commit is contained in:
Wyatt Johnson
2019-07-12 21:07:14 +00:00
committed by GitHub
parent f95b705585
commit bc0b0d0339
18 changed files with 584 additions and 190 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/core/client/auth/components/EmailField.tsx
+1
View File
@@ -35,6 +35,7 @@ const EmailField: FunctionComponent<Props> = props => (
onChange={input.onChange}
value={input.value}
placeholder="Email Address"
type="email"
color={
meta.touched && (meta.error || meta.submitError)
? "error"
src/core/client/auth/test/__snapshots__/addEmailAddress.spec.tsx.snap
+6 -6
View File
@@ -101,7 +101,7 @@ Your email address will be used to:
name="email"
onChange={[Function]}
placeholder="Email Address"
type="text"
type="email"
value="hans@test.com"
/>
</div>
@@ -260,7 +260,7 @@ Your email address will be used to:
name="email"
onChange={[Function]}
placeholder="Email Address"
type="text"
type="email"
value="invalid-email"
/>
</div>
@@ -451,7 +451,7 @@ Your email address will be used to:
name="email"
onChange={[Function]}
placeholder="Email Address"
type="text"
type="email"
value=""
/>
</div>
@@ -600,7 +600,7 @@ Your email address will be used to:
name="email"
onChange={[Function]}
placeholder="Email Address"
type="text"
type="email"
value=""
/>
</div>
@@ -786,7 +786,7 @@ GraphQL request (4:3)
name="email"
onChange={[Function]}
placeholder="Email Address"
type="text"
type="email"
value="hans@test.com"
/>
</div>
@@ -932,7 +932,7 @@ Your email address will be used to:
name="email"
onChange={[Function]}
placeholder="Email Address"
type="text"
type="email"
value=""
/>
</div>
src/core/client/auth/test/__snapshots__/createPassword.spec.tsx.snap
+20
View File
@@ -35,12 +35,16 @@ we require users to create a password.
className="PasswordField-wrapper"
>
<input
autoCapitalize="off"
autoComplete="off"
autoCorrect="off"
className="PasswordField-colorError PasswordField-fullWidth PasswordField-input"
disabled={false}
id="password"
name="password"
onChange={[Function]}
placeholder="Password"
spellCheck={false}
type="password"
value="x"
/>
@@ -144,12 +148,16 @@ we require users to create a password.
className="PasswordField-wrapper"
>
<input
autoCapitalize="off"
autoComplete="off"
autoCorrect="off"
className="PasswordField-colorRegular PasswordField-fullWidth PasswordField-input"
disabled={false}
id="password"
name="password"
onChange={[Function]}
placeholder="Password"
spellCheck={false}
type="password"
value=""
/>
@@ -224,12 +232,16 @@ we require users to create a password.
className="PasswordField-wrapper"
>
<input
autoCapitalize="off"
autoComplete="off"
autoCorrect="off"
className="PasswordField-colorError PasswordField-fullWidth PasswordField-input"
disabled={false}
id="password"
name="password"
onChange={[Function]}
placeholder="Password"
spellCheck={false}
type="password"
value=""
/>
@@ -328,12 +340,16 @@ GraphQL request (4:3)
className="PasswordField-wrapper"
>
<input
autoCapitalize="off"
autoComplete="off"
autoCorrect="off"
className="PasswordField-colorRegular PasswordField-fullWidth PasswordField-input"
disabled={false}
id="password"
name="password"
onChange={[Function]}
placeholder="Password"
spellCheck={false}
type="password"
value="secretpassword"
/>
@@ -405,12 +421,16 @@ we require users to create a password.
className="PasswordField-wrapper"
>
<input
autoCapitalize="off"
autoComplete="off"
autoCorrect="off"
className="PasswordField-colorRegular PasswordField-fullWidth PasswordField-input"
disabled={false}
id="password"
name="password"
onChange={[Function]}
placeholder="Password"
spellCheck={false}
type="password"
value=""
/>
src/core/client/auth/test/__snapshots__/signIn.spec.tsx.snap
+45 -9
View File
@@ -27,7 +27,7 @@ exports[`accepts correct password 1`] = `
name="email"
onChange={[Function]}
placeholder="Email Address"
type="text"
type="email"
value=""
/>
</div>
@@ -61,12 +61,16 @@ exports[`accepts correct password 1`] = `
className="PasswordField-wrapper"
>
<input
autoCapitalize="off"
autoComplete="off"
autoCorrect="off"
className="PasswordField-colorRegular PasswordField-fullWidth PasswordField-input"
disabled={false}
id="password"
name="password"
onChange={[Function]}
placeholder="Password"
spellCheck={false}
type="password"
value="testtest"
/>
@@ -153,7 +157,7 @@ exports[`accepts valid email 1`] = `
name="email"
onChange={[Function]}
placeholder="Email Address"
type="text"
type="email"
value="hans@test.com"
/>
</div>
@@ -174,12 +178,16 @@ exports[`accepts valid email 1`] = `
className="PasswordField-wrapper"
>
<input
autoCapitalize="off"
autoComplete="off"
autoCorrect="off"
className="PasswordField-colorError PasswordField-fullWidth PasswordField-input"
disabled={false}
id="password"
name="password"
onChange={[Function]}
placeholder="Password"
spellCheck={false}
type="password"
value=""
/>
@@ -286,7 +294,7 @@ exports[`auth configuration renders all auth enabled 1`] = `
name="email"
onChange={[Function]}
placeholder="Email Address"
type="text"
type="email"
value=""
/>
</div>
@@ -307,12 +315,16 @@ exports[`auth configuration renders all auth enabled 1`] = `
className="PasswordField-wrapper"
>
<input
autoCapitalize="off"
autoComplete="off"
autoCorrect="off"
className="PasswordField-colorRegular PasswordField-fullWidth PasswordField-input"
disabled={false}
id="password"
name="password"
onChange={[Function]}
placeholder="Password"
spellCheck={false}
type="password"
value=""
/>
@@ -551,7 +563,7 @@ exports[`checks for invalid email 1`] = `
name="email"
onChange={[Function]}
placeholder="Email Address"
type="text"
type="email"
value="invalid-email"
/>
</div>
@@ -585,12 +597,16 @@ exports[`checks for invalid email 1`] = `
className="PasswordField-wrapper"
>
<input
autoCapitalize="off"
autoComplete="off"
autoCorrect="off"
className="PasswordField-colorError PasswordField-fullWidth PasswordField-input"
disabled={false}
id="password"
name="password"
onChange={[Function]}
placeholder="Password"
spellCheck={false}
type="password"
value=""
/>
@@ -737,7 +753,7 @@ exports[`renders sign in view 1`] = `
name="email"
onChange={[Function]}
placeholder="Email Address"
type="text"
type="email"
value=""
/>
</div>
@@ -758,12 +774,16 @@ exports[`renders sign in view 1`] = `
className="PasswordField-wrapper"
>
<input
autoCapitalize="off"
autoComplete="off"
autoCorrect="off"
className="PasswordField-colorRegular PasswordField-fullWidth PasswordField-input"
disabled={false}
id="password"
name="password"
onChange={[Function]}
placeholder="Password"
spellCheck={false}
type="password"
value=""
/>
@@ -910,7 +930,7 @@ exports[`renders sign in view with error 1`] = `
name="email"
onChange={[Function]}
placeholder="Email Address"
type="text"
type="email"
value=""
/>
</div>
@@ -931,12 +951,16 @@ exports[`renders sign in view with error 1`] = `
className="PasswordField-wrapper"
>
<input
autoCapitalize="off"
autoComplete="off"
autoCorrect="off"
className="PasswordField-colorRegular PasswordField-fullWidth PasswordField-input"
disabled={false}
id="password"
name="password"
onChange={[Function]}
placeholder="Password"
spellCheck={false}
type="password"
value=""
/>
@@ -1029,7 +1053,7 @@ exports[`shows error when submitting empty form 1`] = `
name="email"
onChange={[Function]}
placeholder="Email Address"
type="text"
type="email"
value=""
/>
</div>
@@ -1063,12 +1087,16 @@ exports[`shows error when submitting empty form 1`] = `
className="PasswordField-wrapper"
>
<input
autoCapitalize="off"
autoComplete="off"
autoCorrect="off"
className="PasswordField-colorError PasswordField-fullWidth PasswordField-input"
disabled={false}
id="password"
name="password"
onChange={[Function]}
placeholder="Password"
spellCheck={false}
type="password"
value=""
/>
@@ -1175,7 +1203,7 @@ exports[`shows server error 1`] = `
name="email"
onChange={[Function]}
placeholder="Email Address"
type="text"
type="email"
value="hans@test.com"
/>
</div>
@@ -1196,12 +1224,16 @@ exports[`shows server error 1`] = `
className="PasswordField-wrapper"
>
<input
autoCapitalize="off"
autoComplete="off"
autoCorrect="off"
className="PasswordField-colorRegular PasswordField-fullWidth PasswordField-input"
disabled={false}
id="password"
name="password"
onChange={[Function]}
placeholder="Password"
spellCheck={false}
type="password"
value="testtest"
/>
@@ -1288,7 +1320,7 @@ exports[`submits form successfully 1`] = `
name="email"
onChange={[Function]}
placeholder="Email Address"
type="text"
type="email"
value=""
/>
</div>
@@ -1309,12 +1341,16 @@ exports[`submits form successfully 1`] = `
className="PasswordField-wrapper"
>
<input
autoCapitalize="off"
autoComplete="off"
autoCorrect="off"
className="PasswordField-colorRegular PasswordField-fullWidth PasswordField-input"
disabled={false}
id="password"
name="password"
onChange={[Function]}
placeholder="Password"
spellCheck={false}
type="password"
value=""
/>
src/core/client/auth/test/__snapshots__/signUp.spec.tsx.snap
+65 -13
View File
@@ -34,7 +34,7 @@ exports[`accepts correct password 1`] = `
name="email"
onChange={[Function]}
placeholder="Email Address"
type="text"
type="email"
value=""
/>
</div>
@@ -115,12 +115,16 @@ exports[`accepts correct password 1`] = `
className="PasswordField-wrapper"
>
<input
autoCapitalize="off"
autoComplete="off"
autoCorrect="off"
className="PasswordField-colorRegular PasswordField-fullWidth PasswordField-input"
disabled={false}
id="password"
name="password"
onChange={[Function]}
placeholder="Password"
spellCheck={false}
type="password"
value="testtest"
/>
@@ -204,7 +208,7 @@ exports[`accepts valid email 1`] = `
name="email"
onChange={[Function]}
placeholder="Email Address"
type="text"
type="email"
value="hans@test.com"
/>
</div>
@@ -272,12 +276,16 @@ exports[`accepts valid email 1`] = `
className="PasswordField-wrapper"
>
<input
autoCapitalize="off"
autoComplete="off"
autoCorrect="off"
className="PasswordField-colorError PasswordField-fullWidth PasswordField-input"
disabled={false}
id="password"
name="password"
onChange={[Function]}
placeholder="Password"
spellCheck={false}
type="password"
value=""
/>
@@ -374,7 +382,7 @@ exports[`accepts valid username 1`] = `
name="email"
onChange={[Function]}
placeholder="Email Address"
type="text"
type="email"
value=""
/>
</div>
@@ -442,12 +450,16 @@ exports[`accepts valid username 1`] = `
className="PasswordField-wrapper"
>
<input
autoCapitalize="off"
autoComplete="off"
autoCorrect="off"
className="PasswordField-colorError PasswordField-fullWidth PasswordField-input"
disabled={false}
id="password"
name="password"
onChange={[Function]}
placeholder="Password"
spellCheck={false}
type="password"
value=""
/>
@@ -544,7 +556,7 @@ exports[`auth configuration renders all auth enabled 1`] = `
name="email"
onChange={[Function]}
placeholder="Email Address"
type="text"
type="email"
value=""
/>
</div>
@@ -599,12 +611,16 @@ exports[`auth configuration renders all auth enabled 1`] = `
className="PasswordField-wrapper"
>
<input
autoCapitalize="off"
autoComplete="off"
autoCorrect="off"
className="PasswordField-colorRegular PasswordField-fullWidth PasswordField-input"
disabled={false}
id="password"
name="password"
onChange={[Function]}
placeholder="Password"
spellCheck={false}
type="password"
value=""
/>
@@ -835,7 +851,7 @@ exports[`checks for invalid characters in username 1`] = `
name="email"
onChange={[Function]}
placeholder="Email Address"
type="text"
type="email"
value=""
/>
</div>
@@ -916,12 +932,16 @@ exports[`checks for invalid characters in username 1`] = `
className="PasswordField-wrapper"
>
<input
autoCapitalize="off"
autoComplete="off"
autoCorrect="off"
className="PasswordField-colorError PasswordField-fullWidth PasswordField-input"
disabled={false}
id="password"
name="password"
onChange={[Function]}
placeholder="Password"
spellCheck={false}
type="password"
value=""
/>
@@ -1018,7 +1038,7 @@ exports[`checks for invalid email 1`] = `
name="email"
onChange={[Function]}
placeholder="Email Address"
type="text"
type="email"
value="invalid-email"
/>
</div>
@@ -1099,12 +1119,16 @@ exports[`checks for invalid email 1`] = `
className="PasswordField-wrapper"
>
<input
autoCapitalize="off"
autoComplete="off"
autoCorrect="off"
className="PasswordField-colorError PasswordField-fullWidth PasswordField-input"
disabled={false}
id="password"
name="password"
onChange={[Function]}
placeholder="Password"
spellCheck={false}
type="password"
value=""
/>
@@ -1201,7 +1225,7 @@ exports[`checks for too long username 1`] = `
name="email"
onChange={[Function]}
placeholder="Email Address"
type="text"
type="email"
value=""
/>
</div>
@@ -1282,12 +1306,16 @@ exports[`checks for too long username 1`] = `
className="PasswordField-wrapper"
>
<input
autoCapitalize="off"
autoComplete="off"
autoCorrect="off"
className="PasswordField-colorError PasswordField-fullWidth PasswordField-input"
disabled={false}
id="password"
name="password"
onChange={[Function]}
placeholder="Password"
spellCheck={false}
type="password"
value=""
/>
@@ -1384,7 +1412,7 @@ exports[`checks for too short password 1`] = `
name="email"
onChange={[Function]}
placeholder="Email Address"
type="text"
type="email"
value=""
/>
</div>
@@ -1465,12 +1493,16 @@ exports[`checks for too short password 1`] = `
className="PasswordField-wrapper"
>
<input
autoCapitalize="off"
autoComplete="off"
autoCorrect="off"
className="PasswordField-colorError PasswordField-fullWidth PasswordField-input"
disabled={false}
id="password"
name="password"
onChange={[Function]}
placeholder="Password"
spellCheck={false}
type="password"
value="pass"
/>
@@ -1567,7 +1599,7 @@ exports[`checks for too short username 1`] = `
name="email"
onChange={[Function]}
placeholder="Email Address"
type="text"
type="email"
value=""
/>
</div>
@@ -1648,12 +1680,16 @@ exports[`checks for too short username 1`] = `
className="PasswordField-wrapper"
>
<input
autoCapitalize="off"
autoComplete="off"
autoCorrect="off"
className="PasswordField-colorError PasswordField-fullWidth PasswordField-input"
disabled={false}
id="password"
name="password"
onChange={[Function]}
placeholder="Password"
spellCheck={false}
type="password"
value=""
/>
@@ -1790,7 +1826,7 @@ exports[`renders sign up form 1`] = `
name="email"
onChange={[Function]}
placeholder="Email Address"
type="text"
type="email"
value=""
/>
</div>
@@ -1845,12 +1881,16 @@ exports[`renders sign up form 1`] = `
className="PasswordField-wrapper"
>
<input
autoCapitalize="off"
autoComplete="off"
autoCorrect="off"
className="PasswordField-colorRegular PasswordField-fullWidth PasswordField-input"
disabled={false}
id="password"
name="password"
onChange={[Function]}
placeholder="Password"
spellCheck={false}
type="password"
value=""
/>
@@ -1936,7 +1976,7 @@ exports[`shows error when submitting empty form 1`] = `
name="email"
onChange={[Function]}
placeholder="Email Address"
type="text"
type="email"
value=""
/>
</div>
@@ -2017,12 +2057,16 @@ exports[`shows error when submitting empty form 1`] = `
className="PasswordField-wrapper"
>
<input
autoCapitalize="off"
autoComplete="off"
autoCorrect="off"
className="PasswordField-colorError PasswordField-fullWidth PasswordField-input"
disabled={false}
id="password"
name="password"
onChange={[Function]}
placeholder="Password"
spellCheck={false}
type="password"
value=""
/>
@@ -2126,7 +2170,7 @@ exports[`shows server error 1`] = `
name="email"
onChange={[Function]}
placeholder="Email Address"
type="text"
type="email"
value="hans@test.com"
/>
</div>
@@ -2181,12 +2225,16 @@ exports[`shows server error 1`] = `
className="PasswordField-wrapper"
>
<input
autoCapitalize="off"
autoComplete="off"
autoCorrect="off"
className="PasswordField-colorRegular PasswordField-fullWidth PasswordField-input"
disabled={false}
id="password"
name="password"
onChange={[Function]}
placeholder="Password"
spellCheck={false}
type="password"
value="testtest"
/>
@@ -2270,7 +2318,7 @@ exports[`submits form successfully 1`] = `
name="email"
onChange={[Function]}
placeholder="Email Address"
type="text"
type="email"
value=""
/>
</div>
@@ -2325,12 +2373,16 @@ exports[`submits form successfully 1`] = `
className="PasswordField-wrapper"
>
<input
autoCapitalize="off"
autoComplete="off"
autoCorrect="off"
className="PasswordField-colorRegular PasswordField-fullWidth PasswordField-input"
disabled={false}
id="password"
name="password"
onChange={[Function]}
placeholder="Password"
spellCheck={false}
type="password"
value=""
/>