Search code examples
cssruby-on-railsajaxasset-pipelinecapybara-webkit

how to setup capybara-webkit to test ajax calls and get screenshots(html with css and javascript loaded)

I'm struggling with capybara-webkit set-up on my little rails 4.2.1 app. Tests are running, links are being clicked on page and ajax calls are working in tests. Everything seems to work except one weird issue after I started using capybara-screenshot gem. My aim was to get the html screenshots with all assets loaded so the screenshot look like in real life.

So, when getting screenshots, I'm getting two files: 'png' and 'html' file. When looking at 'html' file (e.g file:///Users/monk/dev/things/tmp/capybara/screenshot_2015-08-31-16-06-51.840.html), it had no css loaded. I figured out that asset paths are different from the point of screenshot files location... OK, so I configured my test environment in 'config/environments/test.rb' file by adding this:

config.action_controller.asset_host = "file://#{::Rails.root}/public"
config.assets.compile = true
config.assets.digest = true

The first line adds the specified prefix for all asset url's on page, the second one compiles the assets and the third one adds that digest hash to asset files. So all the stuff looks more like on production environment.

This makes html screenshots to show up with css and javascript loaded as expected. But... When I run the same tests, then ajax calls are not being called correctly anymore.. and I get the error

Failure/Error: Unable to find matching line from backtrace
ActionController::RoutingError:
  No route matches [GET] "/things/ajax_calculate_it"

So, as soon as I change the default asset_host.asset_host the ajax calls are failing in all tests.

Here's a sample of ajax call on may test page:

<a class=" calculable " data-remote="true" rel="nofollow" data-method="post" href="/things/ajax_calculate_it?a=5&b=48">Calculate it</a>

Why is this called using GET not POST ? There must be something simple to configure. What configuration I'm missing here?

Solution

  • Ok... Looks like I found the answer by myself.

    Simply changed this

    config.action_controller.asset_host = "file://#{::Rails.root}/public"

    to this

    config.action_controller.asset_host = "http://localhost:3000"

    After that it seems to work without problems. Ajax called as expected and screenshots are also loaded with css and javascript as expected.