System tests with Capybara in Ruby on Rails - Practice Problems & Coding Challenges

Challenge - 5 Problems

❓ component_behavior

intermediate

What does this Capybara test check for?

Given the following system test code, what is the expected behavior when it runs?

Ruby on Rails

require "application_system_test_case"

class PostsTest < ApplicationSystemTestCase
  test "visiting the index" do
    visit posts_url
    assert_selector "h1", text: "Posts"
  end
end

A It visits the posts index page and checks that an <h1> element with text 'Posts' is present.

B It visits the posts index page and checks that the page title is 'Posts'.

C It visits the posts show page and checks for a heading with 'Posts'.

D It visits the posts index page and checks that a link with text 'Posts' exists.

💡 Hint

Look at the visit URL and the assert_selector method.

The test visits the URL for posts index (posts_url) and asserts that an h1 element containing the text 'Posts' is present on the page.

📝 Syntax

intermediate

Identify the syntax error in this Capybara test snippet

Which option correctly fixes the syntax error in this test code?

Ruby on Rails

test "creating a post" do
  visit new_post_url
  fill_in "Title", with: "My Post"
  click_button "Create Post"
  assert_text "Post was successfully created"
end

A Wrap the test block inside a 'class PostsTest < ApplicationSystemTestCase' and add 'end' at the end.

B Add 'def test_creating_a_post' before the test block and 'end' after it.

C Add 'test' keyword before the block and ensure the block is inside a test class.

D No syntax error; the code is correct as is.

💡 Hint

System tests must be inside a test class inheriting from ApplicationSystemTestCase.

In Rails system tests, test methods must be inside a test class that inherits from ApplicationSystemTestCase. The snippet is missing the class wrapper.

❓ state_output

advanced

What is the value of 'post_count' after this test runs?

Consider this system test code snippet. What will be the value of 'post_count' after the test completes?

Ruby on Rails

test "creating a post increases count" do
  post_count = Post.count
  visit new_post_url
  fill_in "Title", with: "New Post"
  click_button "Create Post"
  assert_text "Post was successfully created"
  post_count = Post.count
end

A post_count will be nil because it is not returned from the test.

B post_count will be the original count because system tests run in a transaction rollback.

C post_count will be zero because the database is reset before each test.

D post_count will be original count + 1 because a new post was created.

💡 Hint

Think about when the count is checked and if the post creation was successful.

The test checks the post count before and after creating a post. After clicking 'Create Post', the post is saved, so the count increases by 1.

🔧 Debug

advanced

Why does this Capybara test fail with a 'Capybara::ElementNotFound' error?

Given this test code, why does it raise 'Capybara::ElementNotFound'?

Ruby on Rails

test "deleting a post" do
  visit posts_url
  click_on "Delete", match: :first
  assert_text "Post was successfully destroyed"
end

A The test does not wait for the page to load before clicking 'Delete'.

B The 'click_on' method requires an exact match and 'match: :first' is invalid.

C There is no 'Delete' link or button on the posts index page.

D The 'assert_text' is called before the deletion completes.

💡 Hint

Check if the page actually has a 'Delete' link or button visible.

The error means Capybara cannot find any element with text 'Delete'. This usually happens if the link or button is missing or named differently.

🧠 Conceptual

expert

Which statement about Capybara's 'visit' method in system tests is true?

Select the correct statement about how Capybara's 'visit' method works in Rails system tests.

A 'visit' only works with local file paths, not URLs.

B 'visit' opens the URL in a real browser controlled by Capybara's driver during the test run.

C 'visit' simulates a server-side redirect without opening a browser window.

D 'visit' immediately executes JavaScript on the page before loading.

💡 Hint

Think about how Capybara interacts with the browser during system tests.

Capybara's 'visit' method opens the given URL in a browser controlled by the test driver (like Selenium). This simulates a real user visiting the page.

Practice

1. What is the main purpose of system tests with Capybara in a Rails application?

easy

A. To test individual Ruby methods for correctness

B. To measure server response time under load

C. To check database schema migrations

D. To simulate user actions in a real browser and check app behavior

Solution

1. Step 1: Understand system tests role

   System tests simulate how a real user interacts with the app through a browser.

2. Step 2: Compare with other test types

   Unlike unit tests or performance tests, system tests focus on full app behavior with UI.

3. Final Answer:

   To simulate user actions in a real browser and check app behavior -> Option D

