web_bonsaiの日記

web開発の学習日記です。誰に見せるためでもないただの日記です。

簡単なsystem specを書いて実行してみる | Mac + Docker + Rails その0027

参考にさせていただいたページ

今日の環境

ローカル

  • M1 Mac
  • macOS Monterey
  • docker 20.10.14
  • docker-compose 2.5.0

リモート

  • さくらのVPS
  • CentOS 9
  • docker 20.10.16
  • docker-compose 1.29.2

Gemfileについて

以下のように初めから記述されていました。

group :test do
  # Use system testing [https://guides.rubyonrails.org/testing.html#system-testing]
  gem "capybara"
  gem "selenium-webdriver"
  gem "webdrivers"
end

rails/app/views/homes/index.html.erbの編集

以下の通り編集しました。

<div>
  <h1 data-testid="PageHeading">トップページ</h1>
</div>

rails/spec/system/homes/index_spec.rbの作成とその記述内容

以下の通り記述しました。

RSpec.describe 'トップページ', type: :feature do
  it '見出し文字列が正しい' do
    visit root_path

    expect(page.find('[data-testid="PageHeading"]')).to have_text 'トップページ'
  end
end

rails/spec/system/support/capybara_setup.rbの作成とその記述内容

以下の通り記述しました。

Capybara.app_host = "http://localhost"

# 特にSeleniumを使う場合、開発者はこのmax wait timeを増やす傾向がよく見られる
# Cupriteの場合そうした設定は不要
# ここではCapybaraのデフォルト値を明示的に指定している
Capybara.default_max_wait_time = 2

# `has_text?`や同種のマッチャーでホワイトスペースを正規化する
# (つまり改行や末尾スペースなどは無視される)
# こうすることで、UIにささいな変更が入っても影響されにくくなる
Capybara.default_normalize_ws = true

# システムテストで生成されるファイル(スクショやダウンロードファイルなど)の置き場所
# このパスを外部から設定可能にしておくとCIなどで便利かもしれない
Capybara.save_path = ENV.fetch("CAPYBARA_ARTIFACTS", "./tmp/capybara")

rails/spec/system_helper.rbの作成とその記述内容

以下の通り記述しました。

# RSpec Railsの一般的な設定を読み込む
require "rails_helper"

# 設定ファイルとヘルパーを読み込む
Dir[File.join(__dir__, "system/support/**/*.rb")].each { |file| require file }

system specを実行してみる

以下のコマンドでローカルでsystem_specが実行できるようになりました。

% docker-compose run --rm app rspec

rubyのファイルを追加したのでrubocopも実行しておく

% docker-compose run --rm app rubocop -a