Merge pull request #21 from Pedro0505/frontend-tests

e2e tests

__tests__/e2e/.gitignore

@@ -0,0 +1 @@
+node_modules

__tests__/e2e/cypress.config.ts

@@ -0,0 +1,13 @@
+import { defineConfig } from "cypress";
+
+export default defineConfig({
+  video: false,
+  viewportHeight: 1080,
+  viewportWidth: 1920,
+
+  e2e: {
+    specPattern: 'cypress/e2e/**/*.{js,jsx,ts,tsx}',
+    baseUrl: process.env.BASE_URL_CYPRESS || 'http://localhost:3000',
+    setupNodeEvents(on, config) {},
+  },
+});

__tests__/e2e/cypress/e2e/create-client.e2e-spec.ts

@@ -0,0 +1,67 @@
+describe('Create page', () => {
+  after(() => {
+    cy.exec('cd .. && cd backend && DATABASE_URL=file:./dev-test.db npx prisma migrate reset --force')
+  });
+
+  it('Testing if visit from home is possible create a client', () => {
+    cy.visit('/');
+
+    cy.get('.home-page-listing-view-header-new-client-btn').click();
+    cy.get('.input-field[name="name"]').type('Test 1');
+    cy.get('.input-field[name="email"]').type('[email protected]');
+    cy.get('.input-field[name="cpf"]').type('80477413064');
+    cy.get('.input-field[name="phoneNumber"]').type('82996798270');
+    cy.get('.client-form-select-status[name="status"]').select('Ativo');
+
+    cy.get('.client-form-submit-btn').click();
+    cy.wait(1000);
+    cy.get('.alert-container').should('be.visible');
+  });
+
+  it('Testing if visit home the user has be created', () => {
+    cy.visit('/client/create');
+
+    cy.get('.input-field[name="name"]').type('Test 2');
+    cy.get('.input-field[name="email"]').type('[email protected]');
+    cy.get('.input-field[name="cpf"]').type('75490171073');
+    cy.get('.input-field[name="phoneNumber"]').type('68986773663');
+    cy.get('.client-form-select-status[name="status"]').select('Ativo');
+
+    cy.get('.client-form-submit-btn').click();
+    cy.wait(5000);
+    cy.get('.client-form-back-btn').click();
+
+    cy.get('.client-card:last-child .client-card-name-email-container > *:first-child').should('have.text', 'Test 2');
+    cy.get('.client-card:last-child .client-card-name-email-container > *:last-child').should('have.text', '[email protected]');
+    cy.get('.client-card:last-child .client-card-cpf-phoneNumber-container > *:first-child').should('have.text', '754.901.710-73');
+    cy.get('.client-card:last-child .client-card-cpf-phoneNumber-container > *:last-child').should('have.text', '(68) 98677-3663');
+  });
+
+  it('Testing if have errror when try create with repeted data', () => {
+    cy.visit('/client/create');
+
+    cy.get('.input-field[name="name"]').type('Test 1');
+    cy.get('.input-field[name="email"]').type('[email protected]');
+    cy.get('.input-field[name="cpf"]').type('80477413064');
+    cy.get('.input-field[name="phoneNumber"]').type('82996798270');
+    cy.get('.client-form-select-status[name="status"]').select('Ativo');
+
+    cy.get('.client-form-submit-btn').click();
+
+    cy.get('.error-message-text').should('have.text', 'Dados de úsuario que já estão cadastrado');
+  });
+
+  describe('Testing error create form', () => {
+    it('Testing if have errors when fields is empty', () => {
+      cy.visit('/client/create');
+
+      cy.get('.client-form-submit-btn').click();
+
+      cy.get('.error-message-text').should('contain', 'O nome não pode ser vazio');
+      cy.get('.error-message-text').should('contain', 'O CPF não pode ser vazio');
+      cy.get('.error-message-text').should('contain', 'O email não pode ser vazio');
+      cy.get('.error-message-text').should('contain', 'O número de telefone não pode ser vazio');
+      cy.get('.error-message-text').should('contain', 'O status não pode ser vazio');
+    })
+  });
+});

__tests__/e2e/cypress/e2e/edit-client.e2e-spec.ts

