Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Capybara & AJAX: die ultimative Lösung?

Sponsored · Your Podcast. Everywhere. Effortlessly. Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
Avatar for Taktsoft Taktsoft
September 02, 2013

Capybara & AJAX: die ultimative Lösung?

Avatar for Taktsoft

Taktsoft

September 02, 2013
Tweet

Other Decks in Programming

Transcript

  1. einfaches Beispiel • Rails 3 Application ◦ PostgreSQL ◦ Poltergeist

    / PhantomJS • Post (Title & Body) ◦ Create & Destroy via AJAX
  2. Feature-Spec it "creates a new post on submit" do visit

    posts_path page.click_on "New Post" page.fill_in 'Title', with: "Foo" page.fill_in 'Body', with: "Bar" expect { page.click_on "Create Post" }.to change(Post, :count).from(0).to(1) end
  3. Probleme • ID des neuen Datensatzes nicht bekannt! ◦ kein:

    page.should have_css “#model_#{id}” • Class nur für den Test setzen? ◦ Kein App-Code damit Test funktioniert • sleep(Capybara.default_wait_time) ◦ Nicht die feine Art
  4. Vorschlag • jQuery.ajaxStart & jQuery.ajaxStop ◦ globale AJAX-Event-Handler • AJAX-Status

    an Attribut setzen / erkennen ◦ z.B. am immer verfügbaren body-Tag
  5. Implementierung (1) page.execute_script <<-EOS $(document).ready(function() { $('body').attr('data-ajax-status', 'stop'); }); $(document).ajaxStart(function()

    { $('body').attr('data-ajax-status', 'start'); }); $(document).ajaxStop(function() { $('body').attr('data-ajax-status', 'stop'); }); EOS
  6. page.should have_css "body[data-ajax-status=stop]" • Jeweils über eine Helper-Methode aufrufbar ◦

    wait_for_ajax_install (1) ◦ wait_for_ajax_stop (2) • install nach visit • stop vor assert Implementierung (2)
  7. Ausblick • Berücksichtigung von Nebenläufigkeit ◦ Mehrere AJAX-Requests überschneiden sich

    • Verankerung in RSpec ◦ kein expliziter Aufruf der Helper • Erweiterung als Gem ◦ nächster Wissensaustausch … ;)
  8. Hidden Page • using_wait_time(seconds) { … } ◦ führt einen

    Block mit der angegebenen wait time aus • page.should have_css “#foo”, wait: 5 ◦ führt die expectation mit der angegebenen wait time aus