Warum können meine Capybara/Poltergeist-test-wählen Sie aus eine jQuery-autocomplete-Feld?

UPDATE: ich habe das problem behob, nach viel mühsame Arbeit auf meinem eigenen. Ich bin glücklich, eine Ressource, die niemanden brauchen, ist eine hand mit diesem. Hier eine Zusammenfassung meiner setup.

Ich habe versucht, jede Lösung, die ich finden konnte, Google und SO. Hier sind einige andere Dinge, die ich versucht habe:

page.execute_script %Q{$('#{selector}').val('#{value}').trigger('keydown')}

und

fill_in field, with: options[:with]
page.execute_script %Q{ $('##{field}').trigger('focus') }
page.execute_script %Q{ $('##{field}').trigger('keydown') }

Dies ist, was fehlschlägt:

page.should have_selector('ul.ui-autocomplete li.ui-menu-item a')

Aber es ist definitiv da, wenn ich es sehe in Firebug, und testen Sie Sie im browser.

Hier sind alle details, einschließlich einer Zusammenfassung von oben. Denken Sie daran, die AutoVervollständigen-Feld funktioniert im browser.

listing_integration_spec.rb

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

spec/support/feature_helper.rb

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

ERB from view template

<%= simple_fields_for :listings  do |f| %>
  <%= f.input :search, label: "Search by Listing", required: true %>
<% end %>

und Coffeescript:

$("#listings_search").autocomplete
  source: (request, response) ->
    options = 
      term: request.term
    $.get "/search_listings", options, (data) ->
      if data.length == 0
        alert "No listings found."
      response data
  minLength: 2
  select: (event, ui) ->
    add_listing_hash = 
      type: "GET"
      url: "/add_listing"
      data: { id: ui.item.id }
      success: () ->
    $.ajax(add_listing_hash)
  • Können Sie bitte das markup der Seite, die Sie testen wollen, und der komplette source-code der test, den Sie ausführen?
  • Haben Sie versuchen, Debuggen das Problem in der Laufenden poltergeist-Sitzung?
  • Ich habe. Es versucht, um die Ereignisse, sondern die Ereignisse werden nicht ausgelöst wird die AutoVervollständigen-die Art, wie Sie sollen. Ich war nicht einmal in der Lage zu berufen, autocomplete direkt.
  • Haben Sie versucht mit der spec mit selenium? Offensichtlich eine längere spec aber einen Versuch ist es Wert. Vor allem AJAX-Zeug IMHO
  • Haben Sie versucht, das hinzufügen einiger Verzögerung zwischen den einzelnen Schritten ? Das ist schmutzig, ich weiß, aber das ist vielleicht sein Weg, um eine mögliche race-condition.
  • Ich fügte hinzu, "sleep 5" zwischen allen Schritten ohne Verbesserung. Bitte beachten Sie, dass ich festgestellt habe, dass die "autocomplete" - event ist in der Tat ausgelöst werden, und ist eine Zeile zurückgeben von Daten, aber dass das Textfeld autocomplete erzeugt es Ergebnisse, die nicht gesehen werden können. Beim Debuggen dieses Verhalten in Poltergeist, finde ich, dass der Poltergeist nutzt die volle Länge des timeout ich habe es so konfiguriert, dann werden nicht finden die ul.ui-autocomplete li.ui-menu-item a - Selektor. Etwas macht Poltergeist auflegen nach "AutoVervollständigen" ist eingeleitet.
  • Haben Sie versucht, einen screenshot in poltergeist an jedem Punkt zu sehen, was poltergeist sehen kann? github.com/jonleighton/...
  • Haben Sie versucht, unter Verwendung eines Arrays statt ajax zum laden der Testdaten? Von dem, was ich verstehe, von Capybara es sollte in der Lage async ok, aber es würde sich lohnen, zu versuchen und zu vereinfachen das problem.
  • Ich bin definitiv screenshotting das heck aus dem test. Die autocomplete "feuert" aber kämpfen, um Sie zu erlauben, klickt auf die Ergebnisse.
  • würden Sie bitte teilen deiner Lösung mit uns? Ich bin mit den gleichen Problem.
  • Ich würde auch gerne die Lösung.
  • Hi Jungs. Alles tun musste, um mit meinem setup. Wenn Ihr AutoVervollständigen funktioniert im browser, aber nicht in RSpec, hier ist alles in meinem setup ist für Sie zu suchen und zu kopieren. Hoffentlich spart dir das etwas Zeit. Lassen Sie mich wissen, wenn irgendetwas fehlt. gist.github.com/HuckyDucky/10219649

