Revert "Minimum password length + Static Pages fixes (#11474)"

This reverts commit e1d30eec98.
This commit is contained in:
Sabe Jones 2019-10-31 13:16:09 -05:00
parent e1d30eec98
commit d1afbf4b92
13 changed files with 80 additions and 242 deletions

View file

@ -326,24 +326,6 @@ describe('POST /user/auth/local/register', () => {
});
});
it('requires minimum length for the password', async () => {
const username = generateRandomUserName();
const email = `${username}@example.com`;
const password = '1234567';
const confirmPassword = '1234567';
await expect(api.post('/user/auth/local/register', {
username,
email,
password,
confirmPassword,
})).to.eventually.be.rejected.and.eql({
code: 400,
error: 'BadRequest',
message: t('invalidReqParams'),
});
});
it('requires a username', async () => {
const email = `${generateRandomUserName()}@example.com`;
const password = 'password';

View file

@ -82,20 +82,6 @@ describe('PUT /user/auth/update-password', async () => {
});
});
it('returns an error when newPassword is too short', async () => {
const body = {
password,
newPassword: '1234567',
confirmPassword: '1234567',
};
await expect(user.put(ENDPOINT, body)).to.eventually.be.rejected.and.eql({
code: 400,
error: 'BadRequest',
message: t('invalidReqParams'),
});
});
it('returns an error when confirmPassword is missing', async () => {
const body = {
password,

View file

@ -20,7 +20,7 @@
@include btn-focus-hover-shadow();
}
&:hover:not(.btn-flat):not(.disabled):not(:disabled) {
&:hover:not(.btn-flat):not(.disabled) {
@include btn-focus-hover-shadow();
border-color: transparent;
}
@ -49,7 +49,7 @@
background: $purple-200;
}
&:hover:not(:disabled):not(.disabled), &:active:not(:disabled):not(.disabled), &.active:not(:disabled):not(.disabled), &:focus:not(:disabled):not(.disabled) {
&:hover:not(:disabled), &:active, &.active, &:focus {
background: #5d3b9c !important;
color: $white;
}
@ -59,7 +59,7 @@
color: $gray-50;
background: $white !important;
&:hover:not(:disabled):not(.disabled), &:active:not(:disabled):not(.disabled), &.active:not(:disabled):not(.disabled), &:focus:not(:disabled):not(.disabled) {
&:hover:not(:disabled):not(.disabled), &:active, &.active, &:focus {
color: $purple-200 !important;
}
@ -80,7 +80,7 @@
background: $green-100;
}
&:hover:not(:disabled):not(.disabled), &:active:not(:disabled):not(.disabled), &.active:not(:disabled):not(.disabled) {
&:hover:not(:disabled), &:active, &.active {
background: $green-50;
}
}
@ -96,12 +96,8 @@
background: $blue-50;
}
&:hover:not(:disabled):not(.disabled) {
background-color: $blue-100;
}
&:active:not(:disabled):not(.disabled), &.active:not(:disabled):not(.disabled) {
background: $blue-50;
&:hover:not(:disabled), &:active, &.active {
background: $blue-100;
}
}
@ -112,11 +108,7 @@
background: $red-50;
}
&:hover:not(:disabled):not(.disabled) {
background: $red-100;
}
&:active:not(:disabled):not(.disabled), &.active:not(:disabled):not(.disabled) {
&:hover:not(:disabled), &:active, &.active {
background: $red-100;
}
}

View file

@ -65,7 +65,6 @@ input, textarea, input.form-control, textarea.form-control {
padding-right: 40px;
background-image: url(~@/assets/svg/for-css/alert.svg);
background-size: 16px 16px;
border-color: $red-100 !important;
}
}
@ -277,19 +276,3 @@ $bg-disabled-control: #34303a;
.toggle-switch-container.no-margin {
margin-top: 0 !important;
}
// Disable default style Firefox for invalid elements.
// Selectors taken from view-source:resource://gre-resources/forms.css on Firefox
:not(output):-moz-ui-invalid {
box-shadow: none;
}
:not(output):-moz-ui-invalid:-moz-focusring {
box-shadow: none;
}
output:-moz-ui-invalid {
color: inherit;
}

