10
6

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

【Capybara】idもnameもlabelも存在しないセレクトボックスのオプションを選択する

Last updated at Posted at 2019-06-18

はじめに

feature specを書いている時に、以下のようなセレクトボックスのオプションを選択しなければならない機会がありました。

  • idない
  • nameもない
  • ラベルも存在していない

流石に情報が少なすぎる……と最初は絶望を覚えましたが、なんとか選択してやろうと奮闘したので、備忘録として纏めておきます。

環境

  • capybara 3.9.0
  • Rails 5.2.1
  • Ruby 2.5.1

どうやって選択するか

以下のようなソースがあったとします。

sample.html
<tr>
  <td class="fruits_name">
    <select>
      <option value=""></option>
      <option value="1">りんご</option>
      <option value="2">バナナ</option>
      <option value="3">メロン</option>
    </select>
  </td>
  <td class="animal_name">
    <select>
      <option value=""></option>
      <option value="1">いぬ</option>
      <option value="2">ねこ</option>
      <option value="3">カワウソ</option>
    </select>
  </td>
</tr>

今回は td の中にあるセレクトボックスのオプション バナナ を選択しようと思います。
結論からいくと、以下のいずれかのコードで取得出来ます。

  • all を使ってオプションを特定するパターン
find('.fruits_name').all('option')[2].select_option
  • nth-child を使って特定するパターン
find('.fruits_name').find('option:nth-child(3)').select_option
  • find を使ってオプションを特定するパターン
find('.fruits_name').find("option[value='2']").select_option

上記二つのポイントは選択したいオプション要素を取得することです。
要素さえ取得することが出来れば、あとは select_option を使うことで選択状態にできます。

  • 素直に選択するパターン(※6/19 追記)
within '.fruits_name' do
  select 'バナナ'
end

コメントにて @jnchito さんに教えていただいたパターンです。
目からウロコでした……。
select を使う時は select 'バナナ', from: '~~' のように from を付けなきゃという意識がありましたが、無くても選択できるとは……!
教えていただきありがとうございます!:bow_tone1:

最後に

今回のパターンに出くわした当初は「どうやって選択するんだ?」と首を傾げていましたが、オプションさえ特定できれば選択できることを知ったことにより、そう難しくないと思えるようになりました。
これでセレクトボックスはもう怖くないです:muscle:
その他にも、何かいい選択方法があればコメントにて教えていただけると嬉しいです:bow:

10
6
2

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
10
6

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?