Frameworks de Testes
End-to-end
NodeJS
Oi!
Bárbara Cabral
QA Engineer
◎ NodeJS
◎ Frameworks em NodeJS
◉ CucumberJS
◉ Protractor
◉ CodeceptJS
◉ BackstopJS
Agenda
NodeJS
◎ Node.js é um interpretador de código
JavaScript com base no V8 JavaScript
Engine do Google
◎ Criado por Ryan Dahl em 2009
◎ Arquitetura baseada em eventos,
desenvolvida para trabalhar com tarefas
assíncronas de forma não obstrutiva
◎ Permite o uso de Javascript no back e no
front
◎
NPM
◎ NPM é um gerenciador de pacotes para
código JavaScript
◎ Considerado o maior registro de software
do mundo
◎ Instalação de pacotes:
◎ Cria um arquivo package.json
NPM install
Frameworks em NodeJS
◎ Especificação
◉ CucumberJS
◎ Protractor
◎ CodeceptJS
◎ BackstopJS
Frameworks
CucumberJS
◎ Versão em Javascript do Cucumber
◉ Framework de Especificação para BDD
◎ Sintaxe da linguagem é gherkin
◎ Executa com o NodeJS
◎ Baseado em:
◉ Feature files
◉ Step Files
◎ Especificar os cenários ANTES de
desenvolver
◎ Automatizá-los DEPOIS de desenvolvidos
CucumberJS
CucumberJS
CucumberJS
Protractor
◎ Executa com o Node.js usando o WebDriver
(selenium) para controlar o browser e simular
as ações dos usuários
◎ Identifica elementos do AngularJS
◎ Usa a biblioteca do Jasmine para sua sintaxe
de testes.
◎ Sintaxe é similar à sintaxe dos testes unitários,
contendo um arquivo de teste com um ou
mais blocos de “it” que descrevem os
requisitos da aplicação.
Protractor
Protractor
Protractor + PageObj
PageObject
CodeceptJS
◎ É baseado em cenários
◎ Pode-ser ir inserindo os comandos direto no shell
dentro da execução do teste
◎ É personalizável, Helpers:
◉ Protractor
◉ Pupeeter (opera em cima do Chrome
diretamente, sem o ChromeDriver)
◉ Nightmare (headless, like PhantomJS)
◉ Appium (mobile)
◉ REST (API)
◎ Sintaxe unificada, não importa o Helper
CodeceptJS
CodeceptJS + CucumberJS
CodeceptJS + CucumberJS
◎ Simples de começar
◎ Comandos interessantes
◉ Gerar steps não implementados
◉ Executar tags do cucumber
◉ Cenários que executam apenas em 1 browser
◉ Gerar pageobjects
CodeceptJS + PageObjects
BackstopJS
◎ Testes de Regressão Visual
◎ Compara alterações visuais entre versões do
sistema
◉ Ex: dev environment vs. production
◉ Screenshots para versão de referência
BackstopJS
◎ Comandos
◉ $ backstopjs init
◉ $ backstopjs referente
◉ $ backstopjs test
◎ Engines
◉ Chrome-Headless
○ "engine": "puppeteer" (default)
○ "engine": "chromy"
◉ Slimer (similar ao phantom roda no gecko: engine do firefox)
○ "engine": "slimerjs"
○ "engine": "casper"
BackstopJS
“Referências
◎ Top 5 Most Rated Node.js Frameworks for
End-to-End Web Testing
◎ Meus Exemplos
◉ Exemplo JetBlue com Protractor
◉ Exemplo JetBlue com o CucumberJS +
Protractor
Obrigada!
Perguntas & Sugestões
Você pode me encontrar
twitter @barbarapcabral & email barbaracabral@gmail.com

[Testes] frameworks de testes end to-end baseados em node js

  • 1.
  • 2.
  • 3.
    ◎ NodeJS ◎ Frameworksem NodeJS ◉ CucumberJS ◉ Protractor ◉ CodeceptJS ◉ BackstopJS Agenda
  • 4.
    NodeJS ◎ Node.js éum interpretador de código JavaScript com base no V8 JavaScript Engine do Google ◎ Criado por Ryan Dahl em 2009 ◎ Arquitetura baseada em eventos, desenvolvida para trabalhar com tarefas assíncronas de forma não obstrutiva ◎ Permite o uso de Javascript no back e no front ◎
  • 5.
    NPM ◎ NPM éum gerenciador de pacotes para código JavaScript ◎ Considerado o maior registro de software do mundo ◎ Instalação de pacotes: ◎ Cria um arquivo package.json
  • 6.
  • 7.
  • 8.
    ◎ Especificação ◉ CucumberJS ◎Protractor ◎ CodeceptJS ◎ BackstopJS Frameworks
  • 9.
    CucumberJS ◎ Versão emJavascript do Cucumber ◉ Framework de Especificação para BDD ◎ Sintaxe da linguagem é gherkin ◎ Executa com o NodeJS ◎ Baseado em: ◉ Feature files ◉ Step Files ◎ Especificar os cenários ANTES de desenvolver ◎ Automatizá-los DEPOIS de desenvolvidos
  • 10.
  • 11.
  • 12.
  • 13.
    Protractor ◎ Executa como Node.js usando o WebDriver (selenium) para controlar o browser e simular as ações dos usuários ◎ Identifica elementos do AngularJS ◎ Usa a biblioteca do Jasmine para sua sintaxe de testes. ◎ Sintaxe é similar à sintaxe dos testes unitários, contendo um arquivo de teste com um ou mais blocos de “it” que descrevem os requisitos da aplicação.
  • 14.
  • 15.
  • 16.
  • 17.
  • 18.
    CodeceptJS ◎ É baseadoem cenários ◎ Pode-ser ir inserindo os comandos direto no shell dentro da execução do teste ◎ É personalizável, Helpers: ◉ Protractor ◉ Pupeeter (opera em cima do Chrome diretamente, sem o ChromeDriver) ◉ Nightmare (headless, like PhantomJS) ◉ Appium (mobile) ◉ REST (API) ◎ Sintaxe unificada, não importa o Helper
  • 19.
  • 20.
  • 21.
    CodeceptJS + CucumberJS ◎Simples de começar ◎ Comandos interessantes ◉ Gerar steps não implementados ◉ Executar tags do cucumber ◉ Cenários que executam apenas em 1 browser ◉ Gerar pageobjects
  • 22.
  • 23.
    BackstopJS ◎ Testes deRegressão Visual ◎ Compara alterações visuais entre versões do sistema ◉ Ex: dev environment vs. production ◉ Screenshots para versão de referência
  • 24.
    BackstopJS ◎ Comandos ◉ $backstopjs init ◉ $ backstopjs referente ◉ $ backstopjs test ◎ Engines ◉ Chrome-Headless ○ "engine": "puppeteer" (default) ○ "engine": "chromy" ◉ Slimer (similar ao phantom roda no gecko: engine do firefox) ○ "engine": "slimerjs" ○ "engine": "casper"
  • 25.
  • 26.
    “Referências ◎ Top 5Most Rated Node.js Frameworks for End-to-End Web Testing ◎ Meus Exemplos ◉ Exemplo JetBlue com Protractor ◉ Exemplo JetBlue com o CucumberJS + Protractor
  • 27.
    Obrigada! Perguntas & Sugestões Vocêpode me encontrar twitter @barbarapcabral & email barbaracabral@gmail.com