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?

Answer 1

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.