Rspec with Capybara Setup

Step 6: Setup Rspec & Capybara

6A: Add these gems to your Gemfile in the test and development, test groups:

group :test do
gem 'simplecov', require: false
gem 'simplecov-rcov', require: false
gem 'factory_bot_rails'
// other gems in the test-only gemfile
end
gem :development, :test do
gem 'rspec-rails'
// other gems in the dev+test group
end

then run bundle install

(You’ll notice by default your Gemfile already has: gem 'capybara' which we will be using. The // comment lines above signifies the other content inside of your :test and :development, :test groups already. Be sure to check the gems already in your these groups do not duplicate them. If you have gems with version numbers, you can safely remove the version numbers for the purpose of this demo.)

then run rails generate rspec:install

Notice that this has created:

a hidden file .rspec

a folder spec/

spec/spec_helper.rb

spec/rails_helper.rb

COMMIT YOUR CHANGES HERE BEFORE CONTINUING.

Step 6B: Configure RSpec

Go to spec/rails_helper.rb and add the code shown in red below. (just below the line require 'rspec/rails'). Also be sure to add the configuration for FactoryBot in the Rspec config (also shown in red.) Note here I like to remove the default comments that come with the generated file (I personally find them distracting), and I have done so here.

require 'spec_helper'
ENV['RAILS_ENV'] ||= 'test'
require File.expand_path('../config/environment', __dir__)

abort("The Rails environment is running in production mode!") if Rails.env.production?
require 'rspec/rails'



if( ENV['COVERAGE'] == 'on' )
  require 'simplecov'
  require 'simplecov-rcov'
  class SimpleCov::Formatter::MergedFormatter
    def format(result)
      SimpleCov::Formatter::HTMLFormatter.new.format(result)
      SimpleCov::Formatter::RcovFormatter.new.format(result)
    end
  end
  SimpleCov.formatter = SimpleCov::Formatter::MergedFormatter
  SimpleCov.start 'rails' do
    add_filter "/vendor/"
    add_filter "/test/"
  end
end


begin
  ActiveRecord::Migration.maintain_test_schema!
rescue ActiveRecord::PendingMigrationError => e
  puts e.to_s.strip
  exit 1
end

RSpec.configure do |config|
  config.fixture_path = "#{::Rails.root}/spec/fixtures"
  config.use_transactional_fixtures = true
  config.infer_spec_type_from_file_location!

  config.filter_rails_from_backtrace!
  config.include FactoryBot::Syntax::Methods
end
Capybara.default_driver = :rack_test

Now create a spec/features/ using

mkdir spec/features

COMMIT YOUR CHANGES HERE BEFORE CONTINUING.

Step 6C: Set up a Route and A Blank Welcome Page

Now let’s take a quick detour and set up a basic Rails route and view. Go to config/routes.rb and add

Rails.application.routes.draw do
  root to: "welcome#index"
end

Create an empty controller welcome_controller.rb:

Create a folder views/welcome/ and in this folder create index.html.erb.

In this file put:

Hello world

COMMIT YOUR CHANGES HERE BEFORE CONTINUING.

Step 6D: Setup Capybara

Now go back to spec/features/

In this folder, create a file called math_spec.rb

require 'rails_helper'

describe "take a quiz", type: :feature do
  it "asks me to add to two numbers" do
    visit '/'
    expect(page).to have_content 'What is 5+2'
  end
end

If we run bundle exec rspec, we see that we can’t find the text ‘What is 5+2’ inside of ‘Hello world’

Can't find what is 5+2 inside of hello world

Excellent! A failing spec. Just for shoots & gurgles, let’s change the spec like so.

Add the line shown in red and remove the line with the strikethrough text.

require 'rails_helper'

describe "take a quiz", type: :feature do
  it "asks me to add to two numbers" do
    visit '/'
    expect(page).to have_content 'What is 5+2'
    expect(page).to have_content 'Hello world'
  end
end

Run bundle exec rspec again and we get a passing spec as expected.

Passing spec

COMMIT YOUR CHANGES HERE BEFORE CONTINUING.

Soon we’re going to use this to end-to-end test our React code, but for the time being its good to know that our spec setup is working as expected.