{"id":19844855,"url":"https://github.com/lucasrmagalhaes/cypresstest-angular","last_synced_at":"2025-05-01T20:32:33.787Z","repository":{"id":38465175,"uuid":"325150616","full_name":"lucasrmagalhaes/cypressTest-angular","owner":"lucasrmagalhaes","description":"Utilizando o Cypress E2E para testar um blog em Angular.","archived":false,"fork":false,"pushed_at":"2023-01-07T22:49:38.000Z","size":4560,"stargazers_count":13,"open_issues_count":16,"forks_count":6,"subscribers_count":2,"default_branch":"main","last_synced_at":"2025-04-06T18:08:54.610Z","etag":null,"topics":["angular","cypress","dio"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/lucasrmagalhaes.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2020-12-29T00:53:04.000Z","updated_at":"2024-12-13T18:07:17.000Z","dependencies_parsed_at":"2023-02-08T03:02:46.148Z","dependency_job_id":null,"html_url":"https://github.com/lucasrmagalhaes/cypressTest-angular","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lucasrmagalhaes%2FcypressTest-angular","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lucasrmagalhaes%2FcypressTest-angular/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lucasrmagalhaes%2FcypressTest-angular/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lucasrmagalhaes%2FcypressTest-angular/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/lucasrmagalhaes","download_url":"https://codeload.github.com/lucasrmagalhaes/cypressTest-angular/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":251941286,"owners_count":21668707,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["angular","cypress","dio"],"created_at":"2024-11-12T13:05:46.913Z","updated_at":"2025-05-01T20:32:32.677Z","avatar_url":"https://github.com/lucasrmagalhaes.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003ch1 align=\"left\"\u003e\n  Testes E2E com Cypress\n\u003c/h1\u003e\n\n\u003ch3 align=\"center\"\u003eProgramação\u003c/h3\u003e\n\n\u003cul\u003e\n  \u003cli\u003eMotivação\u003c/li\u003e\n  \u003cli\u003eCypress?\u003c/li\u003e\n  \u003cli\u003eTrade-offs\u003c/li\u003e\n  \u003cli\u003ePré-Requisitos\u003c/li\u003e\n  \u003cli\u003eO que vamos testar\u003c/li\u003e\n  \u003cli\u003eInstalação\u003c/li\u003e\n  \u003cli\u003eRemovendo o Protactor\u003c/li\u003e\n  \u003cli\u003eCypress Test Runner\u003c/li\u003e\n  \u003cli\u003ePrimeiro Teste\u003c/li\u003e\n  \u003cli\u003eComo Rodar\u003c/li\u003e\n  \u003cli\u003eConfiguração\u003c/li\u003e\n  \u003cli\u003eRoteiro de Testes\u003c/li\u003e\n  \u003cli\u003eSupport Commands\u003c/li\u003e\n  \u003cli\u003eFixture\u003c/li\u003e\n  \u003cli\u003eRelatórios e Integrações\u003c/li\u003e\n  \u003cli\u003ePlugins\u003c/li\u003e\n  \u003cli\u003eIncluir Outra Spec\u003c/li\u003e\n  \u003cli\u003eFalso Negativo\u003c/li\u003e\n  \u003cli\u003eDevOps\u003c/li\u003e\n  \u003cli\u003eParalelismo\u003c/li\u003e\n  \u003cli\u003eAnalytics Dashboard\u003c/li\u003e\n\u003c/ul\u003e\n\n\u003chr\u003e\n\n\u003ch3 align=\"center\"\u003eMotivação\u003c/h3\u003e\n\n\u003cp align=\"left\"\u003e\n  \u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;Agilidade (- tempo)\u003cbr\u003e\n  \u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;Qualidade (- bugs)\u003cbr\u003e\n  \u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;Economia de horas (- custo)\n\u003c/p\u003e\n\n\u003chr\u003e\n\n\u003ch3 align=\"center\"\u003ePor que não somente Testes Unitários?\u003c/h3\u003e\n\n\u003cp align=\"left\"\u003e\n  \u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;O teste E2E simula a navegação pelo usuário, validando não só a interface frontend como integração com o backend.\u003cbr\u003e\n  \u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;Teste unitário valida a qualidade do Código. E2E valida a aplicação.\n\u003c/p\u003e\n\n\u003chr\u003e\n\n\u003ch3 align=\"center\"\u003e \n  Cypress?\n\u003c/h3\u003e\n\n\u003cp align=\"justify\"\u003e\n  \u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;JavaScritpt: Baixa curva de aprendizado, custo com treinamento reduzido.\u003cbr\u003e\n  \u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;Performance: Paralelismo, Stress Test, Load Test.\u003cbr\u003e\n  \u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;Recorder: Cypress Recorder (Chrome), Katalon Recorder.\u003cbr\u003e\n  \u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;Produtividade: Auto-reload, Spies, Stubs e Mocks.\u003cbr\u003e\n  \u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;Licença: OpenSource (Mit).\u003cbr\u003e\n  \u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;End-to-end tests, Integration tests, Unit tests.\u003cbr\u003e\n\n  \u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;Diferente do Selenium ou Appium, que injetam comandos exernos, o Cypress roda no mesmo contexto JS do App, com acesso instantâneo a todas as interações e eventos.\n\u003c/p\u003e\n\n\u003ch3 align=\"center\"\u003e \n  Trade-offs\n\u003c/h3\u003e\n\n\u003cp align=\"justify\"\u003e\n  \u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;Cypress não é uma ferramenta de automação geral.\u003cbr\u003e\n  \u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;Os comandos do Cypress sempre são executados dentro de um navegador.\u003cbr\u003e\n  \u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;Nunca haverá suporte para várias guias do navegador.\u003cbr\u003e\n  \u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;Você não pode usar o Cypress para controlar dois navegadores no mesmo teste.\n\u003c/p\u003e\n\n\u003chr\u003e\n\n\u003ch3 align=\"center\"\u003e \n  Pré-Requisitos\n\u003c/h3\u003e\n\n\u003cp\u003e\n  \u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;Git\u003cbr\u003e\n  \u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;Node\n\u003c/p\u003e\n\n\u003chr\u003e\n\n\u003ch3 align=\"center\"\u003e \n  O que vamos testar\n\u003c/h3\u003e\n\n\u003cp align=\"justify\"\u003e\n  \u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;Projeto para teste: Angular Real World Example App\n  \u003cpre\u003egit clone https://github.com/gothinkster/angular-realworld-example-app\u003c/pre\u003e\n  \u003cpre\u003ecd angular-realworld-example-app\u003c/pre\u003e\n  \u003cpre\u003enpm install\u003c/pre\u003e\n  \u003cpre\u003enpm run start\nhttp://localhost:4200/\u003c/pre\u003e\u003cbr\u003e\n  \u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;Aqui temos um aplicativo Angular contendo exemplos \"reais\" (CRUD, autenticação, etc) de acordo com a especificação para exemplos RealWord.\u003cbr\u003e\n  \u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;Vamos adicionar o Cypress!\n\u003c/p\u003e\n\n\u003chr\u003e\n\n\u003ch3 align=\"center\"\u003e \n  Instalação\n\u003c/h3\u003e\n\n\u003cp align=\"justify\"\u003e\n  \u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;Abra outro terminal. Na pasta/angular-realworld-example-app/ execute:\n  \u003cpre\u003enpm install cypress --save-dev\u003c/pre\u003e\n  \u003cpre\u003enpx cypress -v\u003c/pre\u003e\n  \u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;Caso tenha problemas com Proxy ou Firewall, baixe o \u003ca href=\"https://download.cypress.io/desktop\"\u003ebinário\u003c/a\u003e e configure a variável de ambiente antes de instalar:\n  \u003cbr\u003e\u003cbr\u003e\n  \u003cpre\u003eset CYPRESS_INSTALL_BINARY=C:\\cypress.zip\u003c/pre\u003e\n  \u003cpre\u003enpm install cypress --save-dev --verbose\u003c/pre\u003e\n\u003c/p\u003e\n\n\u003chr\u003e\n\n\u003ch3 align=\"center\"\u003e \n  Removendo o Protactor\n\u003c/h3\u003e\n\n\u003cp align=\"left\"\u003e\n  \u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;Remova o pacote:\n  \u003cpre\u003enpm uninstall protactor --save-dev\u003c/pre\u003e\n  \u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;Exclua a pasta /e2e/\u003cbr\u003e\n  \u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;Do package.json, remova a linha: \"e2e\": \"ng e2e\"\n\u003c/p\u003e\n\n\u003chr\u003e\n\n\u003ch3 align=\"center\"\u003e \n  Cypress Test Runner\n\u003c/h3\u003e\n\n\u003cp align=\"left\"\u003e\n    \u003cpre\u003enpx cypress open\u003c/pre\u003e\n    \u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;O comando \"cypress open\", além de abrir o Cypress Test Runner, cria a pasta inicial /cypress/ e o arquivo de configuração /cypress.json\u003cbr\u003e\n    \u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;E já vem com /examples/ dos principais comandos Cypress.\n\u003c/p\u003e\n\n\u003chr\u003e\n\n\u003ch3 align=\"center\"\u003e \n  Primeiro Teste\n\u003c/h3\u003e\n\n\u003cp align=\"left\"\u003e\n  \u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;cypress/integrations/exemplo.spec.js\n\n```js\ndescribe('Primeiro Teste', () =\u003e {\n  it('Exemplos Cypress', () =\u003e {\n    cy.visit('https://example.cypress.io')\n    expect(true).to.equal(true)\n  })\n})\n```\n\n  \u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;describe and it come from Mocha\u003cbr\u003e\n  \u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;expect comes from Chai\n\u003c/p\u003e\n\n\u003chr\u003e\n\n\u003ch3 align=\"center\"\u003e \n  Como Rodar\n\u003c/h3\u003e\n\n\u003cp align=\"left\"\u003e\n  \u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;Para executar todos os testes da pasta /cypress/integration/:\n  \u003cpre\u003enpx cypress run\u003c/pre\u003e\n  \u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;Para executar somente um roteiro:\n  \u003cpre\u003enpx cypress run --spec \"cypress/integration/examples/example.spec.js\"\u003c/pre\u003e\n  \u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;Para abrir a interface do Cypress Test Runner:\n  \u003cpre\u003enpx cypress open\u003c/pre\u003e\n\u003c/p\u003e\n\n\u003chr\u003e\n\n\u003ch3 align=\"center\"\u003eConfiguração\u003c/h3\u003e\n\n\u003cp align=\"left\"\u003e\n  \u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;cypress.json\n\u003cpre\u003e\n{\n  \"baseUrl\": \"http://localhost:4200\",\n  \"pageLoadTimeout\": 30000,\n  \"defaultCommandTimeOut\": 30000,\n  \"viewportHeight\": 800,\n  \"viewportWidth\": 500,\n  \"retries\": 3\n}\n\u003c/pre\u003e  \n\u003c/p\u003e\n\n\u003chr\u003e\n\n\u003ch3 align=\"center\"\u003eRoteiro de Testes\u003c/h3\u003e\n\n\u003col\u003e\n  \u003cli\u003eCadastro\u003c/li\u003e\n  \u003cli\u003eLogin\u003c/li\u003e\n  \u003cli\u003ePerfil\u003c/li\u003e\n  \u003cli\u003eFeeds\u003c/li\u003e\n  \u003cli\u003ePaginação\u003c/li\u003e\n  \u003cli\u003ePost\u003c/li\u003e\n  \u003cli\u003eTags\u003c/li\u003e\n  \u003cli\u003eComentários\u003c/li\u003e\n  \u003cli\u003eSeguir\u003c/li\u003e\n  \u003cli\u003eLogout\u003c/li\u003e\n\u003c/ol\u003e\n\n\u003chr\u003e\n\n\u003ch3 align=\"center\"\u003eCypress Recorder\u003c/h3\u003e\n\n\u003cp align=\"left\"\u003e\n  \u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u003ca href=\"https://chrome.google.com/webstore/detail/cypress-recorder/glcapdcacdfkokcmicllhcjigeodacab\"\u003eExtensão\u003c/a\u003e para o Chrome capaz de gravar um roteiro base.\u003cbr\u003e\n  \u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;Recomendado para capturar os seletores no DOM.\n\n```js\ndescribe('Conduit Cadastro', () =\u003e {\n    const usuario = 'usuario' + (new Date()).getTime()\n    const senha = 'senha' + (new Date()).getTime()\n\n    it('Novo Usuário', () =\u003e {\n        cy.visit('/register')\n        cy.get('[formcontrolname=username]').type(usuario)\n        cy.get('[formcontrolname=email]').type(usuario+'@email.com')\n        cy.get('[formcontrolname=password]').type(senha)\n        cy.get('.btn').click()\n        cy.contains('.nav-item:nth-child(4) \u003e .nav-link', usuario)\n            .should('be.visible')\n    })\n})\n```\n  \n  \u003cpre\u003enpx cypress run --spec \"cypress/integration/register.spec.js\"\u003c/pre\u003e\n\u003c/p\u003e\n\n\u003chr\u003e\n\n\u003ch3 align=\"center\"\u003eSupport Comands\u003c/h3\u003e\n\n\u003cp align=\"left\"\u003e\n  \u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;cypress/support/index.js\n\n```js\nCypress.Commands.add('login', (username, password) =\u003e {\n  cy.visit('/login')\n  cy.url().should('include', '/login')\n  cy.get('[formcontrolname=email]').type(username)\n  cy.get('[formcontrolname=password]').type(password)\n  cy.get('.btn').click()\n})\n```\n\n\u003chr\u003e\n\n\u003ch3 align=\"center\"\u003eLogin\u003c/h3\u003e\n\n\u003cp align=\"left\"\u003e\n  \u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;cypress/integration/login.spec.js\n\u003c/p\u003e\n\n```js\ndescribe('Conduit Login', () =\u003e {\n    it('Login sucesso', () =\u003e {\n        cy.login('testecypress@testecypress.com', 'testecypress')\n        cy.get('.nav-item:nth-child(4) \u003e nav-link').click()\n        cy.get('.btn:nth-child(5)').click()\n        cy.url().should('contain', '/settings')\n    })\n\n    it('Dados Inválidos', () =\u003e {\n        cy.login('usuario@inexistente.com', 'senhaerrada')\n        cy.get('.error-messages \u003e li')\n            .should('contain', 'email or password is invalid')\n    })\n})\n```\n\n\u003chr\u003e\n\n\u003ch3 align=\"center\"\u003ePerfil\u003c/h3\u003e\n\n\u003cp align=\"left\"\u003e\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;cypress/integration/perfil.spec.js\u003c/p\u003e\n\n```js\ndescribe('Profile', () =\u003e {\n    it('Editar Perfil', () =\u003e {\n        cy.login('testecypress@testecypress.com', 'testecypress')\n        cy.contains('testecypress').click()\n        cy.contains('Edit Profile Settings').click()\n        cy.get('[formcontrolname=\"image\"]').clear()\n        cy.get('[formcontrolname=\"image\"]')\n            .type('https://thispersondoesnotexist.com/image')\n        cy.get('[formcontrolname=\"password\"]').type('testecypress')\n        cy.contains('Update Settings').click()\n    })\n})\n```\n\n\u003chr\u003e\n\n\u003ch3 align=\"center\"\u003eFeeds\u003c/h3\u003e\n\n\u003cp align=\"left\"\u003e\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;cypress/integration/feed.spec.js\u003c/p\u003e\n\n```js\ndescribe('Conduit Feed', () =\u003e {\n\n    it('Ver Feeds', () =\u003e {\n        cy.login('testecypress@testecypress.com', 'testecypress')\n        cy.get('.nav-pills \u003e .nav-item:nth-child(1) \u003e .nav-link').click();\n        cy.get('.nav-pills \u003e .nav-item:nth-child(2) \u003e .nav-link').click()\n        cy.get('app-article-preview:nth-child(1) .btn').click()\n    })\n    \n})\n```\n\n\u003chr\u003e\n\n\u003ch3 align=\"center\"\u003ePagination\u003c/h3\u003e\n\n\u003cp align=\"left\"\u003e\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;cypress/integration/pagination.spec.js\u003c/p\u003e\n\n```js\ndescribe('Paginação', () =\u003e {\n    it('Paginar', () =\u003e {\n        cy.visit('/')\n        cy.get('.page-item.active \u003e a').contains('1')\n        cy.get('.page-item:nth-child(2) \u003e .page-link').click()\n        cy.get('.page-item.active \u003e a').contains('2')\n        cy.get('.page-item:nth-child(3) \u003e .page-link').click()\n        cy.get('.page-item.active \u003e a').contains('3')\n    })\n})\n```\n\n\u003chr\u003e\n\n\u003ch3 align=\"center\"\u003ePost\u003c/h3\u003e\n\n\u003cp align=\"left\"\u003e\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;cypress/integration/post.spec.js\u003c/p\u003e\n\n```js\ndescribe('Post', () =\u003e {\n\n    beforeEach(() =\u003e {\n        cy.login('testecypress@testecypress.com', 'testecypress')\n    })\n\n    it('Novo', () =\u003e {\n        const tit = 'Cypress E2E'\n        cy.contains('New Article').click()\n        cy.location('pathname').should('equal', '/editor')\n        cy.get('[formcontrolname=title]').type(tit)\n        cy.get('[formcontrolname=description]').type('Ponta a Ponta')\n        cy.get('[formcontrolname=body]').type('Agilidade, Qualidade')\n        cy.contains('Publish Article').click()\n        cy.get('h1').contains(tit)\n    })\n\n    it('Editar', () =\u003e {\n        cy.contains('testecypress').click()\n        cy.location('pathname').should('contains', '/profile')\n        cy.get('.article-preview').get('h1').first().click()\n        cy.contains('Edit Article').click()\n        cy.get('[formcontrolname=body]').clear()\n        cy.get('[formcontrolname=body]').type('Economia')\n        cy.contains('Publish Article').click()\n        cy.contains('Economia')\n    })\n\n})\n```\n\n\u003chr\u003e\n\n\u003ch3 align=\"center\"\u003eTags\u003c/h3\u003e\n\n\u003cp align=\"left\"\u003e\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;cypress/integration/tags.spec.js\u003c/p\u003e\n\n```js\ndescribe('Tags', () =\u003e {\n    it('Adicionar', () =\u003e {\n        cy.login('testecypress@testecypress.com', 'testecypress')\n        cy.contains('testecypress').click()\n        cy.location('pathname').should('contains', '/profile')\n        cy.get('.article-preview').get('h1').first().click()\n        cy.contains('Edit Article').click()\n        cy.get('[placeholder=\"Enter tags\"]').type('dungeons{enter}');\n        cy.get('[placeholder=\"Enter tags\"]').type('dragons{enter}');\n        cy.contains('Publish Article').click();\n        cy.get('.tag-list').contains('dragons');\n    })\n})\n```\n\n\u003chr\u003e\n\n\u003ch3 align=\"center\"\u003eComentários\u003c/h3\u003e\n\n\u003cp align=\"left\"\u003e\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;cypress/integration/comentarios.spec.js\u003c/p\u003e\n\n```js\ndescribe('Comentarios', () =\u003e {\n    it('Escrever', () =\u003e {\n        cy.login('testecypress@testecypress.com', 'testecypress')\n        cy.contains('Global Feed').click()\n        cy.get('.preview-link').first().click()\n        cy.get('.form-control').type('Sensacional!')\n        cy.get('.btn-primary').click()\n        cy.contains('Sensacional!')\n    })\n})\n```\n\n\u003chr\u003e\n\n\u003ch3 align=\"center\"\u003eSeguir\u003c/h3\u003e\n\n\u003cp align=\"left\"\u003e\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;cypress/integration/seguir.spec.js\u003c/p\u003e\n\n```js\ndescribe('Seguir', () =\u003e {\n    it('Seguir Usuário', () =\u003e {\n        const usuario = 'usuario'+(new Date()).getTime();\n        const senha = 'senha'+(new Date()).getTime();\n        cy.visit('/register', { timeout: 10000 })\n        cy.get('[formcontrolname=username]').type(usuario)\n        cy.get('[formcontrolname=email]').type(usuario+'@email.com')\n        cy.get('[formcontrolname=password]').type(senha)\n        cy.get('.btn').click()\n        cy.wait(10000)\n        cy.visit('/profile/testecypress')\n        cy.contains('Folow').click()\n    })\n})\n```\n\n\u003chr\u003e\n\n\u003ch3 align=\"center\"\u003eLogout\u003c/h3\u003e\n\n\u003cp align=\"left\"\u003e\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;cypress/integration/logout.spec.js\u003c/p\u003e\n\n```js\ndescribe('Logout', () =\u003e {\n    it('Logout via Perfil', () =\u003e {\n        cy.login('testecypress@testecypress.com', 'testecypress')\n        cy.contains('Settings').click()\n        cy.url().should('include', '/settings')\n        cy.get('.btn-outline-danger').click()\n    })\n})\n```\n\n\u003chr\u003e\n\n\u003ch3 align=\"center\"\u003eFixture: Data-Driven Tests\u003c/h3\u003e\n\n\u003cp align=\"left\"\u003e\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;cypress/support/index.js\u003c/p\u003e\n\n```js\nCypress.Commands.add('loadUsers', () =\u003e {\n  cy.fixture('users')\n    .as('users')\n})\n```\n\n\u003cp align=\"left\"\u003e\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;cypress/integration/test.spec.js\u003c/p\u003e\n\n```js\n// this.users.default.username\n// this.users.default.pass\n// this.users.client.username\n// this.users.client.pass\n```\n\n\u003cp align=\"left\"\u003e\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;cypress/fixtures/users.json\u003c/p\u003e\n\n```js\n{\n  \"default\":{\n    \"user\": \"basic-user\",\n    \"pass\": \"testpass\"\n  },\n  \"client\":{\n    \"user\": \"premium-user\",\n    \"pass\": \"testpass\"\n  }\n}\n```\n\n\u003chr\u003e\n\n  \u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u003ca href=\"https://docs.cypress.io/plugins/\"\u003ePlugins\u003c/a\u003e\u003cbr\u003e\n\u003cp align=\"left\"\u003e\n  \u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;Funcionalidades extendidas\u003c/p\u003e\n\n\u003chr\u003e\n\n\u003ch3 align=\"center\"\u003eRelatórios e Integrações\u003c/h3\u003e\n\n\u003cp align=\"left\"\u003e\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;Reports json, html e xml\u003c/p\u003e\n\n\u003cul\u003e\n  \u003cli\u003emocha\u003c/li\u003e\n  \u003cli\u003emochawesome\u003c/li\u003e\n  \u003cli\u003emochawesome-merge\u003c/li\u003e\n  \u003cli\u003emochawesome-report-generator\u003c/li\u003e\n  \u003cli\u003ecypress-multi-reporters\u003c/li\u003e\n  \u003cli\u003ecypress-slack-reporter\u003c/li\u003e\n  \u003cli\u003ecypress-sonarqube-reporter\u003c/li\u003e\n\u003c/ul\u003e\n\n\u003chr\u003e\n\n\u003ch3 align=\"center\"\u003eFalso Negativo\u003c/h3\u003e\n\n\u003cp align=\"left\"\u003e\n  \u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;Rede, microserviços e dependências podem falhar\u003cbr\u003e\n  \u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;Um teste E2E pode falhar por conta de outros recursos além do controle da sua aplicação:\n\u003c/p\u003e\n\n\u003cul\u003e\n  \u003cli\u003eUma API pode falhar\u003c/li\u003e\n  \u003cli\u003eInsdisponibilidade de Rede ou Firewall\u003c/li\u003e\n  \u003cli\u003eIndisponibilidade de recursos como CPU e memória\u003c/li\u003e\n  \u003cli\u003eDeploys paralelos\u003c/li\u003e\n\u003c/ul\u003e\n\n\u003ch3 align=\"center\"\u003eComo Identificar?\u003c/h3\u003e\n\n\u003cp align=\"left\"\u003e\n  \u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;Verifique se os as apis e serviços estão rodando:\n\u003c/p\u003e\n          \n```js\nit('Backend Health Checks', () =\u003e {\n  \n  cy.request('https://login/healthcheck').then((response) =\u003e {\n    expect(response.status).to.eq(200)\n  })\n  \n  cy.request('https://database/healtcheck')\n    .then((response) =\u003e {\n    expect(response.status).to.eq(200)\n  })  \n\n})\n```\n\n\u003chr\u003e\n\n\u003ch3 align=\"center\"\u003eDevOps\u003c/h3\u003e\n\n\u003cp align=\"left\u003eComo rodar no CI/CD\u003c/p\u003e\n\u003cpre\u003ecypress run\u003c/pre\u003e\n\u003cpre\u003ecypress run [--record][--key dashboard-key]\n          \n\u003cp align=\"left\u003eEnvironments:\u003c/p\u003e\n          \n\u003cul\u003e\n  \u003cli\u003eCYPRESS_BASE_URL\u003c/li\u003e\n  \u003cli\u003eCYPRESS_VIDEO_COMPRESSION\u003c/li\u003e\n  \u003cli\u003eCYPRSS_REPORTER\u003c/li\u003e\n  \u003cli\u003eCYPRESS_INSTALL_BINARY\u003c/li\u003e\n  \u003cli\u003eCYPRESS_RECORD_KEY\u003c/li\u003e\n\u003c/ul\u003e\n\n\u003cpre\u003e\n# cypress/Dockerfile\n\n# Imagem base\nFROM cypress/base:14.0.0\n\n# Copia os arquivos para a imagem\nCOPY ./\n\n# Opcional - Pega o binário local\n#ENV CYPRESS_INSTALL_BINARY=/cypress.zip\n\nRUN npm install --verbose\nRUN $(npm bin)/cypress verify\n\n# Inicialização do container\nCMD $(npm bin)/cypress run\n\u003c/pre\u003e\n\n\u003cpre\u003e\n# prompt / terminal\n\ndocker build -t cypress:0.0.1\ndocker run cypress:0.0.1\n\u003c/pre\u003e\n\n\u003chr\u003e\n\n\u003ch3 align=\"center\"\u003eParalelismo\u003c/h3\u003e\n\u003cpre\u003ecypress run --parallel --record\u003c/pre\u003e\n\n\u003ch3 align=\"center\"\u003eCypress Dashboard\u003c/h3\u003e\n\u003cpre\u003ecypress run --record --key=abc123\u003c/pre\u003e\n\n\u003ch3 align=\"center\"\u003e+ exemplos\u003c/h3\u003e\n\n\u003cp align=\"left\"\u003e1 - Cypress Kitchen Sink\u003c/p\u003e\n          \n\u003cpre\u003e\ngit clone\nhttps://github.com/cypress-io/cypress-example-kitchensink.git\n\ncd cypress-example-kitchensink\nnpm install\nnpm start\nnpm run cy:open\n\u003c/pre\u003e\n\n\u003cp align=\"left\"\u003e2 - Cypress Real Word App\u003c/p\u003e\n          \n\u003cpre\u003e\ngit clone\nhttps://github.com/cypress-io/cypress-realworld-app.git\n\ncd cypress-realworld-app\nnpm install\nnpm dev\nnpm run cypress:open\n\u003c/pre\u003e\n\n\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u003ca href=\"https://devhints.io/mocha\"\u003eCheatsheet Mocha\u003c/a\u003e\u003cbr\u003e\n\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u003ca href=\"https://devhints.io/chai\"\u003eCheatsheet Chai\u003c/a\u003e\u003cbr\u003e\n\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u0026nbsp;\u003ca href=\"https://cheatography.com/aiqbal/cheat-sheets/cypress-io/\"\u003eCheatsheet Cypress\u003c/a\u003e\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Flucasrmagalhaes%2Fcypresstest-angular","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Flucasrmagalhaes%2Fcypresstest-angular","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Flucasrmagalhaes%2Fcypresstest-angular/lists"}