4. Quick Check:

   System tests = simulate user in browser [OK]

Hint: System tests mimic real user clicks and typing [OK]

Common Mistakes:

• Confusing system tests with unit tests
• Thinking system tests check only backend code
• Assuming system tests measure performance

2. Which of the following is the correct way to visit the homepage in a Capybara system test?

easy

A. navigate_to root_url

B. go_to '/'

C. visit root_path

D. open_page '/'

Solution

1. Step 1: Recall Capybara visit syntax

   Capybara uses the method visit with a path or URL to open a page.

2. Step 2: Match correct method and argument

   root_path is the Rails helper for homepage path, so visit root_path is correct.

3. Final Answer:

   visit root_path -> Option C

4. Quick Check:

   Capybara visit + path helper = visit root_path [OK]

Hint: Use 'visit' with Rails path helpers to open pages [OK]

Common Mistakes:

• Using non-existent methods like go_to or open_page
• Confusing root_path with root_url in system tests
• Forgetting to use visit before path

3. Given this system test code snippet, what will be the output on the page?

visit root_path
fill_in 'Email', with: '[e-mail]'
fill_in 'Password', with: 'secret'
click_button 'Log in'
expect(page).to have_content('Welcome, [e-mail]')

medium

A. Test passes if 'Welcome, [e-mail]' appears after login

B. Test fails because 'fill_in' cannot find fields

C. Test raises error due to missing 'visit' method

D. Test passes without checking page content

Solution

1. Step 1: Analyze test steps

   The test visits the homepage, fills in login form fields, clicks login, then checks for welcome message.

2. Step 2: Understand Capybara behavior

   If the login works and page shows the welcome text, have_content will pass and test passes.

3. Final Answer:

   Test passes if 'Welcome, [e-mail]' appears after login -> Option A

4. Quick Check:

   fill_in + click_button + have_content = success check [OK]

Hint: Check page content after actions to confirm success [OK]

Common Mistakes:

• Assuming fill_in fails without checking form existence
• Forgetting to call visit before actions
• Ignoring the expect(page).to have_content assertion

4. You wrote this system test but it fails with "Capybara::ElementNotFound" error:

visit root_path
fill_in 'Username', with: 'testuser'
click_button 'Submit'

What is the most likely cause?

medium

A. Capybara does not support fill_in method

B. The form does not have a field labeled 'Username'

C. The button 'Submit' is missing from the page

D. You forgot to call visit before fill_in

Solution

1. Step 1: Understand Capybara::ElementNotFound meaning

   This error means Capybara could not find the form field or button with given label.

2. Step 2: Check test code and error cause

   Since visit is called, the likely cause is the field labeled 'Username' does not exist on the page.

3. Final Answer:

   The form does not have a field labeled 'Username' -> Option B

4. Quick Check:

   ElementNotFound = missing field or button [OK]

Hint: Check labels exactly match form fields and buttons [OK]

Common Mistakes:

• Assuming visit was not called when it was
• Thinking Capybara lacks fill_in support
• Ignoring exact label spelling and case

5. You want to write a system test that logs in a user, visits their profile page, and verifies their username is shown. Which sequence correctly uses Capybara commands?

hard

A. visit login_path; fill_in 'Email', with: user.email; fill_in 'Password', with: user.password; click_button 'Log in'; visit profile_path(user); expect(page).to have_content(user.username)

B. fill_in 'Email', with: user.email; click_button 'Log in'; visit profile_path(user); expect(page).to have_content(user.username)

C. visit profile_path(user); fill_in 'Email', with: user.email; click_button 'Log in'; expect(page).to have_content(user.username)

D. visit login_path; click_button 'Log in'; fill_in 'Email', with: user.email; fill_in 'Password', with: user.password; expect(page).to have_content(user.username)

Solution

1. Step 1: Identify correct login flow

   You must visit the login page first, then fill in email and password, then click login.

2. Step 2: Visit profile after login and check content

   After successful login, visit the profile page and check the username is displayed.

3. Final Answer:

   visit login_path; fill_in 'Email', with: user.email; fill_in 'Password', with: user.password; click_button 'Log in'; visit profile_path(user); expect(page).to have_content(user.username) -> Option A

4. Quick Check:

   Login then visit profile then check content [OK]

Hint: Always visit pages before interacting or checking content [OK]

Common Mistakes:

• Trying to fill_in before visiting login page
• Visiting profile before logging in
• Clicking buttons before filling required fields