Realizando e adaptando boa parte das refatorações sugeridas no PR 1 -…

… Refactor the whole thing da live Talking About Testing 11.02.2023

.github/workflows/workflow-testes-automatizados-e2e-front-serve-rest-cypress.yml

@@ -30,8 +30,12 @@ jobs:
     steps:
       - name: Passo 1 - Obter cópia do código-fonte do repositório
         uses: actions/[email protected]
+
+      - name: Passo 2 - Redirecionar o conteúdo de "secrets.LOGIN_ENV" para o arquivo "login.json"
+        run: |
+          echo '${{ secrets.LOGIN_ENV }}' > ./cypress/fixtures/login.json
         
-      - name: Passo 2 - Instalar dependências, Executar testes em modo headless (2º plano) em um ambiente de desenvolvimento e Gerar os resultados dos testes
+      - name: Passo 3 - Instalar dependências, Executar testes em modo headless (2º plano) em um ambiente de desenvolvimento e Gerar os resultados dos testes
         uses: cypress-io/[email protected]
         with:
           # forçar, mesmo tendo possíveis conflitos, a instalação das dependências do projeto do arquivo "package.json"
@@ -56,5 +60,4 @@ jobs:
         with:
           name: cypress-screenshots-chrome
           path: ./cypress/screenshots
-          # armazena por 30 dias
           retention-days: 30

.gitignore

