Automating browser testing

Mal Curtis

@snikchnz

Browser Testing?

Testing for differences in behaviour, and user interface, between browser brands and versions.

We accidentally created a monster

Client Side Web Apps

Back end moving to 'just an api'
Front end frameworks make it easier
It's just so fast!
But it's in the browser
Not 'the' browser, but 'a' browser

Testing is mainstream

Unit / Integration / Acceptance

Proven Track record
Unit tests are great for 'business' logic
Acceptance tests great for 'request / response'
Not many people cross browser testing

SO?

"I thought we'd fixed all these browser inconsistencies years ago?"

No: We fixed the old ones, and created new ones

postMessage cross window communication
Cross Origin Resource Sharing
3rd Party Cookies
Async script loading
Web Fonts |Sockets |Workers |Notifications
Browser DB Formats

Cross browser testing

is more important

now

than ever

It's just not as obvious as a broken layout.

Traditionally:

Start Browser
Visit Page
Follow process / interaction
Fail / Success
Fix bug and repeat (if failed)
Open next browser, start again

That's Shit.

And no fun.

Cross Browser testing Can be automated

Selenium: Browser Automation
Not new, but under-utilised
Possibly because of ugly logo

"Provides an interface with which to remote control a browser"

'WebDrivers' for every browser
Client libraries for most languages
Written in Java

Demo 1

Google search

The 'hello world' of selenium

Abstraction Libraries

A lot of languages have them

Ruby: Capybara
Python: Splinter
Node: Soda
PHP: Sausage (kinda)
.net: Could not find?

Simplifies the API

            driver.get "http://google.com"
            element = driver.find_element name: "q"
element.send_keys "how do i"
            element = driver.find_element text: "Click me"
element.click

becomes

    visit "http://google.com"
    fill_in "q", with: "how do i" 
    click_link "Click me"

Demo 2

Interactions

ASSERTIONS

Good testing libraries have integration
Easy enough to do your own though

                visit '/sessions/new'
    within("#session") do
      fill_in 'Login', :with => 'user@example.com'
      fill_in 'Password', :with => 'password'
    end
    click_link 'Sign in'
    page.should have_content 'Success'