Reputation: 223
I'm having a problem with Capybara 2.1 to match exact text.
I have a select form looking like this one :
<select class='tags-select'>
<option>Tag 1</options>
<option>Tag 2</options>
</select>
My test should select Tag 2
page.find('.tags-select', :text => 'Tag 2').click
Otherwise that keeps selecting Tag 1 even with this Capybara config in my helper :
Capybara.configure do |config|
config.match = :prefer_exact
config.exact = true
config.exact_options = true
config.ignore_hidden_elements = true
config.visible_text_only = true
config.default_wait_time = 10
end
I know that I can use some regex here to avoid the problem, but I want to understand what I'm doing wrong with that test.
Upvotes: 3
Views: 2872
Reputation: 46836
The main problem, based on the query.rb file, is that the :exact option does not apply to the :text option:
def matches_filters?(node)
if options[:text]
regexp = options[:text].is_a?(Regexp) ? options[:text] : Regexp.escape(options[:text].to_s)
return false if not node.text(visible).match(regexp)
end
So the finder:
page.click_link('id', :text => 'Password', :exact => true)
Will match both of the following elements
<a id="id" href="#">Password</a>
and
<a id="id" href="#">Password Other</a>
Your approach might also be failing because your find method is actually returning the select list rather than the option (ie I believe you are clicking the wrong element). The following will click the right option, however you would still have the exactness problem.
page.find('.tags-select option', :text => 'Tag 2').click
To address the exactness issue, you need to pass the text value to the finder without using the text option.
If you are just selecting an option, use the select
method as DevDude mentioned:
page.find('.tags-select').select("Tag 2")
If you really need to do a click instead, you could do:
page.find('.tags-select').find(:option, 'Tag 2').click
Upvotes: 3
Reputation: 3940
The problem lies in the fact that you are using a text selector on an Element with multiple options. You should be using another specification for your selector that includes the option. Also, you should add a value for each option, as they are both equivalent (empty value). I would redo your work like this:
<select class='tags-select'>
<option value="1">Tag 1</options>
<option value="2">Tag 2</options>
</select>
And then try to select the option with this:
page.find('.tags-select').select("1")
Upvotes: 0