CODEWITHSUNDEEP
autocompletecucumbercapybaraphantomjspoltergeist
Martinffx
Martinffx

Reputation: 2476

@javascript cucumber tests pass using selenium driver but fail when using poltergiest

I'm trying to test an jquery UI autocomplete, I've got the tests passing using the selenium driver. I want to switch to poltergiest for some headless testing, but now my tests are now failing.

It doesn't seem to select the autocomplete option for some reason that I have yet been able to figure out

Step

When /^select contract$/ do
  VCR.use_cassette("contract") do
    selector =
      '.ui-menu-item a:contains("John Smith (123456)")'
    within("div#review") do
      fill_in("contract", with: "john")
    end
    sleep 2
    page.execute_script "$('#{selector}').trigger(\"mouseenter\").click();"

    within("div#myPerformaceReview") do
      find_field("contract").value.should ==
        "John Smith (123456)"
    end
  end
end

The test passes using the Selenium driver without any changes to the step.

Any advice on how I could debug this?

Version

Upvotes: 7

Views: 1884

Answers (2)

Martinffx
Martinffx

Reputation: 2476

I've managed to figure it out, it seems capybara-poltergeist driver doesn't trigger any of the events that jquery-ui uses to display the dropdown list.

I found the answer here: https://github.com/thoughtbot/capybara-webkit/issues/50

I created a form helper in features/support

module FormHelper
  def fill_in_autocomplete(selector, value)
    page.execute_script %Q{$('#{selector}').val('#{value}').keydown()}
  end

  def choose_autocomplete(text)
    find('ul.ui-autocomplete').should have_content(text)
    page.execute_script("$('.ui-menu-item:contains(\"#{text}\")').find('a').trigger('mouseenter').click()")
  end
end
World(FormHelper)

I then used those method to fill in the form and select the desired option.

Upvotes: 8

tmandry
tmandry

Reputation: 1375

Martin's answer almost worked for me, but I found that the input needs to be focused as well to make it work:

module FormHelper
  def fill_in_autocomplete(selector, value)
    page.execute_script %Q{$('#{selector}').focus().val('#{value}').keydown()}
  end

  def choose_autocomplete(text)
    find('ul.ui-autocomplete').should have_content(text)
    page.execute_script("$('.ui-menu-item:contains(\"#{text}\")').find('a').trigger('mouseenter').click()")
  end
end

Found this on the same page: https://github.com/thoughtbot/capybara-webkit/issues/50#issuecomment-4978108

Upvotes: 3

Related Questions