Functional testing with capybara, shown by examples from the metaflop project.

1. capybara

3. overview
automated user interaction
automatically waits for asynchronous tasks
driver agnostic
high level access to ui elements

4. test frameworks
cucumber
rspec
test::unit
minitest::spec

5. drivers

6. rack_test
default
fast, no server
no js
mechanize
rack_test with remote server

7. selenium
2.0 aka webdriver
firefox, chrome, ie, ...

8. webkit
headless
QtWebKitk
logging / messages
screenshots
cookies
resizing the window

9. poltergeist
headless
phantomjs
screenshots
resizing the window
remote debugging (web inspector)
no X (CI integration)

10. dsl

11. navigating
visit('/projects')
visit(post_comments_path(post))

12. clicking links and buttons
click_link('id-of-link')
click_link('Link Text')
click_button('Save')
click_on('Link Text') # links or buttons

13. interacting with forms
fill_in('Username', :with => 'user')
choose('A Radio Button')
check('A Checkbox')
attach_file('Image', '/path/to/image.jpg')
select('Option', :from => 'Select Box')

14. querying (rspec matchers)
page.should have_selector('table tr')
page.should have_selector(
:xpath, '//table/tr')
page.should have_xpath('//table/tr')
page.should have_css('table tr.foo')
page.should have_content('foo')

15. finding
find_field('First Name').value
find_link('Hello').visible?
find_button('Send').click
find("#overlay").find("h1").click
all('a').each { |a| a[:href] }

16. scoping
within("li#employee") do
fill_in 'Name', :with => 'Jimmy'
end

17. scripting
page.execute_script("$('body').empty()")
result = page.evaluate_script('4 + 4');

18. debugging
save_and_open_page # snapshot
print page.html

19. setup

20. Capybara.default_driver = :selenium
# sinatra
Capybara.app = App
# remote app
Capybara.app_host = 'http://www.google.com'

21. per spec
Capybara.javascript_driver = :selenium
# ...
describe 'requires js', :js => true do
it 'will use the default js driver'
it 'will switch to one specific driver',
:driver => :webkit
end

22. set browser
Capybara.register_driver :selenium do |app|
Capybara::Selenium::Driver.new(
app, :browser => :chrome
)
end

23. in the wild

24. metaflop
web based platform for metafonts and
related type projects
modulator
experimental font generation
export as otf, webfont

25. spec sample 1
context 'when i change the unit width' do
it 'should show the loading indicator' do
fill_in 'param-unit-width', :with => 2
page.should have_selector(
'.preview-loading-text')
end
end

26. spec sample 2
context 'when i enable anatomy' do
it 'shows the anatomy image' do
within '#menu' do
click_link 'on'
end
page.should have_selector '#info-panel'
end
end

27. spec sample 3
context 'when i click the "webfont" link' do
it 'should call the font generator url' do
click_link('webfont')
current_url.should
include 'modulator/export/font/web'
end
end

28. problems

29. general
dialogs (downloads)
new openend windows
driver specialties

30. selenium
slow, startup
slow, random errors
no http response
no .trigger() (e.g. mouse over)
installation

31. solution
avoid selenium
use headless
test visual concerns manually

32. links
capybara homepage
webkit
poltergeist
selenium chrome driver
metaflop

33. @alexisreigel
koffeinfrei
koffeinfrei.org