Fix error rendering bug in 'Change Password' form

[SakshiUppoor]

Fixes #1733

The error is not being displayed because the hidden condition is:

juice-shop/frontend/src/app/change-password/change-password.component.html

Line 17 in 57b5d56

[hidden]="!(error && !passwordControl.dirty && !newPasswordControl.dirty && !repeatNewPasswordControl.dirty)">

This condition always remains true because passwordControl.dirty always remains true. This is due to the fact that whenever the server returns an error, then resetPasswords() is called, which only sets newPasswordControl and repeatNewPasswordControl to untouched & pristine and not passwordControl. Therefore, passwordControl always remains dirty.

juice-shop/frontend/src/app/change-password/change-password.component.ts

Lines 52 to 57 in 5315f9c

	}, (error) => {
	console.log(error)
	this.error = error
	this.confirmation = undefined
	this.resetPasswords()
	})

To solve this issue, I shifted lines 62 and 63 to resetPasswords()

juice-shop/frontend/src/app/change-password/change-password.component.ts

Lines 60 to 74 in 5315f9c

	resetForm () {
	this.passwordControl.setValue('')
	this.passwordControl.markAsPristine()
	this.passwordControl.markAsUntouched()
	this.resetPasswords()
	}
	resetPasswords () {
	this.newPasswordControl.setValue('')
	this.newPasswordControl.markAsPristine()
	this.newPasswordControl.markAsUntouched()
	this.repeatNewPasswordControl.setValue('')
	this.repeatNewPasswordControl.markAsPristine()
	this.repeatNewPasswordControl.markAsUntouched()
	}

Tested on:
OS: Windows 10
Browser: Google Chrome - Version 94.0.4606.81 (Official Build) (64-bit)

[bkimminich]

Wow, I totally overlooked that one... Great that you found it! CI is running now, will merge once it passes! 👍