refactor: add alert into login page

package.json

@@ -10,7 +10,7 @@
     "build": "",
     "test:unit": "dotenv -e .env.test -- npx jest unit --passWithNoTests --watch --silent=false --config=jest.unit.config.js",
     "test:int": "dotenv -e .env.test -- npx jest int --passWithNoTests --watch --silent=false --detectOpenHandles --config=jest.int.config.js",
-    "test:e2e": "dotenv -e .env.test -- npx jest e2e --passWithNoTests --watch --silent=false --detectOpenHandles --runInBand --config=jest.e2e.config.js",
+    "test:e2e:api": "dotenv -e .env.test -- npx jest e2e --passWithNoTests --watch --silent=false --detectOpenHandles --runInBand --config=jest.e2e.config.js",
     "test:e2e:web": "dotenv -e .env.test -- npx playwright test --ui"
   },
   "keywords": [],
@@ -58,4 +58,4 @@
     "nodemailer": "^6.9.8",
     "pg": "^8.11.3"
   }
-}
+}

src/application/pages/login.e2e.spec.ts

@@ -2,6 +2,8 @@ import { faker } from '@faker-js/faker/locale/pt_BR';
 import { expect, test } from '@playwright/test';
 
 test.describe('Login Page', () => {
+  let user_id = '';
+
   const user = {
     name: faker.person.fullName(),
     email: faker.internet.email(),
@@ -10,10 +12,18 @@ test.describe('Login Page', () => {
   };
 
   test.beforeAll(async ({ request }) => {
-    await request.post('/api/users', {
+    const response = await request.post('/api/users', {
       data: user,
       headers: { 'Content-Type': 'application/json' },
     });
+
+    const data = await response.json();
+
+    user_id = data.id;
+  });
+
+  test.afterAll(async ({ request }) => {
+    await request.delete(`/api/users/${user_id}`);
   });
 
   test.beforeEach(async ({ page }) => {
@@ -101,4 +111,22 @@ test.describe('Login Page', () => {
 
     expect(cookies.some((cookie) => cookie.name === 'AT')).toBeTruthy();
   });
+
+  test('should inform the user if credentials are wrong', async ({ page, baseURL }) => {
+    const email_input = page.getByTestId('login-email');
+    await email_input.fill(user.email);
+
+    const password_input = page.getByTestId('login-password');
+    await password_input.fill(`${faker.string.alphanumeric(10)}!@#!$`);
+
+    const submit_button = page.getByTestId('login-submit');
+    await submit_button.click();
+
+    await page.waitForResponse(`${baseURL}/forms/login`);
+
+    const alert_message = page.getByTestId('alert-message');
+
+    const text = await alert_message.innerText();
+    expect(text).toBe('E-mail ou senha inválido.');
+  });
 });

src/application/pages/signup.e2e.spec.ts

@@ -2,6 +2,7 @@ import { faker } from '@faker-js/faker/locale/pt_BR';
 import { expect, test } from '@playwright/test';
 
 test.describe('Signup Page', () => {
+  let user_id = '';
   const user = {
     name: faker.person.fullName(),
     email: faker.internet.email(),
@@ -10,10 +11,18 @@ test.describe('Signup Page', () => {
   };
 
   test.beforeAll(async ({ request }) => {
-    await request.post('/api/users', {
+    const response = await request.post('/api/users', {
       data: user,
       headers: { 'Content-Type': 'application/json' },
     });
+
+    const data = await response.json();
+
+    user_id = data.id;
+  });
+
+  test.afterAll(async ({ request }) => {
+    await request.delete(`/api/users/${user_id}`);
   });
 
   test.beforeEach(async ({ page }) => {

src/application/routers/forms.ts

@@ -1,3 +1,4 @@
+import CredentialError from '@shared/CredentialError';
 import EmailAlreadyRegisteredError from '@shared/EmailAlreadyRegisteredError';
 import { Request, Response, Router } from 'express';
 import { auth_service, user_service } from 'src/bootstrap';
@@ -21,6 +22,10 @@ router.post('/login', async (request: Request, response: Response) => {
     return response.redirect('/');
   }
 
+  if (result.error instanceof CredentialError) {
+    return response.redirect(`/pages/login?error_message=${result.error.message}`);
+  }
+
   return response.render('/pages/login');
 });
 

src/application/routers/pages.ts

@@ -28,6 +28,8 @@ router.get('/index', auth, (_request: Request, response: Response) => {
 });
 
 router.get('/login', (request: Request, response: Response) => {
+  const { error_message } = request.query;
+
   if (request.headers.cookie) {
     const cookies = request.headers.cookie.split(';');
     const has_access_token = cookies.find((cookie) => cookie.split('=')[0] === 'AT');
@@ -37,17 +39,23 @@ router.get('/login', (request: Request, response: Response) => {
     }
   }
 
+  const alerts = [];
+
+  if (error_message) {
+    alerts.push({ message: error_message });
+  }
+
   return response.render('login', {
     title: 'Login!',
     scripts: getScriptUrls(['captcha', 'validator', 'login_form']),
+    alerts,
   });
 });
 
 router.get('/signup', (request: Request, response: Response) => {
   const { error_message } = request.query;
   const alerts = [];
 
-  console.log('QUERY', error_message);
   if (error_message) {
     alerts.push({ message: error_message });
   }