View file

@ -46,13 +46,6 @@
:placeholder="$t('usernamePlaceholder')"
:class="{'input-valid': usernameValid, 'input-invalid': usernameInvalid}"
>
<div
v-for="issue in usernameIssues"
:key="issue"
class="input-error"
>
{{ issue }}
</div>
</div>
<div
v-if="!registering"
@ -104,17 +97,7 @@
class="form-control"
type="password"
:placeholder="$t(registering ? 'passwordPlaceholder' : 'password')"
:class="{
'input-valid': registering ? passwordValid : false,
'input-invalid': registering ? passwordInvalid: false,
}"
>
<div
v-if="passwordInvalid && registering"
class="input-error"
>
{{ $t('minPasswordLength') }}
</div>
</div>
<div
v-if="registering"
@ -132,12 +115,6 @@
:placeholder="$t('confirmPasswordPlaceholder')"
:class="{'input-invalid': passwordConfirmInvalid, 'input-valid': passwordConfirmValid}"
>
<div
v-if="passwordConfirmInvalid"
class="input-error"
>
{{ $t('passwordConfirmationMatch') }}
</div>
<small
v-once
class="form-text"
@ -206,11 +183,8 @@
text-align: center;
}
.input-error {
margin-top: 0.25em;
font-weight: normal;
font-size: 90%;
width: 100%;
.input-valid {
color: #fff;
}
}
</style>
@ -220,7 +194,7 @@ import hello from 'hellojs';
import debounce from 'lodash/debounce';
import isEmail from 'validator/lib/isEmail';
import { setUpAxios } from '@/libs/auth';
import { MINIMUM_PASSWORD_LENGTH } from '@/../../common/script/constants';
import facebookSquareIcon from '@/assets/svg/facebook-square.svg';
import googleIcon from '@/assets/svg/google.svg';
@ -249,7 +223,6 @@ export default {
return isEmail(this.email);
},
emailInvalid () {
if (this.email.length <= 3) return false;
return !this.emailValid;
},
usernameValid () {
@ -257,23 +230,13 @@ export default {
return this.usernameIssues.length === 0;
},
usernameInvalid () {
if (this.username.length < 1) return false;
return !this.usernameValid;
},
passwordValid () {
if (this.password.length <= 0) return false;
return this.password.length >= MINIMUM_PASSWORD_LENGTH;
},
passwordInvalid () {
if (this.password.length <= 0) return false;
return this.password.length < MINIMUM_PASSWORD_LENGTH;
},
passwordConfirmValid () {
if (this.passwordConfirm.length <= 3) return false;
return this.passwordConfirm === this.password;
},
passwordConfirmInvalid () {
if (this.passwordConfirm.length <= 3) return false;
return !this.passwordConfirmValid;
},
},

View file

