test: add e2e test for updating password

cypress/e2e/Settings/SettingsAccountView.cy.ts

@@ -9,7 +9,7 @@ describe('SettingsAccount Test', () => {
     cy.wait(1000)
   });
 
-  it('update email of user', () => {
+  it('updates email of user', () => {
     cy.get('[data-cy="email-input"]').find('[data-cy="bi-input"]')
     .should('have.value','user@example.com')
     cy.get('[data-cy="email-input"]').find('[data-cy="bi-input"]').clear()

cypress/e2e/Settings/SettingsSecurityView.cy.ts

+describe('SettingsSecurity Test', () => {
+  beforeEach(() => {
+    cy.visit('/login');
+    cy.get('#emailInput input').type('user@example.com');
+    cy.get('#passwordInput input').type('John1');
+    cy.get('form').submit();
+    cy.wait(1000);
+    cy.visit('/settings/security')
+    cy.wait(1000)
+  });
+
+  it('updates password of user', () => {
+    cy.get('[data-cy="old-password-input"]').find('[data-cy="bi-input"]').clear()
+    cy.get('[data-cy="old-password-input"]').find('[data-cy="bi-input"]').type('John1')
+
+    cy.get('[data-cy="new-password-input"]').find('[data-cy="bi-input"]').clear()
+    cy.get('[data-cy="new-password-input"]').find('[data-cy="bi-input"]').type('NewJohn1Password')
+
+    cy.get('[data-cy="confirm-password-input"]').find('[data-cy="bi-input"]').clear()
+    cy.get('[data-cy="confirm-password-input"]').find('[data-cy="bi-input"]').type('NewJohn1Password')
+    cy.get('[data-cy="update-password-btn"]').click()
+
+    cy.get('[data-cy="menu"]').get('[data-cy="user"]').click();
+    cy.get('[data-testid="logout"]').click();
+
+    // reset all changes made to the user
+    cy.get('#emailInput input').type('user@example.com');
+    cy.get('#passwordInput input').type('NewJohn1Password');
+    cy.get('form').submit();
+    cy.wait(1000);
+    cy.visit('/settings/security')
+    cy.wait(1000)
+
+    cy.get('[data-cy="old-password-input"]').find('[data-cy="bi-input"]').clear()
+    cy.get('[data-cy="old-password-input"]').find('[data-cy="bi-input"]').type('NewJohn1Password')
+
+    cy.get('[data-cy="new-password-input"]').find('[data-cy="bi-input"]').clear()
+    cy.get('[data-cy="new-password-input"]').find('[data-cy="bi-input"]').type('John1')
+
+    cy.get('[data-cy="confirm-password-input"]').find('[data-cy="bi-input"]').clear()
+    cy.get('[data-cy="confirm-password-input"]').find('[data-cy="bi-input"]').type('John1')
+    cy.get('[data-cy="update-password-btn"]').click()
+
+
+  })
+})
\ No newline at end of file

src/views/Settings/SettingsSecurityView.vue

@@ -5,23 +5,28 @@
         <form @submit.prevent="handleSubmit" novalidate>
             <div class="form-group">
                 <label class="d-block">Endre passord</label>
-                <BaseInput :model-value="oldPasswordRef" @input-change-event="handleOldPasswordInputEvent"
+                <BaseInput data-cy="old-password-input" :model-value="oldPasswordRef"
+                            @input-change-event="handleOldPasswordInputEvent"
                     id="passwordInput-change" input-id="password-old" type="password"
                     pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{4,16}" label="Gammelt passord" placeholder="Skriv inn passord"
                     invalid-message="Passordet må være mellom 4 og 16 tegn og inneholde en stor bokstav, en liten bokstav og et tall" />
 
-                <BaseInput :model-value="newPasswordRef" @input-change-event="handleNewPasswordInputEvent"
+                <BaseInput data-cy="new-password-input" :model-value="newPasswordRef"
+                            @input-change-event="handleNewPasswordInputEvent"
                     id="passwordInput-change" input-id="password-new" type="password"
                     pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{4,16}" label="Nytt passord" placeholder="Skriv inn passord"
                     invalid-message="Passordet må være mellom 4 og 16 tegn og inneholde en stor bokstav, en liten bokstav og et tall" />
 
-                <BaseInput :model-value="confirmPasswordRef" @input-change-event="handleConfirmPasswordInputEvent"
+                <BaseInput data-cy="confirm-password-input" :model-value="confirmPasswordRef"
+                            @input-change-event="handleConfirmPasswordInputEvent"
                     id="passwordInput-change" input-id="password-confirm" type="password"
                     pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{4,16}" label="Bekreft nytt passord" placeholder="Skriv inn passord"
                     invalid-message="Passordet må være mellom 4 og 16 tegn og inneholde en stor bokstav, en liten bokstav og et tall" />
             </div>
-            <button type="submit" class="btn btn-primary">Oppdater passord</button>
-            <button type="reset" class="btn btn-light">Tilbakestill endringer</button>
+            <button data-cy="update-password-btn" type="submit" class="btn btn-primary">Oppdater
+              passord</button>
+            <button data-cy="reset-fields-btn" type="reset" class="btn btn-light">Tilbakestill
+              endringer</button>
         </form>
         <hr>
     </div>