headless bdd & responsive test automation

Headless BDD & Responsive Test Automation

Shashikant JagtapTwitter: @Shashikant86

Blogs: http://shashikantjagtap.net

Topics

● How BDD Tools Work● Headless Drivers, BDD and

Benefits● Behat+Zombie &

Cucumber+Poltergeist● Demo

Cucumber+Capybara+Poltergeist● Demo

Behat+Mink+Zombie+PhantomJS● Responsive Automation

BDD Tools

● Popular BDD Tools Cucumber, Be-hat

● Web Acceptance Testing Frame-works Capybara, Mink

● Drivers Selenium, Watir, Phan-tomJS, Zombie

Benefits of using Headless Drivers

● Drivers with no reals Browsers PhantomJS, Zombie

● Fast ● No XVFB, VNC on Linux● Screenshots and JS Error Detec-

tion● Debugging

Zombie

● NodeJS● Npm● Zombie

$ brew install node

$ npm install npm

PhantomJS

● Headless Browser with full JavaScript Support

$ brew install phantomjs

$ phantomjs your/awesome.js

Setting up Headless Cucumber

● Cucumber + Capybara + Poltergi-est

● GitHub : https://github.com/team-poltergeist/poltergeist

● Demo on GitHub: https://github.com/Shashikant86/Poltergeist-Demo

● Blog:

http://shashikantjagtap.net/cu-cumber-capybara-poltergeist-rockstar-bdd-combo/

What's There?

● Gemfile● require 'capybara/poltergeist'● RegisterCapybara.register_driver :poltergeist do |app|

    options = {

        :js_errors => true,

    }

    Capybara::Poltergeist::Driver.new(app, options)

end

What You Can Do?

● Detect JS Error● Capture Network Traffic● Response Headers● Capture Screenshot● Play With Cookies● Responsive Automation

Responsive Test Automation

● Define ViewPort

window_sizes = {

:'320' => { :width => 320, :height => 480 },

:'1026' => { :width => 1026, :height => 1200 },

}

● Capybara.current_session.driver.resize(width, height)

Setting up Headless Behat

● Behat + Mink + Zombie● Zombie On GitHub

https://github.com/assaf/zombie● Behat + Mink + Zombie Demo on

GitHub

https://github.com/Shashikant86/Behat-Zombie

● Blog

http://shashikantjagtap.net/using-zombie-js-driver-with-behats-minkextension/

What's There?

● Composer.json● Package.json● "behat/mink-zombie-driver": "*@dev

",● Npm ● node_modules

What You Can Do?

● Make Behat Scenarioes SuperFast● Response Headers● Cookies● Screenshot ? Network Traffic ? ● Stuff Coming Soon

Questions?

THANK YOU