いざ 結合テスト
System Spec
結合テストを記述する仕組み。
- Model Spec: モデルのテスト
- Request Spec: コントローラーのテスト (RSpec基本機能)
- System Spec: 結合テスト (CapybaraというGemを使う: Rails 標準搭載)
Capybara = 結合テスト用のGem
≪chat GPT先生≫
Capybaraは、Webアプリケーションのテストをシンプルで人間らしいスタイルで書くためのRuby用のライブラリです。
この名前は、テストにおいてブラウジングセッションを操作するときに、ユーザーがキャピバラ（南米に生息する巨大な水生哺乳動物）のように、ゆっくりとしたステップでウェブページを操作するような感覚を持ってテストを書けることを示しています。
Capybaraの名前は、テストコードを書くプロセスがゆっくりとした動きであること、そして開発者がウェブページを操作する際に"キャピバラのような"体験を得られることを示しています。この名前は、テストコードを書く際に自然な感覚を持ち、効果的な統合テストを行う手助けをすることを意味しています。
ほんまかいな
まずはファイル作成
% rails g rspec:system users
spec/system/users_spec.rb が生成
example整理（急にむずない？）
基本的には、それぞれの場合を想定した時に、ユーザー操作に対応する挙動・表示を順番に確認する。
ユーザー新規登録ができるときのexample
-> トップページ -> 新規登録画面 -> 情報入力 -> ユーザーモデル +1カウント -> トップページへ ...ユーザー新規登録ができないときのexample
-> トップページ -> 新規登録画面 -> 情報入力 -> ユーザーモデル +1されない -> 再び新規登録画面 ...
visitメソッド
実際にそのページを訪れる。
visit root_path
page have_content
page: 可視部の情報を格納 have_content: 該当の文字列を含むかどうかを判断
expect(page).to have_content('hoge')
fill_in: 埋める
自動でフォームに入力してくれる
fill_in 'フォーム名', with: '文字列' # !括弧じゃなくて、スペース
フォーム名 = label要素
label要素
inputとセットで持ちられることが多い。 for属性 と id属性 によって紐付けを確認。
<div class="example"> <label for="hoge">Example</label> <input type="checkbox" id="hoge"> </div>
- 文字列 Example とチェックボックスを紐づける
- label要素ををクリックしてもフォームがアクティブ化する とかのメリットがある（らしい）。
上記の例では、Exampleがフォームの名
(for = id = "hoge" でinput要素と紐づいたlabel要素を確認。)
fill_in 'Example', with '文字列'
(追記 2023/9/2)
フォーム名として使えるのは
①for,idで紐づいたlabel要素のテキスト(上記)
②name属性
③普通にid属性
(クラス属性は×)
参考
find().click
findしてクリックしてくれる。 基本は要素を指定。たくさんある場合はnameで指定。
find('input[name="commit"]').click
change
ユーザーモデルのカウントが増えることを確認する時に使う。
expect{'動作'}.to change { Model.count }.by(1)
ブロックを渡すときは、{}らしい。（なんのこっちゃ）
バックエンド側の処理とかを書くときは波括弧{}になるっぽい。
sleep 1
1秒待ってくれる。（←重要。つけ忘れたらできんかった。）
expect{
find('input[name="commit"]').click
sleep 1
}.to change { User.count }.by(1)
current_path
今いるページがroot_pathかどうか確認
expect(page).to have_current_path(root_path)
トップページが開いたところでbinding.pryしてみた
[1] pry > current_path => "/"
これでもいいらしい
expect(current_path).to eq(root_path)
hover （ ：空中に停止する。ホバリング）
マウスを合わせた時の挙動確認
expect( find('対象の要素').hover ).to have_content('文字列')
クラス要素を指定するときは'.hoge'
htmlの要素を指定するときは、'span'（ドットなし）だけど、クラス属性は、'.hoge'（ドットあり）。
あ、CSSと一緒か。なるほど。
have_no_content
文字列を含んでいないことを確認。
expect(page).to have_no_content('文字列')
英単語
directory（いまさら）
dis-（ばらばらに）＋rego（導く）
->道順を案内する（direct）内容が記録された紙（-orium）、人を指揮する（direct）内容が記録された紙（-orium）
=> 住所氏名簿、ディレクトリ
- direct: ばらばらを（dis-）真っすぐに導く（rego） -> 指揮する、向ける、真っ直ぐな
- elect: ～の上へ（ex-）真っすぐに導く（rego）こと -> 立てる、直立する (-> ホモ・エレクトス:直立歩行する人)
- correct: con-（完全に、一緒に）＋rego（真っすぐに導く、統治する） -> 訂正する、正す
- address: ～へ（ad-）真っすぐ（directus）に向けること -> 対処する、ヒトに宛てる、宛名
- alert: ex-（～の上へ）＋rego（導く） -> イタリア語 all’（～へ）＋erta（塔） -> 警戒した、警報
fill
いっぱいに（fullaz）すること -> 充満する、いっぱいに満たす。
- fill in: 埋める、書き込む
- full: 満ちた（fullaz） -> 満ちた、いっぱいの
- fulfill: いっぱい（full）に満たす（fill）こと -> 満たす、果たす、遂行する
element
elementum（世界を構成するとされた四元素のうちの一つ）が語源 -> 要素、元素
- elementum:（世界を構成するとされた四元素のうちの一つ）が語源。 -> 基礎に位置すること => 基本的な、要素の
- pixel: picture element(写真の要素) -> pixel
inspect
in-（～の中に）＋specio（見る） -> 調査する、検査する
- expect: 外を（ex-）見る（specto）、外を見て待つ、期待する -> 期待する、予期する
- prospect: 前方を（pro-）見る（specio）こと -> 見通し、見込み
- aspect: ～へ（ad-）見たこと（spectus） -> 外見、様子、側面
- conspicious: よく（con-）見つけ（specio）た（-uus）、よく（com-）見る（specio）ことの多い（-ous） -> 目立つ、人目を引く
- despise: 見（specio）下す（de-）こと -> 見下す、軽蔑する
- respect: 後ろを（re-）見る（specio）、振り返ってみる、特別に見る -> 尊敬、特定の点
- perspective: 隅々を（per-）見（specio）ている（-ivus） -> 見方、遠近法、全体像
- suspect: こっそりと見（specio）上げる（sub-）こと -> 疑わしくおもう、容疑者
ambiguous（アンビギュアス）
動き（ago）回っ（ambo）ている（-uus）こと -> 曖昧な、多義な
- ambassador: hmbi-（あちこちに）＋heg-（駆ける） -> 「お上のためにあちこち駆け回る人」 => 大使
- ambition: あちこち（ambi-）行く（eo）こと（-ion） -> 野心、大使
- transition: 別の場所へ（trans-）行く（eo）こと（-io） -> 遷移、推移
- initiate: ラテン語 in-（～の中に）＋eo（行く） -> 始める（initio）こと => 始める、入会させる