@@ -0,0 +1,64 @@
+describe('Edit page', () => {
+  after(() => {
+    cy.exec('cd .. && cd backend && DATABASE_URL=file:./dev-test.db npx prisma migrate reset --force')
+  });
+
+  it('Testing if visit from home is possible edit a client', () => {
+    cy.visit('/');
+
+    cy.get('.client-card:first-child .client-card-edit-btn').click();
+    cy.get('.input-field[name="email"]').clear();
+    cy.get('.input-field[name="email"]').type('[email protected]');
+
+    cy.get('.client-form-submit-btn').click();
+    cy.wait(1000);
+    cy.get('.alert-container').should('be.visible');
+  });
+
+  it('Testing if visit home the user has be edited', () => {
+    cy.visit('/');
+
+    cy.get('.client-card:first-child .client-card-edit-btn').click();
+    cy.get('.input-field[name="email"]').clear();
+    cy.get('.input-field[name="email"]').type('[email protected]');
+
+    cy.get('.client-form-submit-btn').click();
+    cy.wait(5000);
+    cy.get('.client-form-back-btn').click();
+
+    cy.get('.client-card:first-child .client-card-name-email-container > *:last-child').should('have.text', '[email protected]');
+  });
+
+  it('Testing if have errror when try edit with repeted data', () => {
+    cy.visit('/');
+
+    cy.get('.client-card:first-child .client-card-edit-btn').click();
+    cy.get('.input-field[name="email"]').clear();
+    cy.get('.input-field[name="email"]').type('[email protected]');
+
+    cy.get('.client-form-submit-btn').click();
+
+    cy.get('.error-message-text').should('have.text', 'Dados de úsuario que já estão cadastrado');
+  });
+
+  describe('Testing error edit form', () => {
+    it('Testing if have errors when fields is empty', () => {
+      cy.visit('/');
+
+      cy.get('.client-card:first-child .client-card-edit-btn').click();
+
+      cy.get('.input-field[name="name"]').clear();
+      cy.get('.input-field[name="email"]').clear();
+      cy.get('.input-field[name="cpf"]').clear();
+      cy.get('.input-field[name="phoneNumber"]').clear();
+      cy.get('.client-form-select-status[name="status"]').select('Ativo');
+
+      cy.get('.client-form-submit-btn').click();
+
+      cy.get('.error-message-text').should('contain', 'O nome não pode ser vazio');
+      cy.get('.error-message-text').should('contain', 'O CPF não pode ser vazio');
+      cy.get('.error-message-text').should('contain', 'O email não pode ser vazio');
+      cy.get('.error-message-text').should('contain', 'O número de telefone não pode ser vazio');
+    });
+  });
+});

__tests__/e2e/cypress/e2e/home.e2e-spec.ts

@@ -0,0 +1,29 @@
+describe('Home page', () => {
+  it('Testing if all clients to be in page when visit', () => {
+    cy.visit('/');
+
+    cy.get('.client-card').should('have.length', '3');
+    cy.get('.home-page-client-count').should('have.text', 'Exibindo 3 número de clientes');
+  });
+
+  it('Testing if create client button have in page', () => {
+    cy.visit('/');
+
+    cy.get('.home-page-listing-view-header-new-client-btn').should('exist');
+    cy.get('.home-page-client-count').should('have.text', 'Exibindo 3 número de clientes');
+  });
+
+  it('Testing if create client button redirect for the correct page', () => {
+    cy.visit('/');
+
+    cy.get('.home-page-listing-view-header-new-client-btn').click();
+    cy.url().should('contain', 'client/create');
+  });
+
+  it('Testing if edot client button redirect for the correct page', () => {
+    cy.visit('/');
+
+    cy.get('div.home-page-listing-view > section > div:nth-child(1) > button.client-card-edit-btn').click();
+    cy.url().should('contain', 'client/edit?clientId=');
+  });
+});

__tests__/e2e/cypress/support/commands.ts

@@ -0,0 +1 @@
+import './commands'

__tests__/e2e/cypress/support/e2e.ts

@@ -0,0 +1,20 @@
+// ***********************************************************
+// This example support/e2e.js is processed and
+// loaded automatically before your test files.
+//
+// This is a great place to put global configuration and
+// behavior that modifies Cypress.
+//
+// You can change the location of this file or turn off
+// automatically serving support files with the
+// 'supportFile' configuration option.
+//
+// You can read more here:
+// https://on.cypress.io/configuration
+// ***********************************************************
+
+// Import commands.js using ES2015 syntax:
+import './commands'
+
+// Alternatively you can use CommonJS syntax:
+// require('./commands')

__tests__/e2e/cypress/tsconfig.json

@@ -0,0 +1,8 @@
+{
+  "compilerOptions": {
+    "target": "es5",
+    "lib": ["es5", "dom"],
+    "types": ["cypress", "node"]
+  },
+  "include": ["**/*.ts"]
+}