RSpec+Capybaraで同名の複数要素の並び順をテストする

スポンサーリンク

同名のCSSセレクタの要素が複数並んでいる HTML の場合で、それらの要素の並び順を RSpec + Capybara でテストする Request Spec の例です。Capybara の page.all と find の機能を使って解決しました。

— 環境 —
capybara 2.4.4
rspec-rails 3.1.0

【お知らせ】 英単語を画像イメージで楽に暗記できる辞書サイトを作りました。英語学習中の方は、ぜひご利用ください!
画像付き英語辞書 Imagict | 英単語をイメージで暗記
【開発記録】
英単語を画像イメージで暗記できる英語辞書サービスを作って公開しました
スポンサーリンク

典型的な例としては、以下のように div タグの class が同名で、複数の要素が繰り返し出力されている場合。

page.all(“.greeting”) で greeting のCSSセレクタが指定された class の複数要素を全て取得した後、要素1つずつに find を使って、h2要素の中身のテキストが正しい順で並んでいるかどうかを Request Spec のテストで確認しました。

これで上手いこと動いてくれて、テストで確認できました。要素がさらに多い場合は、確認するテキストなどを正しい順序の配列にして each で回せば良いかな。

以下の記事などを参考。1つ目の英文記事だと、配列から Capybara nodes の find を使うな、と記事のタイトルに書いてあるのですけどね…

Do not use “find” on Capybara nodes from an array – makandropedia
Module: Capybara::Node::Finders — Documentation for jnicklas/capybara (master)
Capybara で同名の CSS セレクタを持つ複数の HTML 要素から任意の要素を見つける | EasyRamble

以上です。

スポンサーリンク
私は Rails のテストフレームワークには RSpec を使っています。サーバーのテスト用に Serverspec もおすすめです。
 
スポンサーリンク

Leave Your Message!