結合テストは本当に難しいです・・・
ただ、一個一個分解すると理解できてきました！
復習の備忘録です！
結合テストコード
ユーザーがたどる一連の流れを確認する
System Spec
結合テストコードを記述するための仕組み
Capybara
System Specを記述するために必要なGem。 標準で導入済み
rails g rspec:system users
exampleを整理
- ユーザーが新規登録できる時
- 正しい情報を入力すればユーザー新規登録ができてトップページに移動する
- トップページに移動する
- トップページにサインアップページへ遷移するボタンがある
- 新規登録ページに移動する
- サインアップボタンを押すとユーザーモデルのカウントが１上がる
- トップページへ遷移することを確認する
- カーソルを合わせるとログアウトボタンが表示される
- サインアップページへ遷移するボタンや、ログインページへ遷移するボタンが表示されていない
- ユーザー新規登録できない時
- 誤った情報ではユーザー新規登録できずに新規登録ページへ戻ってくる
- トップページに移動する
- トップページにサインアップページへ遷移するボタンがある
- 新規登録ページへ移動する
- ユーザー情報をを入力する
- サインアップボタンを押してもユーザーモデルのカウントは上がらない
- 新規登録ページへ戻される
visit
visit 〇〇_pathのように記述すると、〇〇のページへ遷移することを表現できる
get はあくまでリクエストを送るだけのことを意味し、visitはそのページへ実際に遷移することを意味する
page
visitで訪れた先のページの見える分だけの情報が格納されています。
「ログアウト」などのカーソルを合わせて初めて見ることができる文字列はpageの中に含みません
have_content
expect(page).to have_content('X')と記述すると、visitで訪れたpageの中に、Xという文字列があるかどうかを判断するマッチャ。
fill_in
fill_in 'フォームの名前', with:'入力する文字列'のように記述することで、フォームへの入力を行うことができます。
検証ツール
ブラウザに標準で備わっている、HTMLの要素や、適用されているCSSのコードを確認することができる機能
label要素のforに指定されているIDと、inputのidの値が同一になっています
find().click
find('クリックしたい要素').clickと記述することで、実際にクリックができます。検証ツールを開いて、クリックしたい要素を確認
<input type="submit" name="commit" value="Sign up" data-disable-with="Sign up">
この時に、input要素のname属性を指定します。その場合
find('input[name="commit"]').clickという記述になります
change
expect{何かしらの動作}.to change {モデル名.cont}.by(1)と記述することによって、モデルのレコードの数が幾つ変動するのかを確認
changeマッチャでモデルのカウントをする場合のみ、expect()ではなくexpect{}となります
「何かしらの動作」の部分には、「送信ボタンをクリックしたとき」が入ります
find('input[name="commit"]').clickが入ります
current_path
現在るページのパスを示す。expect(page).to have_current_path(root_path)と記述すれば、今いるページがroot_pathであることを確認できます
hover
find('ブラウザ上の要素').hoverとすることで、特定の要素にカーソルを合わせた時の動作を再現できる
ログアウトボタンはヘッダーの中のspan要素をhoverすることで現れます。しかし、span要素は他でも使われているため、その親要素のuser_navクラスも合わせて指定します
have_no_content
文字列が存在しないことを確かめるマッチャ