Ruby Capybara with selenium Cheat Sheat

“Capybara” is a library to helps you test web applications.
This article is a cheat sheet for Ruby “Capybara


Get Started

Install Rubygem capybara and selenium-webdriver:

1
2
$ gem install capybara
$ gem install selenium-webdriver

Write sample code to capybara_sample_spec.rb:

1
2
3
4
5
6
7
8
9
10
11
require 'capybara/rspec'
Capybara.default_driver = :selenium
feature 'Capybara Sample' do
scenario 'success something' do
visit 'http://example.com/'
fill_in('name', with: 'Sample User')
click_button('goto_next')
end
end

You can execute capybara_sample_spec.rb by RSpec:

1
$ rspec capybara_sample_spec.rb

Click Examples

1
2
3
4
5
6
7
8
# Click button by id, text, title or alt of img tag
click_button('button text')
# Click link by id, text, title or alt of img tag
click_link('link text')
# Click button or link
click_on('button or link text')

Interecting with Form Examples

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
# Set text to text tag by id, name or label text
fill_in('some text', with: 'text_tag_selector')
# Select pulldown by id, name or label text
select('some option', with: 'select_tag_selctor')
# Select checkbox by id, name or label text
check('checkbox_selector')
# Deselect checkbox by id, name or label text
uncheck('checkbox_selector')
# Choose radio button by id, name or label text
choose('yes')
# Attach file
attach_file('attach_file_selector', '/path/to/dog.jpg')

Element Examples

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
# Find element by css
find(:css, 'css selector', options)
# Find element by xpath
find(:xpath, 'xpath value', option)
# Set some text to some input form
find(:xpath, 'some xpath').set('some text')
# Show text in the element
find('id_selector', visible: false).text
# Show value in the element
find_field('id_selector').value
# Check checkbox
find('checkbox_selector').checked?
# Check Selectbox
find('select_tag_selctor').selected?
# Check Visibility
find('a', text: 'next').visible?

Querying Examples

1
2
3
4
5
6
7
8
9
10
11
12
13
14
# Check existance of the element by css
expect(page).to have_css('#something')
# Check existance of the element by xpath
expect(page).to has_xpath('#something')
# Check existance of the element by content
expect(page).to has_content('#something')
# Check no existance of the element by content
expect(page).to has_no_content('#something')
# Check no existance of title
expect(page).to has_title('#something')

Scope Examples

1
2
3
4
5
6
7
8
9
# Scope with xpath
within("//li[@id='example']") do
fill_in 'Full Name', with: 'John Due'
end
# Scope with CSS
within(:css, "li#example") do
fill_in 'Full Name', :with => 'John Due'
end

Other Examples

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
# Waiting & try to check the element for 30 seconds
Capybara.using_wait_time(30) do
expect(find('#message')).to have_text('Complete')
end
# Click alert
accept_alert do
click_on 'Show Alert'
end
# Dismiss confirm
dismiss_confirm do
click_on 'Delete'
end
# Execute JavaScript
execute_script 'window.scrollTo(0, 900)'
# Capture screen
save_screenshot('xxx.png')
# Debugging
save_and_open_page

Using Capybara without RSpec

Sample code using Capybara without RSpec or other framework is as follows:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
require 'capybara'
Capybara.default_driver = :selenium
class CapybaraSampleClass
include Capybara::DSL
def sample_method
visit 'http://example.selenium.com/'
fill_in('name', with: 'sample user')
end
end
sample = CapybaraSampleClass.new
sample.sample_method
1
$ ruby cabybara_sample.rb

Appendix: Page Object

A page object is an object-oriented class that serves as an interface to a page of your TEST.

The Page Object Design Pattern provides the following advantages:

  • There is a clean separation between test code and page specific code such as locators.
  • There is a single repository for the services or operations offered by the page.

Policy of the Page Object Design Patttern is as follows:

  • Create a method to abstract controlling UI
  • Return new Page Object if there is page transition
  • Not include assertion logic in Page Object
  • Should check successful of page transition

Special Thanks