InformationsquelleAutor AKWF | 2013-12-29
  1. 9

    JS-Treiber sind in der Regel meh, Sie sind langsam und nicht einzelne von Ihnen deckt 100% der Funktion, und Sie sind oft schrullig und schwierig zu Debuggen, aber ich bin sicher, du hast herausgefunden, von jetzt.

    Habe ich ähnliches Stück code arbeiten auf rails 3.2, minitest und poltergeist 1.3.0 (ein ajaxed dropdown), aber es Art von Pausen in regelmäßigen Abständen für keinen guten Grund (man könnte sagen, es ist ein poltergeist? Ich habe bereits gegriffen switching test zwischen Selen und poltergeist ein paar mal bisher), nicht sicher, warum autocompleter würde nicht für Sie arbeiten, aber es fühlt sich an wie ein bug,

    Einreichen Frage zu https://github.com/jonleighton/poltergeist (die du schon hast? https://github.com/jonleighton/poltergeist/issues/439), versuchen Sie, Selen oder webkit, zu sehen, ob es funktioniert, können Sie verwenden Sie einen anderen Treiber in diesem einen test, wenn es bekommt Sie aus dem Wald (es beats zu verlieren Tage Arbeit über ein widget, das funktioniert).

    • Es gibt so viele bewegliche Teile (welche Ereignisse jQuery verwendet, um die trigger eine AutoVervollständigen, PhantomJS, Capybara-Konfiguration), dass die Antwort wirklich ist meh. Ich habe soweit mit den Ergebnissen generierte HTML-Code aber nicht das mouseenter-klicken Sie auf.
    • Ich verfolgte das mouseenter-klicken Sie scheitern an schlechten Sachen auf meinem Teil. Ich habe auch aktualisiert, alle beteiligten Edelsteine, um die bleeding edge, und ich begann, Ergebnisse zu sehen. Die ganze Sache wahrscheinlich dauerte 48 Stunden von der Arbeit zu lösen. Glücklicherweise ist es für meine eigenen Sachen, so dass niemand zu bezahlen, außer mir 😉 Wie frustrierend das war, ich bin besser, nachdem Sie wateten durch alle beweglichen Teile.
    • Bravo 🙂 Prost 🙂
    • Schaltete mein AutoVervollständigen-tests auf webkit, alles vergeht, versuchen Sie zunächst...
    InformationsquelleAutor bbozo
  2. 6

    Ich gefunden habe, verschiedene online-Lösungen, von denen keine arbeiten mit aktuellen Versionen von Poltergeist, Wasserschweine, und AutoVervollständigen. Aber ich habe gelernt, genug von Ihnen zu einer Arbeit helper-Methode, mit no sleep-Aufrufe.

    def fill_autocomplete(css_id, page, options = {})
  find("#{css_id}").native.send_keys options[:with]
  page.execute_script %{ $('#{css_id}').trigger('focus') }
  page.execute_script %{ $('#{css_id}').trigger('keydown') }
  selector = %{ul.ui-autocomplete li.ui-menu-item:contains("#{options[:select]}")}
  expect(page).to have_selector('ul.ui-autocomplete li.ui-menu-item')
  page.execute_script %{ $('#{selector}').trigger('mouseenter').click() }
