How do I select an item from a drop down with Site Prism?

Question

I have the following elements defined within a SitePrism page:

element :type, "select[id='type']"
elements :type_options, "select[id='type'] option"

And in my cucumber step definitions I have the following code to select an item from the select box based on the elements value:

@app.new.type_options.each {|name| name.click if name.text.upcase == value.upcase}

I don't really like this implementation but it does work perfectly when running Capybara in chrome but fails when I run it headless so I figure there must be an alternate / better way to select drop down items.

Ideally I'd like to be able to do something like @app.new_r.r_type.select 'value', but I can't work out how to do this in SitePrism.

So, my first question is, can anyone recommend an elegant way to select an item from a drop down based on value from SitePrism?

And my second question is, any idea why the above code fails when running headless?

What do you get when you try `@app.new_r.r_type.select 'value'` ? — Nat Ritmeyer, Jun 03 '13 at 16:36
I get a Unable to find option "event" (Capybara::ElementNotFound) error. — drooks, Jun 04 '13 at 08:07
Correction - I had tried this before but I was trying to match 'value' with 'Value' and was getting an Unable to find option "event" (Capybara::ElementNotFound) error. After fixing my matchers this is now working. This has also solved my second issue. Thanks Nat! — drooks, Jun 04 '13 at 08:16
If you could write up an answer to this question for the benefit of future googlers that would be great! :) — Nat Ritmeyer, Jun 04 '13 at 08:21
OK. So to fix this i had to do 2 things. First was follow Nat's suggestion and use @app.new_r.r_type.select 'value' to select an item from the drop down box based on its value. The second thing I needed to do was change the capybara default driver and the javascript driver to webkit - Capybara.default_driver = :webkit Capybara.javascript_driver = :webkit. Not sure why that was necessary as no javascript was being used on the offending page, but hey ho, it works now! — drooks, Jun 04 '13 at 13:05
Cool. Now if you could make that an *actual* 'answer' (ie: copy and paste the above into what stackoverflow considers an answer) that would be even better :) — Nat Ritmeyer, Aug 04 '13 at 13:53

score 12 · Answer 1 · answered Jun 05 '14 at 17:15

I had a similar problem, where I couldn't get it to select the option I wanted. I came across this question and it made me realize my problem was that you have to send the text, not the value, to the select().

For example, if I have HTML like

<select id="things">
  <option value="thing1">The First Thing</option>
  <option value="thing2">The Second Thing</option>
  <option value="thing3">The Third Thing</option>
</select>

And in my SitePrism::Page class I have:

element :things, "select[id='things']"

I thought I needed to do:

@my_page.things.select("thing1")

That does not work. Instead you have to do:

@my_page.things.select("The First Thing")

I know this is slightly different than trying to select based on a value you get from SitePrism, like was originally asked. But I thought this distinction about what to pass to select() might help someone.

How do I select an item from a drop down with Site Prism?

1 Answers1