IT4Change/gradido
3
0
Fork 0
mirror of https://github.com/IT4Change/gradido.git synced 2025-12-13 07:45:54 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix lint, fix test, change ids

Browse Source
This commit is contained in:
ogerly 2021-06-12 11:36:07 +02:00
parent 259fd5404d
commit 04fa666590
6 changed files with 137 additions and 145 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/src/locales/de.json
View File

@ -34,7 +34,7 @@
"email":"E-Mail",
"email_repeat":"eMail wiederholen",
"password":"Passwort",
"password_repeat":"Passwort wiederholen",
"passwordRepeat":"Passwort wiederholen",
"password_old":"altes Passwort",
"password_new":"neues Passwort",
"password_new_repeat":"neues Passwort wiederholen",

2
frontend/src/locales/en.json
View File

@ -34,7 +34,7 @@
"email":"Email",
"email_repeat":"Repeat Email",
"password":"Password",
"password_repeat":"Repeat password",
"passwordRepeat":"Repeat password",
"password_old":"Old password",
"password_new":"New password",
"password_new_repeat":"Repeat new password",

9
frontend/src/views/Pages/Login.vue
View File

@ -34,7 +34,7 @@
<b-form-input
id="login-email"
name="example-input-1"
v-model="model.email"
v-model="form.email"
placeholder="Email"
:state="getValidationState(validationContext)"
aria-describedby="login-email-live-feedback"
@ -61,7 +61,7 @@
<b-form-input
id="input-pwd"
name="input-pwd"
v-model="model.password"
v-model="form.password"
:placeholder="$t('form.password')"
:type="passwordVisible ? 'text' : 'password'"
:state="getValidationState(validationContext)"
@ -123,7 +123,7 @@ export default {
name: 'login',
data() {
return {
model: {
form: {
email: '',
password: '',
// rememberMe: false
@ -137,7 +137,6 @@ export default {
getValidationState({ dirty, validated, valid = null }) {
return dirty || validated ? valid : null
},
togglePasswordVisibility() {
this.passwordVisible = !this.passwordVisible
@ -148,7 +147,7 @@ export default {
const loader = this.$loading.show({
container: this.$refs.submitButton,
})
const result = await loginAPI.login(this.model.email, this.model.password)
const result = await loginAPI.login(this.form.email, this.form.password)
if (result.success) {
this.$store.dispatch('login', {
sessionId: result.result.data.session_id,

25
frontend/src/views/Pages/Register.spec.js
View File

@ -53,16 +53,27 @@ describe('Register', () => {
expect(wrapper.find('form').exists()).toBeTruthy()
})
it('has 3 text input fields', () => {
expect(wrapper.findAll('input[type="text"]').length).toBe(3)
it('has firstname input fields', () => {
expect(wrapper.find('#registerFirstname').exists()).toBeTruthy()
})
it('has lastname input fields', () => {
expect(wrapper.find('#registerLastname').exists()).toBeTruthy()
})
it('has 2 password input fields', () => {
expect(wrapper.findAll('input[type="password"]').length).toBe(2)
it('has email input fields', () => {
expect(wrapper.find('#registerEmail').exists()).toBeTruthy()
})
it('has password input fields', () => {
expect(wrapper.find('#registerPassword').exists()).toBeTruthy()
})
it('has password repeat input fields', () => {
expect(wrapper.find('#registerPasswordRepeat').exists()).toBeTruthy()
})
it('has 1 checkbox input fields', () => {
expect(wrapper.findAll('input[type="checkbox"]').length).toBe(1)
expect(wrapper.find('#registerCheckbox').exists()).toBeTruthy()
})
it('has no submit button when not completely filled', () => {
@ -70,9 +81,9 @@ describe('Register', () => {
})
it('shows a warning when no valid Email is entered', async () => {
wrapper.findAll('input[type="text"]').at(2).setValue('no_valid@Email')
wrapper.find('#registerEmail').setValue('no_valid@Email')
await flushPromises()
await expect(wrapper.find('.invalid-feedback').text()).toEqual(
await expect(wrapper.find('#registerEmailLiveFeedback').text()).toEqual(
'The Email field must be a valid email',
)
})

240
frontend/src/views/Pages/Register.vue
View File

@ -23,107 +23,101 @@
<div class="text-center text-muted mb-4">
<small>{{ $t('signup') }}</small>
</div>
<validation-observer ref="observer" v-slot="{ handleSubmit }">
<b-form role="form" @submit.prevent="handleSubmit(onSubmit)">
<validation-provider
<validation-observer ref="observer" v-slot="{ handleSubmit }">
<b-form role="form" @submit.prevent="handleSubmit(onSubmit)">
<validation-provider
:name="$t('form.firstname')"
:rules="{ required: true, min: 3 }"
v-slot="validationContext"
>
<b-form-group class="mb-3" :label="$t('form.firstname')" label-for="register-firstname">
<b-form-group
class="mb-3"
:label="$t('form.firstname')"
label-for="registerFirstname"
>
<b-form-input
id="register-firstname"
id="registerFirstname"
:name="$t('form.firstname')"
v-model="model.firstname"
v-model="form.firstname"
:placeholder="$t('form.firstname')"
:state="getValidationState(validationContext)"
aria-describedby="register-firstname-live-feedback"
aria-describedby="registerFirstnameLiveFeedback"
></b-form-input>
<b-form-invalid-feedback id="register-firstname-live-feedback">
<b-form-invalid-feedback id="registerFirstnameLiveFeedback">
{{ validationContext.errors[0] }}
</b-form-invalid-feedback>
</b-form-group>
</validation-provider>
</validation-provider>
<validation-provider
:name="$t('form.lastname')"
:rules="{ required: true, min: 2 }"
v-slot="validationContext"
>
<b-form-group class="mb-3" :label="$t('form.lastname')" label-for="register-lastname">
<b-form-group
class="mb-3"
:label="$t('form.lastname')"
label-for="registerLastname"
>
<b-form-input
id="register-lastname"
id="registerLastname"
:name="$t('form.lastname')"
v-model="model.lastname"
v-model="form.lastname"
:placeholder="$t('form.lastname')"
:state="getValidationState(validationContext)"
aria-describedby="register-lastname-live-feedback"
aria-describedby="registerLastnameLiveFeedback"
></b-form-input>
<b-form-invalid-feedback id="register-lastname-live-feedback">
{{ validationContext.errors[0] }}
</b-form-invalid-feedback>
</b-form-group>
</validation-provider>
<validation-provider
name="Email"
:rules="{ required: true, email: true }"
v-slot="validationContext"
>
<b-form-group class="mb-3" label="Email" label-for="input-login-email">
<b-form-input
id="input-login-email"
name="example-input-1"
v-model="model.email"
placeholder="Email"
:state="getValidationState(validationContext)"
aria-describedby="login-email-live-feedback"
></b-form-input>
<b-form-invalid-feedback id="login-email-live-feedback">
<b-form-invalid-feedback id="registerLastnameLiveFeedback">
{{ validationContext.errors[0] }}
</b-form-invalid-feedback>
</b-form-group>
</validation-provider>
<validation-provider
name="Email"
:rules="{ required: true, email: true }"
v-slot="validationContext"
>
<b-form-group class="mb-3" label="Email" label-for="registerEmail">
<b-form-input
id="registerEmail"
name="Email"
v-model="form.email"
placeholder="Email"
:state="getValidationState(validationContext)"
aria-describedby="registerEmailLiveFeedback"
></b-form-input>
<b-form-invalid-feedback id="registerEmailLiveFeedback">
{{ validationContext.errors[0] }}
</b-form-invalid-feedback>
</b-form-group>
</validation-provider>
<hr />
<validation-provider
:name="$t('form.password')"
:rules="{ required: true }"
v-slot="validationContext"
>
<b-form-group
class="mb-5"
class="mb-5"
:label="$t('form.password')"
label-for="input-password"
label-for="registerPassword"
>
<b-input-group>
<b-form-input
id="input-password"
id="registerPassword"
:name="$t('form.password')"
v-model="password"
v-model="form.password"
:placeholder="$t('form.password')"
:type="passwordVisible ? 'text' : 'password'"
:state="getValidationState(validationContext)"
aria-describedby="register-password-live-feedback"
aria-describedby="registerPasswordLiveFeedback"
></b-form-input>
<b-input-group-append>
@ -132,37 +126,34 @@
</b-button>
</b-input-group-append>
</b-input-group>
<b-form-invalid-feedback id="register-password-live-feedback">
<b-form-invalid-feedback id="registerPasswordLiveFeedback">
{{ validationContext.errors[0] }}
</b-form-invalid-feedback>
</b-form-group>
</validation-provider>
<b-form-group
class="mb-5"
:label="$t('form.password_repeat')"
label-for="input-password_repeat"
>
<b-input-group>
<b-form-input
id="input-password_repeat"
:name="$t('form.password_repeat')"
v-model.lazy="passwordRepeat"
:placeholder="$t('form.password_repeat')"
:type="passwordVisibleRepeat ? 'text' : 'password'"
aria-describedby="register-password-repeat-live-feedback"
></b-form-input>
<b-form-group
class="mb-5"
:label="$t('form.passwordRepeat')"
label-for="registerPasswordRepeat"
>
<b-input-group>
<b-form-input
id="registerPasswordRepeat"
:name="$t('form.passwordRepeat')"
v-model.lazy="form.passwordRepeat"
:placeholder="$t('form.passwordRepeat')"
:type="passwordVisibleRepeat ? 'text' : 'password'"
></b-form-input>
<b-input-group-append>
<b-button variant="outline-primary" @click="togglePasswordRepeatVisibility">
<b-icon :icon="passwordVisibleRepeat ? 'eye' : 'eye-slash'" />
</b-button>
</b-input-group-append>
</b-input-group>
</b-form-group>
<b-input-group-append>
<b-button variant="outline-primary" @click="togglePasswordRepeatVisibility">
<b-icon :icon="passwordVisibleRepeat ? 'eye' : 'eye-slash'" />
</b-button>
</b-input-group-append>
</b-input-group>
</b-form-group>
<transition name="hint" appear>
<div v-if="passwordValidation.errors.length > 0 && !submitted" class="hints">
<ul>
@ -180,18 +171,13 @@
</transition>
<b-row class="my-4">
<b-col cols="12">
<b-form-checkbox
id="register-checkbox"
v-model="model.agree"
name="register-checkbox"
>
<span class="text-muted" v-html="$t('site.signup.agree')"></span>
</b-form-checkbox>
<b-form-checkbox
id="registerCheckbox"
v-model="form.agree"
:name="$t('site.signup.agree')"
>
<span class="text-muted" v-html="$t('site.signup.agree')"></span>
</b-form-checkbox>
</b-col>
</b-row>
<b-alert
@ -216,17 +202,13 @@
passwordValidation.valid &&
namesFilled &&
emailFilled &&
model.agree
form.agree
"
>
<div class="text-center">
<b-button class="ml-2" @click="resetForm()">{{ $t('form.reset') }}</b-button>
<b-button type="submit" variant="primary">{{ $t('signup') }}</b-button>
</div>
<div class="text-center">
<b-button class="ml-2" @click="resetForm()">{{ $t('form.reset') }}</b-button>
<b-button type="submit" variant="primary">{{ $t('signup') }}</b-button>
</div>
</div>
</b-form>
</validation-observer>
@ -247,15 +229,15 @@ export default {
name: 'register',
data() {
return {
model: {
form: {
firstname: '',
lastname: '',
email: '',
agree: false,
password: '',
passwordRepeat: '',
},
password: '',
passwordRepeat: '',
passwordVisible: false,
passwordVisibleRepeat: false,
submitted: false,
@ -268,14 +250,13 @@ export default {
return dirty || validated ? valid : null
},
resetForm() {
this.model = {
this.form = {
firstname: '',
lastname: '',
email: '',
}
this.password= '',
this.passwordRepeat= '',
password: '',
passwordRepeat: '',
}
this.$nextTick(() => {
this.$refs.observer.reset()
})
@ -288,20 +269,21 @@ export default {
},
async onSubmit() {
const result = await loginAPI.create(
this.model.email,
this.model.firstname,
this.model.lastname,
this.password,
this.form.email,
this.form.firstname,
this.form.lastname,
this.form.password,
)
if (result.success) {
this.$store.dispatch('login', {
sessionId: result.result.data.session_id,
email: this.model.email,
email: this.form.email,
})
this.model.email = ''
this.model.firstname = ''
this.model.lastname = ''
this.form.email = ''
this.form.firstname = ''
this.form.lastname = ''
this.password = ''
this.passwordVisibleRepeat = ''
this.$router.push('/thx/register')
} else {
this.showError = true
@ -311,29 +293,29 @@ export default {
closeAlert() {
this.showError = false
this.messageError = ''
this.model.email = ''
this.model.firstname = ''
this.model.lastname = ''
this.password = ''
this.form.email = ''
this.form.firstname = ''
this.form.lastname = ''
this.form.password = ''
},
},
computed: {
samePasswords() {
return this.password === this.passwordRepeat
return this.form.password === this.form.passwordRepeat
},
passwordsFilled() {
return this.password !== '' && this.passwordRepeat !== ''
return this.form.password !== '' && this.form.passwordRepeat !== ''
},
namesFilled() {
return (
this.model.firstname !== '' &&
this.model.firstname.length > 2 &&
this.model.lastname !== '' &&
this.model.lastname.length > 1
this.form.firstname !== '' &&
this.form.firstname.length > 2 &&
this.form.lastname !== '' &&
this.form.lastname.length > 1
)
},
emailFilled() {
return this.model.email !== ''
return this.form.email !== ''
},
rules() {
return [
@ -346,7 +328,7 @@ export default {
passwordValidation() {
const errors = []
for (const condition of this.rules) {
if (!condition.regex.test(this.password)) {
if (!condition.regex.test(this.form.password)) {
errors.push(condition.message)
}
}

4
frontend/src/views/Pages/ResetPassword.vue
View File

@ -43,10 +43,10 @@
</b-form-group>
<base-input
:label="$t('form.password_repeat')"
:label="$t('form.passwordRepeat')"
type="password"
name="password-repeat"
:placeholder="$t('form.password_repeat')"
:placeholder="$t('form.passwordRepeat')"
prepend-icon="ni ni-lock-circle-open"
v-model.lazy="checkPassword"
:class="{ valid: passwordValidation.valid }"