Qiita Teams that are logged in
You are not logged in to any team

Log in to Qiita Team
Community
OrganizationAdvent CalendarQiitadon (β)
Service
Qiita JobsQiita ZineQiita Blog
63
Help us understand the problem. What is going on with this article?
@upinetree

非表示要素はCapybaraのfindで検索対象になるのか

More than 5 years have passed since last update.

display: none で非表示にした要素は、Capybaraのfindやallの検索対象になるのでしょうか?

結論からいうと、「デフォルトでは非表示要素は検索対象にならない」です。

リファレンスを見ると下記の記述があります。

Module: Capybara::Node::Finders

visible (Boolean) —
Only find elements that are visible on the page. Setting this to false finds invisible andvisible elements.

つまり、visibleオプションを付けることでfindの動作を変えられるということです。要約すると以下のようになります。

visible: true  #=> display: noneのものは検出しない
visible: false #=> display: noneでも検出する

visibleオプションはどちらがデフォルト?

ただ、この記述ではどちらの状態がデフォルトなのかわかりません。
そこでソースを見に行ってみます。

lib/capybara/query.rb

def visibleありますね。visibleオプション指定がないときは、
Capybara.ignore_hidden_elementsを見て判定しているようです。

こいつはlib/capybara.rbにありました。

[ignore_hidden_elements = Boolean] Whether to ignore hidden elements on the page (Default: true)

デフォルトはtrueなので、見えないものは探さないってことになります。つまり、

visible: true  #=> display: noneのものは検出しない(デフォルト)
visible: false #=> display: noneでも検出する

ということですね。

おまけ

デフォルト動作の設定

Capybaraのデフォルトの動作を変えたければ、ignore_hidden_elementsを予め変更してあげれば良いのです。
つまり、spec全体で非表示要素も検索対象に加えたければ、spec_helper等で次のように定義します。

Capybara.ignore_hidden_elements = false

visibleオプションは色々なところで使える

visibleオプションは他のマッチャーなどでも使えます。

have_selector('.hoge', visible: false)

のようにすることで、非表示要素であってもspecの対象にすることができます。

「非表示であること」のテスト

下記のように記述すると非表示なのか、そもそも存在しないのかが区別できません。

expect(page).not_to have_selector('.hoge')

従って、visible: falseを使って以下のようにすると良い感じです。

expect(find('.hoge', visible: false)).not_to be_visible

--

※以上は、もともとblogで書いた記事をQiitaに移植したものです。個人的に何度も役に立っているので。

63
Help us understand the problem. What is going on with this article?
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
hey-inc
インターネットビジネスの企画・開発・運営

Comments

No comments
Sign up for free and join this conversation.
Sign Up
If you already have a Qiita account Login
63
Help us understand the problem. What is going on with this article?