end

    Beispiel:

    fill_autocomplete(
  '#contact_filter_company',
  listing_page,
  with:   'acm',
  select: 'Acme'
)

    Ich habe eine page argument, denn ich bin mit SitePrism - wenn Sie nicht, können Sie entfernen Sie es aus.

    Ich bin mit diesem mit:

    • jQuery-UI-Autocomplete-1.11.2
    • poltergeist 1.5.1
    • capybara 2.4.4
    • rspec 3.1.0
    • Was genau ist die Seite mit der Liste? Die Schienen Helfer für die Seite?
    InformationsquelleAutor Mike T
  3. 3

    Konnte ich testen, meine autocompleting text-Feld mit dem Poltergeist ohne viel Mühe. Die wichtigste Sache zu wissen über Poltergeist ist .native.send_keys Methode.

    Zusammen hacken-eine Zusammenfassung aus der Gurke vor, wo Sie diese Zeilen von code tatsächlich live in meinem Projekt:

    find('#username').native.send_keys "the" # this field autocompletes usernames
wait_until { all('a', text: "the_username").any? }
find('a', text: "the_username").click

    Dann habe ich das Formular abschicken und durchzusetzen, die erwarteten Ergebnisse auf der folgenden Seite in der üblichen Weise.

    wait_until (eine Neuimplementierung einer Methode, die entfernt wurde, von Capybara 2) nimmt einen block gibt wahr zurück, wenn wir aufhören sollten zu warten. Es ist schneller als das warten für 5 Sekunden oder was auch immer, jedes mal.

    def wait_until(delay = 1)
  seconds_waited = 0
  while ! yield && seconds_waited < Capybara.default_wait_time
    sleep delay
    seconds_waited += 1
  end
  raise "Waited for #{Capybara.default_wait_time} seconds but condition did not become true" unless yield
end
    InformationsquelleAutor Dave Schweisguth
  4. 0

    Ich denke, vielleicht brauchen Sie eine Mischung der Auslösung von KEYDOWN, sondern auch die Einstellung der keycode nach UNTEN.

    z.B.

    var keyEvent = $.Event("keydown");
keyEvent.keyCode = $.ui.keyCode.DOWN;  

$("#autocomplete").val("j");       

$("#autocomplete").trigger(keyEvent);

    Hier ist eine funktionierende jsfiddle Beispiel zeigt ein Element, ausgewählt von der autocomplete: http://jsfiddle.net/alexkey/74BST/ ich bin nicht sicher, warum Sie auslösen müssen keydown zweimal, aber das ist ein problem zu lösen, einzeln (wenn ein problem überhaupt).

    Aber ich bin nicht vertraut mit dem unit-Test-framework, die Sie verwenden, aber ich hoffe, dass die oben hilft.

    Kredit geht an JQuery AutoComplete, manuell wählen Sie das erste Element gesucht und binden Sie auf

    Ich bin mit dem Beispiel-code-form: http://api.jqueryui.com/autocomplete/#entry-examples

    Der autocomplete-unit-tests, die die jquery-ui-team setzt, kann nützlich sein für die inspiration: https://github.com/jquery/jquery-ui/tree/master/tests/unit/autocomplete

    Auch ein Verweis auf die keycode: http://api.jqueryui.com/jQuery.ui.keyCode/

    • Ich gab diesem einen Schuss. Die autocomplete ausgelöst werden, aber Poltergeist ist, hängt bis auf die Generierung der Ergebnisse HTML.
    InformationsquelleAutor Alex KeySmith
  5. 0

    Hatte ich dieses problem und keine vorgeschlagene Lösung könnte es lösen. Meine tests immer versagt, wenn Sie versuchen zu finden, die ul.ui-autocomplete element. Ich endlich aufgefallen, dass jQuery autocomplete hängt die ul an das Ende der html-Seite und NICHT um das input-Feld in Frage. In meiner Skillung, ich Folge der Praxis der targeting meine Formen ausdrücklich von within my_form do und dabei alle fill_inSachen in diesem block:

    within my_form do
  fill_autocomplete …
end

    Natürlich könnte dies nie die ul befestigt AUßERHALB dieses Formular-element. Meine Lösung war einfach: die Verwendung der jQuery-autocomplete-Attribut appendTo: '#id_of_input_field' beim initialisieren AutoVervollständigen. Jetzt kann es meine ulund alles funktioniert einwandfrei.

    InformationsquelleAutor morgler
Schreibe einen Kommentar