@@ -1,3 +1,7 @@
-node_modules
+cypress/downloads
+cypress/fixtures/*.json
+!cypress/fixtures/*.example.json
 cypress/videos
-cypress/screenshots
+cypress/screenshots
+node_modules
+.DS_Store

cypress.config.js

@@ -1,17 +1,16 @@
 const { defineConfig } = require('cypress')
 
 module.exports = defineConfig({
+  viewportWidth: 1280,
+  viewportHeight: 720,
+
   e2e: {
-    viewportWidth: 1280,
-		viewportHeight: 720,
-
     setupNodeEvents(on, config) {
-      // implement node event listeners here
       const environment = config.env.environment || 'dev'
       config.env = require(`./cypress/support/environments/${environment}.json`)
-      config.baseUrl = config.env.urlDefault
+      config.baseUrl = config.env.baseUrl
 
       return config
     },
   },
-});
+})

cypress/e2e/login-entrar.cy.js

@@ -1,30 +1,30 @@
 /// <reference types="cypress" />
 import seletores from '../support/seletores'
 
-/* login-entrar.cy.js
+/*
   Funcionalidade: Tela Login - Botão Entrar
     Como usuário da Tela Login do front do ServeRest
     Quero clicar no Botão Entrar
     Para validar o comportamento da funcionalidade
  */
 
 describe('Funcionalidade: Tela Login - Botão Entrar', () => {
-  context('Cenário: Validar Login usuário administrador', () => {
-    context('Dado que eu acesse a tela de Login do front do ServeRest', () => {
-      before(() => {
-        cy.visit('/login')
-      })
+  context('Dado que eu acesse a tela de Login do front do ServeRest', () => {
+    beforeEach(() => {
+      cy.visit('/login')
+    })
 
+    context('Cenário: Validar Login usuário administrador', () => {
       context('Quando eu informar os campos de email e senha de um usuário administrador', () => {
         beforeEach(() => {
           cy.fixture('login').then((loginFixture) => {
-            cy.realizarLoginEntrar(loginFixture.adminValido1.emailValido1, loginFixture.adminValido1.senhaValida1)
+            cy.realizarLoginBotaoEntrar(loginFixture.adminValido.emailValido, loginFixture.adminValido.senhaValida)
           })
         })
 
         it('Então deverá apresentar a tela Home com o texto Bem Vindo e com o texto Este é seu sistema para administrar seu ecommerce', () => {
           cy.url().should('include', `${Cypress.config('baseUrl')}/admin/home`)
-          
+
           cy.get(seletores.HOME.TEXTO_BEM_VINDO)
             .should('be.visible')
             .should('contain', 'Bem Vindo')
@@ -35,25 +35,19 @@ describe('Funcionalidade: Tela Login - Botão Entrar', () => {
         })
       })
     })
-  })
-
-  context('Esquema do Cenário: Validar Login usuários inválidos', () => {
-    context('Dado que eu acesse a tela de Login do front do ServeRest', () => {
-      beforeEach(() => {
-        cy.visit('/login')
-      })
 
-      context('Quando eu informar os campos de email e senha incorretamente', () => {
-        const exemplos = [
-          { email: 'emailInvalidoVazio1', senha: 'senhaInvalidaVazia1', mensagem: '×Email é obrigatório×Password é obrigatório' },
-          { email: 'emailInvalidoDominioSemPonto1', senha: 'senhaValida2', mensagem: 'Email deve ser um email válido' },
-          { email: 'emailInvalidoNaoCadastrado1', senha: 'senhaInvalidaNaoCadastrada1', mensagem: 'Email e/ou senha inválidos' },
-        ]
+    context('Esquema do Cenário: Validar Login usuários inválidos', () => {
+      const exemplos = [
+        { email: 'emailInvalidoVazio', senha: 'senhaInvalidaVazia', mensagem: '×Email é obrigatório×Password é obrigatório' },
+        { email: 'emailInvalidoDominioSemPonto', senha: 'senhaValida', mensagem: 'Email deve ser um email válido' },
+        { email: 'emailInvalidoNaoCadastrado', senha: 'senhaInvalidaNaoCadastrada', mensagem: 'Email e/ou senha inválidos' },
+      ]
 
-        exemplos.forEach((ex) => {
+      exemplos.forEach((ex) => {
+        context(`Quando eu informar os campos de email e senha incorretamente ${ex.email} e ${ex.senha}`, () => {
           it(`Então na tela Login deverá apresentar a mensagem ${ex.mensagem}`, () => {
             cy.fixture('login').then((loginFixture) => {
-              cy.realizarLoginEntrar(loginFixture.invalido1[ex.email], loginFixture.invalido1[ex.senha])
+              cy.realizarLoginBotaoEntrar(loginFixture.invalido[ex.email], loginFixture.invalido[ex.senha])
             })
 
             cy.get(seletores.LOGIN.FORM_LOGIN)

cypress/fixtures/login.example.json

@@ -0,0 +1,14 @@
+{
+    "adminValido": {
+        "emailValido": "[email protected]",
+        "senhaValida": "informar-senha-usuario-admin-valido"
+    },
+    "invalido": {
+        "emailInvalidoVazio": "deixar-apenas-as-aspas-duplas",
+        "senhaInvalidaVazia": "deixar-apenas-as-aspas-duplas",
+        "emailInvalidoDominioSemPonto": "informar-email-usuario-invalido-dominio-sem-ponto@dominio",
+        "senhaValida": "informar-senha-usuario-valido",
+        "emailInvalidoNaoCadastrado": "[email protected]",
+        "senhaInvalidaNaoCadastrada": "informar-senha-usuario-invalido-nao-cadastrada"
+    }
+}

cypress/support/commands.js

@@ -27,26 +27,26 @@ import seletores from './seletores'
 // -- This will overwrite an existing command --
 // Cypress.Commands.overwrite('visit', (originalFn, url, options) => { ... })
 
-Cypress.Commands.add('realizarLoginEntrar', (email = '', senha = '') => {
+Cypress.Commands.add('realizarLoginBotaoEntrar', (email = '', senha = '') => {
     cy.get(seletores.LOGIN.CAMPO_EMAIL).as('campoEmail')
     cy.get(seletores.LOGIN.CAMPO_SENHA).as('campoSenha')
     cy.get(seletores.LOGIN.BOTAO_ENTRAR).as('botaoEntrar')
 
     if (email !== '') {
         cy.get('@campoEmail')
-            .should('be.visible')
-            .click()
-            .type(email)
+          .should('be.visible')
+          .click()
+          .type(email)
     }
 
     if (senha !== '') {
         cy.get('@campoSenha')
-            .should('be.visible')
-            .click()
-            .type(senha, { log: false })
+          .should('be.visible')
+          .click()
+          .type(senha, { log: false })
     }
 
     cy.get('@botaoEntrar')
-        .should('be.visible')
-        .click()
+      .should('be.visible')
+      .click()
 })

cypress/support/environments/dev.json

@@ -1,4 +1,4 @@
 {
-    "urlDefault": "https://front.serverest.dev",
+    "baseUrl": "https://front.serverest.dev",
     "baseUri": "https://serverest.dev"
 }

cypress/support/environments/local.json

@@ -1,4 +1,4 @@
 {
-    "urlDefault": "http://localhost:3001",
+    "baseUrl": "http://localhost:3001",
     "baseUri": "https://serverest.dev"
 }

package.json

@@ -2,9 +2,10 @@
   "name": "testes-automatizados-e2e-front-serve-rest_cypress",
   "version": "1.0.0",
   "description": "Projeto de Testes Automatizados E2E no front e API REST do ServeRest em Cypress",
-  "main": "index.js",
+  "main": "cypress.config.js",
   "scripts": {
-    "test": "npx cypress open"
+    "cy:open": "cypress open",
+    "test": "cypress run --browser chrome"
   },
   "author": "Andressa Karla",
   "license": "ISC",