@ -6,7 +6,8 @@
<form
v-if="!forgotPassword && !resetPasswordSetNewOne"
id="login-form"
@submit.prevent.stop="handleSubmit"
@submit.prevent="handleSubmit"
@keyup.enter="handleSubmit"
>
<div class="text-center">
<div>
@ -68,7 +69,7 @@
<input
id="usernameInput"
v-model="username"
class="form-control input-with-error"
class="form-control"
type="text"
:placeholder="$t('usernamePlaceholder')"
:class="{'input-valid': usernameValid, 'input-invalid': usernameInvalid}"
@ -131,17 +132,7 @@
class="form-control"
type="password"
:placeholder="$t(registering ? 'passwordPlaceholder' : 'password')"
:class="{
'input-invalid input-with-error': registering && passwordInvalid,
'input-valid': registering && passwordValid
}"
>
<div
v-if="passwordInvalid && registering"
class="input-error"
>
{{ $t('minPasswordLength') }}
</div>
</div>
<div
v-if="registering"
@ -154,17 +145,11 @@
<input
id="confirmPasswordInput"
v-model="passwordConfirm"
class="form-control input-with-error"
class="form-control"
type="password"
:placeholder="$t('confirmPasswordPlaceholder')"
:class="{'input-invalid': passwordConfirmInvalid, 'input-valid': passwordConfirmValid}"
>
<div
v-if="passwordConfirmInvalid"
class="input-error"
>
{{ $t('passwordConfirmationMatch') }}
</div>
<small
v-once
class="form-text"
@ -172,22 +157,22 @@
></small>
</div>
<div class="text-center">
<button
<div
v-if="registering"
type="submit"
v-once
class="btn btn-info"
:disabled="signupFormInvalid"
@click="register()"
>
{{ $t('joinHabitica') }}
</button>
<button
</div>
<div
v-if="!registering"
v-once
type="submit"
class="btn btn-info"
@click="login()"
>
{{ $t('login') }}
</button>
</div>
<div class="toggle-links">
<router-link
v-if="registering"
@ -441,14 +426,10 @@
color: $white;
}
.input-with-error.input-invalid {
#usernameInput.input-invalid {
margin-bottom: 0.5em;
}
#confirmPasswordInput + .input-error {
margin-bottom: 2em;
}
.form-text {
font-size: 14px;
color: $white;
@ -499,7 +480,7 @@
background-image: url('~@/assets/images/auth/seamless_mountains_demo.png');
background-repeat: repeat-x;
width: 100%;
height: 300px;
height: 500px;
position: absolute;
z-index: 0;
bottom: 0;
@ -531,6 +512,7 @@
color: #fff;
font-size: 90%;
width: 100%;
text-align: center;
}
</style>
@ -540,7 +522,6 @@ import hello from 'hellojs';
import debounce from 'lodash/debounce';
import isEmail from 'validator/lib/isEmail';
import { MINIMUM_PASSWORD_LENGTH } from '@/../../common/script/constants';
import gryphon from '@/assets/svg/gryphon.svg';
import habiticaIcon from '@/assets/svg/habitica-logo.svg';
import facebookSquareIcon from '@/assets/svg/facebook-square.svg';
@ -599,14 +580,6 @@ export default {
if (this.username.length < 1) return false;
return !this.usernameValid;
},
passwordValid () {
if (this.password.length <= 0) return false;
return this.password.length >= MINIMUM_PASSWORD_LENGTH;
},
passwordInvalid () {
if (this.password.length <= 0) return false;
return this.password.length < MINIMUM_PASSWORD_LENGTH;
},
passwordConfirmValid () {
if (this.passwordConfirm.length <= 3) return false;
return this.passwordConfirm === this.password;
@ -615,12 +588,6 @@ export default {
if (this.passwordConfirm.length <= 3) return false;
return !this.passwordConfirmValid;
},
signupFormInvalid () {
return this.usernameInvalid
|| this.emailInvalid
|| this.passwordInvalid
|| this.passwordConfirmInvalid;
},
},
watch: {
$route: {

View file

@ -53,9 +53,9 @@
<div class="strike">
<span>{{ $t('or') }}</span>
</div>
<form
<div
class="form"
@submit.prevent.stop="register()"
@keyup.enter="register()"
>
<p class="form-text">
{{ $t('usernameLimitations') }}
@ -63,7 +63,7 @@
<input
id="usernameInput"
v-model="username"
class="form-control input-with-error"
class="form-control"
type="text"
:placeholder="$t('username')"
:class="{'input-valid': usernameValid, 'input-invalid': usernameInvalid}"
@ -85,49 +85,32 @@
>
<input
v-model="password"
class="form-control input-with-error"
class="form-control"
type="password"
:placeholder="$t('password')"
:class="{
'input-valid': passwordValid,
'input-invalid': passwordInvalid,
}"
:class="{'input-valid': password.length > 3}"
>
<div
v-if="passwordInvalid"
class="input-error"
>
{{ $t('minPasswordLength') }}
</div>
<input
v-model="passwordConfirm"
class="form-control input-with-error"
class="form-control"
type="password"
:placeholder="$t('confirmPassword')"
:class="{
'input-invalid': passwordConfirmInvalid,
'input-valid': passwordConfirmValid}"
>
<div
v-if="passwordConfirmInvalid"
class="input-error"
>
{{ $t('passwordConfirmationMatch') }}
</div>
<p
v-once
class="form-text"
v-html="$t('termsAndAgreement')"
></p>
<button
class="btn btn-block btn-info sign-up"
:disabled="signupFormInvalid"
type="submit"
class="sign-up"
@click="register()"
>
{{ $t('signup') }}
</button>
</form>
</div>
</div>
<div class="col-12">
<div
@ -536,7 +519,7 @@
transition: border .5s, color .5s;
}
.input-invalid.input-with-error {
#usernameInput.input-invalid {
margin-bottom: 0.5em;
}
@ -554,9 +537,21 @@
background-color: #36205d;
}
.sign-up {
padding-top: 11px;
padding-bottom: 11px;
button.sign-up {
width: 100%;
height: 48px;
color: #fff;
border: none;
border-radius: 2px;
background-color: #2995cd;
font-size: 16px;
transition: all .5s ease;
}
.sign-up:hover {
background-color: #50b5e9;
box-shadow: 0 4px 4px 0 rgba(26, 24, 29, 0.16), 0 1px 8px 0 rgba(26, 24, 29, 0.12);
cursor: pointer;
}
::-webkit-input-placeholder { /* Chrome/Opera/Safari */
@ -774,6 +769,7 @@
color: #fff;
font-size: 90%;
width: 100%;
text-align: center;
margin-bottom: 1em;
}
</style>
@ -800,7 +796,6 @@ import lifehacker from '@/assets/images/home/lifehacker.svg';
import makeuseof from '@/assets/images/home/make-use-of.svg';
import thenewyorktimes from '@/assets/images/home/the-new-york-times.svg';
import * as Analytics from '@/libs/analytics';
import { MINIMUM_PASSWORD_LENGTH } from '@/../../common/script/constants';
export default {
data () {
@ -849,14 +844,6 @@ export default {
if (this.username.length < 1) return false;
return !this.usernameValid;
},
passwordValid () {
if (this.password.length <= 0) return false;
return this.password.length >= MINIMUM_PASSWORD_LENGTH;
},
passwordInvalid () {
if (this.password.length <= 0) return false;
return this.password.length < MINIMUM_PASSWORD_LENGTH;
},
passwordConfirmValid () {
if (this.passwordConfirm.length <= 3) return false;
return this.passwordConfirm === this.password;
@ -865,12 +852,6 @@ export default {
if (this.passwordConfirm.length <= 3) return false;
return this.passwordConfirm !== this.password;
},
signupFormInvalid () {
return this.usernameInvalid
|| this.emailInvalid
|| this.passwordInvalid
|| this.passwordConfirmInvalid;
},
},
watch: {
username () {

View file

@ -85,6 +85,10 @@
}
}
#bottom-wrap.purple-4 {
background-color: #271b3d;
}
#purple-footer {
background-color: #271b3d;
@ -111,6 +115,33 @@
}
}
#bottom-wrap {
padding-top: 10em;
}
#bottom-background {
position: relative;
.seamless_mountains_demo_repeat {
background-image: url('~@/assets/images/auth/seamless_mountains_demo.png');
background-repeat: repeat-x;
width: 100%;
height: 300px;
position: absolute;
z-index: 0;
bottom: 0;
}
.midground_foreground_extended2 {
background-image: url('~@/assets/images/auth/midground_foreground_extended2.png');
position: relative;
width: 1500px;
max-width: 100%;
height: 150px;
margin: 0 auto;
}
}
.static-wrapper {
.container-fluid {
margin: 5em 2em 2em 2em;
@ -140,39 +171,6 @@
}
</style>
<style lang="scss" scoped>
#bottom-wrap.purple-4 {
background-color: #271b3d;
}
#bottom-wrap {
padding-top: 10em;
}
#bottom-background {
position: relative;
.seamless_mountains_demo_repeat {
background-image: url('~@/assets/images/auth/seamless_mountains_demo.png');
background-repeat: repeat-x;
width: 100%;
height: 300px;
position: absolute;
z-index: 0;
bottom: 0;
}
.midground_foreground_extended2 {
background-image: url('~@/assets/images/auth/midground_foreground_extended2.png');
position: relative;
width: 1500px;
max-width: 100%;
height: 150px;
margin: 0 auto;
}
}
</style>
<script>
import AppFooter from '@/components/appFooter';
import StaticHeader from './header.vue';

