LoginSignup
0
0

More than 3 years have passed since last update.

rails5中級チュートリアルのテストがうまく通らなかった時

Last updated at Posted at 2020-08-07

前提・実現したいこと

rails5中級チュートリアルを行なっています。
チュートリアルの3-3でのテストの部分で
昨日から以下のエラーが発生し、テストをパスすることができず、困っていた。

発生している問題・エラーメッセージ

ターミナルでのrspec spec/features/user/login_spec.rb実行時

  1) Login ユーザーがloginページにリダイレクトされ、ログインに成功する
     Failure/Error: expect(page).to have_selector('#user-settings')
       expected to find css "#user-settings" but there were no matches
     # ./spec/features/user/login_spec.rb:13:in `block (2 levels) in <top (required)>'

Finished in 4.17 seconds (files took 2.75 seconds to load)
1 example, 1 failure

Failed examples:

rspec ./spec/features/user/login_spec.rb:6 # Login ユーザーがloginページにリダイレクトされ、ログインに成功する

該当のソースコード

login_spec.rb

require "rails_helper"

RSpec.feature "Login", :type => :feature do
  let(:user) { create(:user) }

  scenario 'ユーザーがloginページにリダイレクトされ、ログインに成功する', js: true do
    user
    visit root_path
    find('nav a', text: 'ログイン').click
    fill_in 'user[email]', with: user.email
    fill_in 'user[password]', with: user.password
    find('.login-button').click
    expect(page).to have_selector('#user-settings')
  end

end

試したこと

①エラー文で検索をかけるも、手がかりを見つけることができなかった。

②エラー文にcssの"#user-setting"とhave_selectorの"#user-setting"が一致しないとあるため、cssの"#user-setting"に問題があると仮説するが、そもそもcssに"#user-setting"というものがなくどうすれば良いのかすらわからない状態であった。

③vscodeの文字列検索で[user-setting]と検索した際に、[_signed_in_links.html.erb]ファイル内でuser-settingをidとして定義してある箇所があったためそちらの記述を"#user-setting"に変更してみたが、解決することができなかった。

_signed_in_links_html.erb
<li class="dropdown pc-menu">
# この下の行の"user-settingを変更を試した"
  <a id="user-setting"  class="dropdown-toggle" data-toggle="dropdown" href="#">
   <span id="user-name"><%= current_user.name %></span>
   <span class="caret"></span>
  </a>

  <ul class="dropdown-menu" role="menu">
   <li><%= link_to 'プロフィールを編集', edit_user_registration_path %></li>
   <li><%= link_to 'ログアウト', destroy_user_session_path, method: :delete%></li>
  </ul>
</li>

<li class="mobile-menu">
  <%= link_to 'プロフィールを編集', edit_user_registration_path %>
</li>
<li class="mobile-menu">
  <%= link_to 'ログアウト', destroy_user_session_path, method: :delete %>
</li>

解決方法

一日以上時間を費やしては埒が明かないと考え,teratailで質問を投げかけたところ解決。
上記にある試したこと③にもある_signed_in_links_html.erbでのid指定を#user-settingsではなく
user-settingsに修正したところテストを通過することができた。

学び

cssセレクタでは、#はid属性、.の場合はclss属性ということを完全に忘れてしまっていた。

補足情報(FW/ツールのバージョンなど)

vscode最新バージョン使用
railsバージョン 5.1.7
bootstrap

テストツール
factory_bot_rails
capybara 2.15
rspec-rails
selenium-webdriver
rails-controller-testing
headless
poktergeist

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0