I am having a weird problem with Capybara and Selenium (Firefox) selecting items in a dropdown.

We are editing a Widget that has a dropdown for size on the page with values 1-10. We can use a simple form, like this.

1. = simple_form_for @widget do |f|
2.     =f.input :name
3.     =f.input :description
4.     =f.input :size, collection: 1..10
5.     =f.submit "Save"

The test code is pretty straightforward too.

1. context "capybara", :driver => :selenium do
2.     before(:each) do
3.         @widget = Fabricate(:widget, :size => 3)
4.     end
5.     it "saves 5 to widget.size" do
6.         visit "/widget/#{@widget.id}/edit"
7.         page.select("5", :from => "widget_size")
8.         click_button "Save"
9.         current_path.should == "/widgets"
10.         @widget.reload.size.should == 2
11.     end
12. end

If you watch this test execute in the browser, the dropdown box that lets the user select the size is clicked on, the value “5” is located and the dropdown closes. Well, not quite. The value changes according to Capybara (fetching the value after page.select confirms this), but the dropdown seems to continue displaying. Weird.

If you post this form, the value that you get in the controller is still “3”, so something is really broken. As a workaround a JQuery selection works.

1. page.execute_script("$('#widget_size').val('5')")

Lets file a bug in Capybara to start, https://github.com/jnicklas/capybara/issues/448.

Ideas?