Check select box has certain options with Capybara

How do I use Capybara to check that a select box has certain values listed as options? It has to be compatible with Selenium...

This is the HTML that I have:

<select id="cars"> 
  <option></option>
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
</select>

This is what I want to do:

Then the "cars" field should contain the option "audi"

Solution 1:

Try using the capybara rspec matcher have_select(locator, options = {}) instead:

#Find a select box by (label) name or id and assert the given text is selected
Then /^"([^"]*)" should be selected for "([^"]*)"$/ do |selected_text, dropdown|
  expect(page).to have_select(dropdown, :selected => selected_text)
end

#Find a select box by (label) name or id and assert the expected option is present
Then /^"([^"]*)" should contain "([^"]*)"$/ do |dropdown, text|
  expect(page).to have_select(dropdown, :options => [text])
end

Solution 2:

For what it's worth, I'd call it a drop-down menu, not a field, so I'd write:

Then the "cars" drop-down should contain the option "audi"

To answer your question, here's the RSpec code to implement this (untested):

Then /^the "([^"]*)" drop-down should contain the option "([^"]*)"$/ do |id, value|
  page.should have_xpath "//select[@id = '#{id}']/option[@value = '#{value}']"
end

If you want to test for the option text instead of the value attribute (which might make for more readable scenarios), you could write:

  page.should have_xpath "//select[@id = '#{id}']/option[text() = '#{value}']"

Solution 3:

As an alternative solution, and as I'm not familiar with xpaths, I did this to solve a similar problem:

page.all('select#cars option').map(&:value).should == %w(volvo saab mercedes audi)

Its quite simple, but took me some time to figure out.

Solution 4:

Well, since i was around and saw the question (and been testing today) decided to post my way:

within("select#cars") do
  %w(volvo saab mercedes audi).each do |option|
    expect(find("option[value=#{option}]").text).to eq(option.capitalize)
  end
end

Solution 5:

Then I should see "audi" within "#cars"

should do the trick