View file

@ -276,7 +276,6 @@
"usernameTOSRequirements": "Usernames must conform to our <a href='/static/terms' target='_blank'>Terms of Service</a> and <a href='/static/community-guidelines' target='_blank'>Community Guidelines</a>. If you didnt previously set a login name, your username was auto-generated.",
"usernameTaken": "Username already taken.",
"passwordConfirmationMatch": "Password confirmation doesn't match password.",
"minPasswordLength": "Password must be 8 characters or more.",
"passwordResetPage": "Reset Password",
"passwordReset": "If we have your email on file, instructions for setting a new password have been sent to your email.",
"invalidLoginCredentialsLong": "Uh-oh - your email address / username or password is incorrect.\n- Make sure they are typed correctly. Your username and password are case-sensitive.\n- You may have signed up with Facebook or Google-sign-in, not email so double-check by trying them.\n- If you forgot your password, click \"Forgot Password\".",

View file

@ -24,5 +24,3 @@ export const SUPPORTED_SOCIAL_NETWORKS = [
export const GUILDS_PER_PAGE = 30; // number of guilds to return per page when using pagination
export const PARTY_LIMIT_MEMBERS = 30;
export const MINIMUM_PASSWORD_LENGTH = 8;

View file

@ -28,7 +28,6 @@ import {
CHAT_FLAG_LIMIT_FOR_HIDING,
CHAT_FLAG_FROM_MOD,
CHAT_FLAG_FROM_SHADOW_MUTE,
MINIMUM_PASSWORD_LENGTH,
} from './constants';
// TODO under api.libs.statHelpers?
@ -130,7 +129,6 @@ api.constants = {
CHAT_FLAG_LIMIT_FOR_HIDING,
CHAT_FLAG_FROM_MOD,
CHAT_FLAG_FROM_SHADOW_MUTE,
MINIMUM_PASSWORD_LENGTH,
};
// TODO Move these under api.constants
api.maxLevel = MAX_LEVEL;

View file

@ -245,10 +245,6 @@ api.updatePassword = {
},
newPassword: {
notEmpty: { errorMessage: res.t('missingNewPassword') },
isLength: {
options: { min: common.constants.MINIMUM_PASSWORD_LENGTH },
errorMessage: res.t('minPasswordLength'),
},
},
confirmPassword: {
notEmpty: { errorMessage: res.t('missingNewPassword') },

View file

@ -93,13 +93,8 @@ async function registerLocal (req, res, { isV3 = false }) {
},
password: {
notEmpty: true,
errorMessage: res.t('missingPassword'),
equals: { options: [req.body.confirmPassword], errorMessage: res.t('passwordConfirmationMatch') },
isLength: {
options: { min: common.constants.MINIMUM_PASSWORD_LENGTH },
errorMessage: res.t('minPasswordLength'),
},
},
});