├── .gitignore ├── cypress ├── fixtures │ ├── images │ │ └── cnh-digital.jpg │ ├── example.json │ └── deliver.json ├── integration │ ├── home.spec.js │ └── signup.spec.js ├── support │ ├── index.js │ └── commands.js ├── plugins │ └── index.js ├── factories │ └── SignupFactory.js └── pages │ └── SignupPage.js ├── cypress.json ├── package.json ├── .github ├── workflows │ └── workflow-cypress.yml └── logo-stiker.svg └── Readme.md /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | cypress/videos 3 | cypress/screenshots -------------------------------------------------------------------------------- /cypress/fixtures/images/cnh-digital.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/weareqacademy/cypress-discovery/HEAD/cypress/fixtures/images/cnh-digital.jpg -------------------------------------------------------------------------------- /cypress.json: -------------------------------------------------------------------------------- 1 | { 2 | "projectId": "18fqu2", 3 | "viewportWidth": 1920, 4 | "viewportHeight": 1080, 5 | "baseUrl": "https://buger-eats-qa.vercel.app" 6 | } 7 | -------------------------------------------------------------------------------- /cypress/fixtures/example.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "Using fixtures to represent data", 3 | "email": "hello@cypress.io", 4 | "body": "Fixtures are a great way to mock data for responses to routes" 5 | } 6 | -------------------------------------------------------------------------------- /cypress/integration/home.spec.js: -------------------------------------------------------------------------------- 1 | 2 | 3 | describe('home page', ()=> { 4 | it('app deve estar online', ()=> { 5 | cy.visit('/') 6 | cy.get('h1').should('have.text', 'Seja um parceiro entregador pela Buger Eats') 7 | }) 8 | }) -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "buger-eats", 3 | "version": "1.0.0", 4 | "description": "Projeto de testes de aceitação do app BugerEats", 5 | "main": "index.js", 6 | "scripts": { 7 | "test": "npx cypress open" 8 | }, 9 | "author": "Fernando Papito", 10 | "license": "MIT", 11 | "devDependencies": { 12 | "cypress": "^9.1.1", 13 | "cypress-file-upload": "^5.0.8", 14 | "faker": "^5.5.3", 15 | "gerador-validador-cpf": "^5.0.2" 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /cypress/support/index.js: -------------------------------------------------------------------------------- 1 | // *********************************************************** 2 | // This example support/index.js is processed and 3 | // loaded automatically before your test files. 4 | // 5 | // This is a great place to put global configuration and 6 | // behavior that modifies Cypress. 7 | // 8 | // You can change the location of this file or turn off 9 | // automatically serving support files with the 10 | // 'supportFile' configuration option. 11 | // 12 | // You can read more here: 13 | // https://on.cypress.io/configuration 14 | // *********************************************************** 15 | 16 | // Import commands.js using ES2015 syntax: 17 | import './commands' 18 | import 'cypress-file-upload' 19 | 20 | // Alternatively you can use CommonJS syntax: 21 | // require('./commands') 22 | 23 | -------------------------------------------------------------------------------- /cypress/plugins/index.js: -------------------------------------------------------------------------------- 1 | /// 2 | // *********************************************************** 3 | // This example plugins/index.js can be used to load plugins 4 | // 5 | // You can change the location of this file or turn off loading 6 | // the plugins file with the 'pluginsFile' configuration option. 7 | // 8 | // You can read more here: 9 | // https://on.cypress.io/plugins-guide 10 | // *********************************************************** 11 | 12 | // This function is called when a project is opened or re-opened (e.g. due to 13 | // the project's config changing) 14 | 15 | /** 16 | * @type {Cypress.PluginConfig} 17 | */ 18 | // eslint-disable-next-line no-unused-vars 19 | module.exports = (on, config) => { 20 | // `on` is used to hook into various events Cypress emits 21 | // `config` is the resolved Cypress config 22 | } 23 | -------------------------------------------------------------------------------- /.github/workflows/workflow-cypress.yml: -------------------------------------------------------------------------------- 1 | name: Cypress Regression Tests 2 | 3 | on: [push] 4 | 5 | jobs: 6 | 7 | ui-chrome-tests: 8 | runs-on: ubuntu-latest 9 | container: 10 | image: cypress/browsers:node14.17.0-chrome88-ff89 11 | options: --user 1001 12 | strategy: 13 | fail-fast: false 14 | steps: 15 | - name: Checkout 16 | uses: actions/checkout@v2 17 | 18 | - name: 'UI Tests - Chrome' 19 | uses: cypress-io/github-action@v2 20 | with: 21 | install-command: yarn install 22 | wait-on: ${{ secrets.BASE_URL }} 23 | wait-on-timeout: 120 24 | browser: chrome 25 | record: true 26 | group: 'UI - Chrome' 27 | spec: cypress/integration/* 28 | env: 29 | CYPRESS_RECORD_KEY: ${{ secrets.CYPRESS_RECORD_KEY }} 30 | GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} 31 | -------------------------------------------------------------------------------- /cypress/factories/SignupFactory.js: -------------------------------------------------------------------------------- 1 | var faker = require('faker') 2 | var cpf = require('gerador-validador-cpf') 3 | 4 | export default { 5 | 6 | deliver: function() { 7 | 8 | var firstName = faker.name.firstName() 9 | var lastName = faker.name.lastName() 10 | 11 | var data = { 12 | name: `${firstName} ${lastName}`, 13 | cpf: cpf.generate(), 14 | email: faker.internet.email(firstName), 15 | whatsapp: '11999999999', 16 | address: { 17 | postalcode: '04534011', 18 | street: 'Rua Joaquim Floriano', 19 | number: '1000', 20 | details: 'Ap 142', 21 | district: 'Itaim Bibi', 22 | city_state: 'São Paulo/SP' 23 | }, 24 | delivery_method: 'Moto', 25 | cnh: 'cnh-digital.jpg' 26 | } 27 | 28 | return data 29 | 30 | } 31 | 32 | } -------------------------------------------------------------------------------- /cypress/support/commands.js: -------------------------------------------------------------------------------- 1 | // *********************************************** 2 | // This example commands.js shows you how to 3 | // create various custom commands and overwrite 4 | // existing commands. 5 | // 6 | // For more comprehensive examples of custom 7 | // commands please read more here: 8 | // https://on.cypress.io/custom-commands 9 | // *********************************************** 10 | // 11 | // 12 | // -- This is a parent command -- 13 | // Cypress.Commands.add('login', (email, password) => { ... }) 14 | // 15 | // 16 | // -- This is a child command -- 17 | // Cypress.Commands.add('drag', { prevSubject: 'element'}, (subject, options) => { ... }) 18 | // 19 | // 20 | // -- This is a dual command -- 21 | // Cypress.Commands.add('dismiss', { prevSubject: 'optional'}, (subject, options) => { ... }) 22 | // 23 | // 24 | // -- This will overwrite an existing command -- 25 | // Cypress.Commands.overwrite('visit', (originalFn, url, options) => { ... }) 26 | 27 | -------------------------------------------------------------------------------- /cypress/fixtures/deliver.json: -------------------------------------------------------------------------------- 1 | { 2 | "signup": { 3 | "name": "Fernando Papito", 4 | "cpf": "00000014141", 5 | "email": "papito@hotmail.com", 6 | "whatsapp": "11999999999", 7 | "address": { 8 | "postalcode": "04534011", 9 | "street": "Rua Joaquim Floriano", 10 | "number": "1000", 11 | "details": "Ap 142", 12 | "district": "Itaim Bibi", 13 | "city_state": "São Paulo/SP" 14 | }, 15 | "delivery_method": "Moto", 16 | "cnh": "cnh-digital.jpg" 17 | }, 18 | "cpf_inv": { 19 | "name": "João Lucas", 20 | "cpf": "x00000141AA", 21 | "email": "joao@hotmail.com", 22 | "whatsapp": "11999999999", 23 | "address": { 24 | "postalcode": "04534011", 25 | "street": "Rua Joaquim Floriano", 26 | "number": "1000", 27 | "details": "Ap 142", 28 | "district": "Itaim Bibi", 29 | "city_state": "São Paulo/SP" 30 | }, 31 | "delivery_method": "Moto", 32 | "cnh": "cnh-digital.jpg" 33 | }, 34 | "email_inv": { 35 | "name": "Fernando Papito", 36 | "cpf": "00000014141", 37 | "email": "papito.com.br", 38 | "whatsapp": "11999999999", 39 | "address": { 40 | "postalcode": "04534011", 41 | "street": "Rua Joaquim Floriano", 42 | "number": "1000", 43 | "details": "Ap 142", 44 | "district": "Itaim Bibi", 45 | "city_state": "São Paulo/SP" 46 | }, 47 | "delivery_method": "Moto", 48 | "cnh": "cnh-digital.jpg" 49 | } 50 | } -------------------------------------------------------------------------------- /Readme.md: -------------------------------------------------------------------------------- 1 | # Cypress Discovery 2 | 3 |

4 | 5 |

6 | 7 | Cypress é um framework Node.js, confiável e fácil de usar para testar aplicações modernas que rodam no navegador. Neste curso, você primeiro aprenderá sobre o que é o Cypress, seus recursos, como ele é diferente dos demais. Além disso, vai conhecer o básico da sua linguagem que é o Javascript. 8 | 9 | ## 🚀 Tecnologias 10 | 11 | - [Node.js] - plataforma de desenvolvimento 12 | - [Javascript] - linguagem de programação universal 13 | - [Cypress] - framework de testes automatizados 14 | 15 | ## 👨🏻‍💻 Como executar o projeto 16 | 17 | [Node.js](https://nodejs.org/) v16 ou superior para executar. 18 | 19 | Abra o Prompt de comandos como Administrador e ative o Yarn por meio [do Corepack](https://nodejs.org/dist/latest/docs/api/corepack.html) executando o comando abaixo: 20 | 21 | ```sh 22 | corepack enable 23 | ``` 24 | 25 | Execute os comandos abaixo para instalar das dependências do projeto e execução dos testes: 26 | 27 | ```sh 28 | cd cypress-discovery 29 | yarn install 30 | npx cypress run 31 | ``` 32 | 33 | ## 📝 License 34 | 35 | This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details. 36 | 37 | --- 38 | 39 | Feito com 💜  por Fernando Papito 👋  [Meu linkedin](https://www.linkedin.com/in/papitoio/) 40 | 41 | [![Github](https://img.shields.io/badge/-Github-595D60?style=flat-square&logo=Github&logoColor=white&link=https://github.com/nayaraquino/)](https://github.com/papitorocks/) 42 | [![Linkedin](https://img.shields.io/badge/-LinkedIn-595D60?style=flat-square&logo=Linkedin&logoColor=white&link=https://www.linkedin.com/in/nayaraquino//)](https://www.linkedin.com/in/papitoio/) 43 | -------------------------------------------------------------------------------- /cypress/pages/SignupPage.js: -------------------------------------------------------------------------------- 1 | 2 | 3 | class SignupPage { 4 | 5 | go() { 6 | cy.visit('/') 7 | 8 | cy.get('a[href="/deliver').click() 9 | cy.get('#page-deliver form h1').should('have.text', 'Cadastre-se para fazer entregas') 10 | } 11 | 12 | fillForm(deliver) { 13 | cy.get('input[name="fullName"]').type(deliver.name) 14 | cy.get('input[name="cpf"]').type(deliver.cpf) 15 | cy.get('input[name="email"]').type(deliver.email) 16 | cy.get('input[name="whatsapp"]').type(deliver.whatsapp) 17 | 18 | cy.get('input[name="postalcode"]').type(deliver.address.postalcode) 19 | cy.get('input[type=button][value="Buscar CEP"]').click() 20 | 21 | cy.get('input[name="address-number"]').type(deliver.address.number) 22 | cy.get('input[name="address-details"]').type(deliver.address.details) 23 | 24 | cy.get('input[name="address"]').should('have.value', deliver.address.street) 25 | cy.get('input[name="district"]').should('have.value', deliver.address.district) 26 | cy.get('input[name="city-uf"]').should('have.value', deliver.address.city_state) 27 | 28 | cy.contains('.delivery-method li', deliver.delivery_method).click() 29 | cy.get('input[accept^="image"]').attachFile('/images/' + deliver.cnh) 30 | } 31 | 32 | submit() { 33 | cy.get('form button[type="submit"]').click() 34 | } 35 | 36 | modalContentShouldBe(expectedMessage) { 37 | cy.get('.swal2-container .swal2-html-container') 38 | .should('have.text', expectedMessage) 39 | } 40 | 41 | alertMessageShouldBe(expectedMessage) { 42 | //cy.get('.alert-error').should('have.text', expectedMessage) 43 | cy.contains('.alert-error', expectedMessage).should('be.visible') 44 | } 45 | 46 | } 47 | 48 | export default new SignupPage; 49 | 50 | -------------------------------------------------------------------------------- /cypress/integration/signup.spec.js: -------------------------------------------------------------------------------- 1 | import signupPage from '../pages/SignupPage' 2 | import signupFactory from '../factories/SignupFactory' 3 | 4 | describe('Signup', () => { 5 | 6 | // beforeEach(function () { 7 | // cy.fixture('deliver').then((d) => { 8 | // this.deliver = d 9 | // }) 10 | // }) 11 | 12 | it('User should be deliver', function () { 13 | 14 | var deliver = signupFactory.deliver() 15 | 16 | signupPage.go() 17 | signupPage.fillForm(deliver) 18 | signupPage.submit() 19 | 20 | const expectedMessage = 'Recebemos os seus dados. Fique de olho na sua caixa de email, pois e em breve retornamos o contato.' 21 | signupPage.modalContentShouldBe(expectedMessage) 22 | }) 23 | 24 | it('Incorrect document', function () { 25 | 26 | var deliver = signupFactory.deliver() 27 | 28 | deliver.cpf = '000000141aa' 29 | 30 | signupPage.go() 31 | signupPage.fillForm(deliver) 32 | signupPage.submit() 33 | signupPage.alertMessageShouldBe('Oops! CPF inválido') 34 | }) 35 | 36 | it('Incorrect email', function () { 37 | 38 | var deliver = signupFactory.deliver() 39 | 40 | deliver.email = 'user.com.br' 41 | 42 | signupPage.go() 43 | signupPage.fillForm(deliver) 44 | signupPage.submit() 45 | signupPage.alertMessageShouldBe('Oops! Email com formato inválido.') 46 | }) 47 | 48 | context('Required fields', function () { 49 | 50 | const messages = [ 51 | { field: 'name', output: 'É necessário informar o nome' }, 52 | { field: 'cpf', output: 'É necessário informar o CPF' }, 53 | { field: 'email', output: 'É necessário informar o email' }, 54 | { field: 'postalcode', output: 'É necessário informar o CEP' }, 55 | { field: 'number', output: 'É necessário informar o número do endereço' }, 56 | { field: 'delivery_method', output: 'Selecione o método de entrega' }, 57 | { field: 'cnh', output: 'Adicione uma foto da sua CNH' } 58 | ] 59 | 60 | before(function(){ 61 | signupPage.go() 62 | signupPage.submit() 63 | }) 64 | 65 | messages.forEach(function(msg){ 66 | it(`${msg.field} is required`, function(){ 67 | signupPage.alertMessageShouldBe(msg.output) 68 | }) 69 | }) 70 | 71 | }) 72 | 73 | }) -------------------------------------------------------------------------------- /.github/logo-stiker.svg: -------------------------------------------------------------------------------- 1 | --------------------------------------------------------------------------------