My Capybara note

Overview

Capybara is good for Rails E2E (Feature) testing. It simulates user actions on a browser, like find a button and click it, wait for the next page. You can choose Selenium Driver or others as web driver.

SetUp

setup a Capybara

n350071🇯🇵 ・ Sep 19 '19 ・ 1 min read

#rails

stop/pause headless Selenium testing with Capybara

n350071🇯🇵 ・ Sep 10 '19 ・ 1 min read

#capybara #rspec #rails

Usage

🔨 prepare

making complex test data in Capybara

n350071🇯🇵 ・ Sep 19 '19 ・ 1 min read

#rails

👁 look around your site

inside of HTML

Find in Capybara

n350071🇯🇵 ・ Sep 24 '19 ・ 2 min read

#rails

click link in Capybara

n350071🇯🇵 ・ Sep 18 '19 ・ 1 min read

#rails

Narrow down scope with `within` in Capybara Rails testing

n350071🇯🇵 ・ Sep 18 '19 ・ 1 min read

#rails

browser manipulation

Capybara::Session Page Navigations

n350071🇯🇵 ・ Oct 24 '19 ・ 1 min read

#rails

✅ assert

capybara find.text method ignore newline (convert to a space)

n350071🇯🇵 ・ Sep 10 '19 ・ 1 min read

#capybara #rspec #rails

Test css(icon) in Capybara

n350071🇯🇵 ・ Sep 10 '19 ・ 1 min read

#capybara #rspec #rails

have_selector is good for waiting test in Capybara

n350071🇯🇵 ・ Sep 18 '19 ・ 1 min read

#capybara #rspec #rails

[Capybara] like shared_examples

n350071🇯🇵 ・ Oct 8 '19 ・ 2 min read

#rails

# get current path
current_path

# spec/rails_helpers/feature_helper.rb
module FeatureHelpers
  def current_path_with_params
    uri = URI.parse(current_url)
    "#{uri.path}?#{uri.query}"
  end
end

📝 form

checkbox in Capybara

n350071🇯🇵 ・ Sep 18 '19 ・ 1 min read

#rails

attach a file in Capybara

n350071🇯🇵 ・ Sep 19 '19 ・ 1 min read

#rails

[Capybara] find('input').set will have not done!

n350071🇯🇵 ・ Dec 17 '19 ・ 1 min read

#capybara #rspec #rails

# input type=text
fill_in 'nav-search', with: 'n350071 capybara'

# select box
select 'Most Views', from: 'dashhboard_sort'

# submit
page.execute_script("$('form#your-form').submit()")

🧙‍♂️ Manipulate

Run Javascript by Capybara feature test

n350071🇯🇵 ・ Sep 10 '19 ・ 1 min read

#capybara #rspec #rails

# Change CSS/Style in Capybara
page.execute_script("$('selector').css('display','block')");

🎁 Opinion

• We should use what users will see, instead of the source code of HTML.
• The HTML is an essential factor to test.
  • We should align the HTML tag, CSS for testing. If it's different from a similar page, the testing is tough.
  • We should use the correct name in HTML to support easy testing.
• Using find('label[for="model_attributes"]' is better than XPath, because this way is simulate the users way.