【Rails ,RSpec】 Selenium::WebDriver::Error::WebDriverError: が発生した件

起こったこと

capybaraとselenium-webdriverのgemをインストールし、RSpecによるテストを行なった。その結果、ローカルでは以下のようなエラーが出た。

Webdrivers::BrowserNotFound:
            Failed to find Chrome binary.

またCircleCIでは以下のようにエラーが出た。

Selenium::WebDriver::Error::WebDriverError:
            Unable to find chromedriver. Please download the server from
            https://chromedriver.storage.googleapis.com/index.html and place it somewhere on your PATH.
            More info at https://github.com/SeleniumHQ/selenium/wiki/ChromeDriver.

上記のエラーが表示された。

対処法

最初に言っておくと、単にテストを行いたいという場合は最も手っ取り早い対処法は、systemテストをfeatureテストに変更することだろう。しかしsystem specの方が推奨されているので、system specで書く方針は変更したくない。

まあ、今回の場合は、selenium webdriver周辺の設定を全く行なっていなかったことが原因なので、設定を実施していきたいと思う。
また、selenium webdriverとはsystem specの画面遷移テストなどの際に必要な、ブラウザの操作を自動で実施するためのライブラリである。

設定内容

spec/rails_helper.rbの記述を有効化するために、.rspecに以下を追記。

.rspec

--require rails_helper

spec/rails_helper.rbに以下を記述。

spec/rails_helper.rb

Dir[Rails.root.join('spec', 'support', '**', '*.rb')].sort.each { |f| require f }

RSpec.configure do |config|
  config.before(:each, type: :system) do
    driven_by :rack_test
  end

  config.before(:each, type: :system, js: true) do
    driven_by :selenium_chrome_headless
  end
end

また、support配下にcapybara.rbを作成し以下の内容を記述する。

spec/support/capybara.rb

require 'capybara/rspec'
require 'selenium-webdriver'

Capybara.register_driver :selenium_chrome_headless do |app|
  options = ::Selenium::WebDriver::Chrome::Options.new

  options.add_argument('--headless')
  options.add_argument('--no-sandbox')
  options.add_argument('--disable-dev-shm-usage')
  options.add_argument('--window-size=1400,1400')
end

Capybara.javascript_driver = :selenium_chrome_headless

docker-compose.ymlにいかを追記して、selenium chromeイメージについて記述する。

docker-compose.yml

version: '3'
services:
  app:
    build:
      context: .
    command: bundle exec puma -C config/puma.rb
    volumes:
      - .:/riskbuster
      - public-data:/app_name/public
      - tmp-data:/app_name/tmp
      - log-data:/app_name/log
    depends_on:
       - db
       - selenium_chrome #この記述を追加
#以下のイメージを追加
  selenium_chrome:
    image: selenium/standalone-chrome:latest
    ports:
      - 4444:4444

これでテストを実行できる状態になった。ローカルでテストを実施する場合、一度コンテナをビルドし直してからテストを実行する。