title: Why can't my Capybara/Poltergeist test select from a jQuery autocomplete field?
body: <hr>
  
  <p>UPDATE: I have fixed this problem after lots of painstaking work on my own. I am happy to be a resource to anybody needing a hand with this. Here is a gist of my <a href="https://gist.github.com/HuckyDucky/10219649" rel="nofollow">working setup.</a></p>
  
  <hr>
  
  <p>I have tried every solution I could find Google and SO. Here are some different things I have tried:</p>
  
  <pre><code>page.execute_script %Q{$('#{selector}').val('#{value}').trigger('keydown')}
  </code></pre>
  
  <p>and</p>
  
  <pre><code>fill_in field, with: options[:with]
  page.execute_script %Q{ $('##{field}').trigger('focus') }
  page.execute_script %Q{ $('##{field}').trigger('keydown') }
  </code></pre>
  
  <p>This is what fails:</p>
  
  <pre><code>page.should have_selector('ul.ui-autocomplete li.ui-menu-item a')
  </code></pre>
  
  <p>But it's definitely there when I look at it in Firebug and test it in the browser.</p>
  
  <p>Here are all of the details, including a restatement of those above. Remember, the autocomplete field works fine in the browser.</p>
  
  <p><code>listing_integration_spec.rb</code></p>
  
  <pre><code>require "spec_helper"
  
  describe "Listing Integration" do
  
    let!(:user) { login_user }
  
    it "lets a user add information listing", js: true do
      listing = create(:listing, user: user)
      click_link('Additional Information')
      click_link('Create')
      fill_autocomplete('listings_search', with: listing.item_id)
    end
  
  end
  </code></pre>
  
  <p><code>spec/support/feature_helper.rb</code></p>
  
  <pre><code>def fill_autocomplete(field, options = {})
    fill_in field, with: options[:with]
    page.execute_script %Q{ $('##{field}').trigger('focus') }
    page.execute_script %Q{ $('##{field}').trigger('keydown') }
    selector = %Q{ul.ui-autocomplete li.ui-menu-item a:contains('#{options[:with]}')}
    page.should have_selector('ul.ui-autocomplete li.ui-menu-item a')
    page.execute_script %Q{ $("##{selector}").trigger('mouseenter').click() }
  end
  </code></pre>
  
  <p><code>ERB from view template</code></p>
  
  <pre><code>&lt;%= simple_fields_for :listings  do |f| %&gt;
    &lt;%= f.input :search, label: "Search by Listing", required: true %&gt;
  &lt;% end %&gt;
  </code></pre>
  
  <p>and the Coffeescript:</p>
  
  <pre><code>$("#listings_search").autocomplete
    source: (request, response) -&gt;
      options = 
        term: request.term
      $.get "/search_listings", options, (data) -&gt;
        if data.length == 0
          alert "No listings found."
        response data
    minLength: 2
    select: (event, ui) -&gt;
      add_listing_hash = 
        type: "GET"
        url: "/add_listing"
        data: { id: ui.item.id }
        success: () -&gt;
      $.ajax(add_listing_hash)
  </code></pre>