Create Test Runner

• Create a sub-folder spec within the project root folder

• Create a file called spec_helper.rb and paste in the following:

# frozen_string_literal: true

require 'bundler'

require 'capybara/dsl'

require 'capybara/rspec'

Bundler.setup(:default)

Bundler.require

# Which default browser do you want Selenium WebDriver to use?

# :selenium_headless # Selenium driving Firefox in a headless configuration

# :selenium_chrome # Selenium driving Chrome

# :selenium_chrome_headless # Selenium driving Chrome in a headless configuration

# https://github.com/teamcapybara/capybara#selenium

Capybara.default_driver = :selenium_headless

Capybara.app_host = 'https://the-internet.herokuapp.com'

Capybara.default_max_wait_time = 10

# Run using:

# bundle exec rspec spec/features/login.rb --format documentation

# ... Or...

RSpec.configure do |config|

  config.formatter = :documentation

end

Queries

See the Matchers documentation for more information on how to make assertions on expectations like the ones below:

expect(page).to have_selector('table tr')

expect(page).to have_selector(:xpath, './/table/tr')

expect(page).to have_xpath('.//table/tr')

expect(page).to have_css('table tr.foo')

expect(page).to have_content('foo')

Finders

See the Finders documentation for detailed information on how to search for elements on the page, e.g.:

find_field('First Name').value

find_field(id: 'my_field').value

find_link('Hello', :visible => :all).visible?

find_link(class: ['some_class', 'some_other_class'], :visible => :all).visible?

find_button('Send').click

find_button(value: '1234').click

find(:xpath, ".//table/tr").click

find("#overlay").find("h1").click

all('a').each { |a| a[:href] }

Composite find selectors can be used for elements that require more than one parameter to be used in order to be identifiable:

find_field('First Name'){ |el| el['data-xyz'] == '123' }

find("#img_loading"){ |img| img['complete'] == true }

Custom selectors, or the modification of an existing selector are also useful when the existing set of selector parameters are not appropriate. 

In addition find can be used to restrict expectations to a specific section and/or parent element:

find('#navigation').click_link('Home')

expect(find('#navigation')).to have_button('Sign out')

Window Selection

Windows can be selected based on a given action; e.g. a click opens up a new window:

facebook_window = window_opened_by do

  click_button 'Like'

end

within_window facebook_window do

  find('#login_email').set('a@example.com')

  find('#login_password').set('qwerty')

  click_button 'Submit'

end

Alerts

Capybara has a simple function to identify and accept, dismiss, cancel, etc. alerts

• Alerts:

accept_alert do

  click_link('Show Alert')

end

• Confirmation:

dismiss_confirm do

  click_link('Show Confirm')

end

• Prompt:

accept_prompt(with: 'Linus Torvalds') do

  click_link('Show Prompt About Linux')

end

• Evaluate responses from prompts:

message = accept_prompt(with: 'Linus Torvalds') do

  click_link('Show Prompt About Linux')

end

expect(message).to eq('Who is the chief architect of Linux?')

Asynchronous JavaScript

Capybara automatically deals with this by waiting for elements to appear on the page; it will retry looking for that content for a brief time. You can adjust how long this period is (the default is 2 seconds):

Capybara.default_max_wait_time = 5

This behaviour does not impact negated assertions:

# consider a page where the `a` tag is removed through AJAX after 1s

visit(some_path)

!page.has_xpath?('a')  # is false, as this is evaluated immediately when page loads

page.has_no_xpath?('a')  # is true, as the wait = 2s before the current evaluation is taken as the outcome

The above is not default behaviour for Capybara RSpec matchers, which will wait on both types of assertion:

expect(page).not_to have_xpath('a')

expect(page).to have_no_xpath('a')

Capybara RSpec matchers will also evaluate everything loaded within a page, and if an element is somehow removed, it will reload the page and re-evaluate. To turn this off, set Capybara.automatic_reload to false.

Debugging

The Capybara DSL also has some useful inbuilt functions that can help with debugging test scripts:

To save and open up a page during runtime insert the following line into a test block:

save_and_open_page

To store the current state of any given page DOM:

print page.html

To save the rendered page as an image file:

page.save_screenshot('screenshot.png')

To save and open any given rendered page as an image:

save_and_open_screenshot