I am working on a jQuery plugin and needed a way to "integration" test it to see if everything in the browser worked correctly. I wanted an automatic testing solution and have looked at QUnit and such but it seemed an even better way to actually test it with a fake browser.
This example contains the following:
- A Rack app that loads up index.html and javascripts from the demo/ directory.
- My SwipeTest testcase.
- My test_helper that creates a TestCase classed that includes and sets up Capybara and poltergeist.
In the test_swipe_move_page
method on the SwipeTest case, you can see that I
visit "/"
in the Rack app, which is the demo for the plugin.
Then, I resize the browser window of my driver to fit an iPad resolution.
The next lines, simulate a "swipe" movement in PhantomJS trough Poltergeist.
page.driver.mouse_down_at(100, 100)
page.driver.mouse_move_at(50, 100)
page.driver.mouse_up_at(20, 100)
Then I assert some functionality in the plugin that should move the specified
div with the .pages
selector with a -webkit-transform: translate3d()
call.
The private css_matrix_for_selector
method evaluates some JavaScript in
PhantomJS to grab the CSS3 matrix and interprate the coordinates trough a
Regexp.
This is a great way of "integration" testing my JavaScript code, while still using some awesome Ruby tools that can be run with "rake test"
Check out http://github.com/michiels/jquery-pageswipe for updates and the total picture.
Where are these methods defined? I Couldn't find any information: