phantomjs - o fantasminha camarada

17
PhantomJS O fantasminha camarada Henrique Gogó @henriquegogo

Upload: henrique-gogo

Post on 12-Jan-2015

4.513 views

Category:

Technology


3 download

DESCRIPTION

Conheça essa incrível ferramenta para te ajudar a executar testes de aceitação e testes funcionais em JavaScript.

TRANSCRIPT

Page 1: PhantomJS - O Fantasminha Camarada

PhantomJSO fantasminha camarada

Henrique Gogó@henriquegogo

Page 2: PhantomJS - O Fantasminha Camarada

O que é PhantomJS?

Um "browser" webkit com API JavaScript completa que roda no console.

Suporte nativo a vários padrões web standards: DOM, seletores CSS, JSON, Ajax, Canvas e

SVG.

Page 3: PhantomJS - O Fantasminha Camarada

Para que serve?

Rodar testes funcionais (de JavaScript) com frameworks como Jasmine, QUnit ou CasperJS.

Acessar e manipular páginas com acesso completo ao DOM e bibliotecas de JS como

jQuery.

Page 4: PhantomJS - O Fantasminha Camarada

Por que não WebRat?

WebRat é um simulador de browser com capacidade de DOM, seletores CSS, de fácil

integração com RSpec, Cucumber, Test::Unit e outros.

Mas e o JavaScript?

Page 5: PhantomJS - O Fantasminha Camarada

Por que não Selenium?

Selenium é contém uma API para você realizar testes de aceitação em diversos browsers. Para

isso ele levanta uma instância do browser.

Page 6: PhantomJS - O Fantasminha Camarada

Usando PhantomJS comoengine JavaScript do Capybara

https://github.com/jonleighton/poltergeist

require 'capybara/poltergeist'Capybara.javascript_driver = :poltergeist

Page 7: PhantomJS - O Fantasminha Camarada

Ou simplesmente QUnit

$ phantomjs run-qunit.js test/index.html

Tests completed in 1528 milliseconds. 1223 tests of 1223 passed, 0 failed.

Page 8: PhantomJS - O Fantasminha Camarada

QUnit

test("a basic test example", function() { ok( true, "this test is fine" ); var value = "hello"; equal( value, "hello", "We expect value to be hello" );});

Page 9: PhantomJS - O Fantasminha Camarada

Exemplos//teste.jsvar page = new WebPage();var url = "http://www.gogs.com.br/";page.open(url, function (status) { //Página carregada phantom.exit();});

$ phantomjs teste.js

Page 10: PhantomJS - O Fantasminha Camarada

Manipulação de DOM

var page = new WebPage();console.log('Seu user agent é:' + page.settings.userAgent);page.settings.userAgent = 'SpecialAgent';page.open('http://www.httpuseragent.org', function (status) { if (status !== 'success') { console.log('Unable to access network'); } else { var ua = page.evaluate(function () { return document.getElementById('myagent').innerText; }); console.log(ua); } phantom.exit();});

Page 11: PhantomJS - O Fantasminha Camarada

Listener de requisições

var url = phantom.args[0];

var page = new WebPage();page.onResourceRequested = function (request) { console.log('Request ' + JSON.stringify(request, undefined, 4));};page.onResourceReceived = function (response) { console.log('Receive ' + JSON.stringify(response, undefined, 4));};page.open(url);

Page 12: PhantomJS - O Fantasminha Camarada

page.render()$ phantomjs rasterize.js http://www.google.com.br google.png

Page 13: PhantomJS - O Fantasminha Camarada

Blá Blá Blá!Blá Blá Blá!Blá Blá Blá!Blá Blá Blá!Blá Blá Blá!

Page 14: PhantomJS - O Fantasminha Camarada

Então...

Quer fazer testes de aceitação com fidelidade à engine WebKit (Chrome, Safari, Mobile

browsers)?

Quer testar JavaScript sem precisar abrir browser?

Quer integrar com Ruby usando Capybara, ou outras plataformas como C# (usando Chutzpah)?

Page 15: PhantomJS - O Fantasminha Camarada

PhantomJS

Page 16: PhantomJS - O Fantasminha Camarada
Page 17: PhantomJS - O Fantasminha Camarada

Perguntas?

@henriquegogo

www.gogs.com.br