Search code examples
ruby-on-railscapybarapoltergeist

How to find out why rails feature test fails

we're currently working on a piece of mapping software, where we use Leaflet with custom left and right sidebars as well as a text-filter where we filter for different POI features. The whole thing looks like this:

enter image description here

The flow is as follows

  1. A user visits a map under a unique link
  2. The controller renders the HTML template first (no data is bein published)
  3. Inside our javascript an ajax call fetches the data and renders markers, some panels, etc., etc.

We use capybara with poltergeist for all our feature tests.

In our master everything is working as it should be. In another branch I added password protection, hence a bootstrap modal pops up if a map is password protected and has not yet been unlocked within the current session.

Everything is working fine except for some feature tests that fail lately and after messing around with stuff I still don't have a clue why exactly.

Let's see for example this test

feature 'Places map filter', js: true do
  before do
    @map = create :map, :full_public
    create :place, :unreviewed, categories: 'Playground', map: @map

    visit map_path(map_token: @map.public_token)
    find('.open-sidebar').trigger('click')
  end                                                                                                                                                                 

  scenario 'Nothing filters nothing' do
    show_places
    show_events
    show_places_list_panel

    expect(page).to <...>
  end
  ...
end

Capybara claims to be unable to find some css elements. Calling screenshot_and_open_image reveals that it is still showing an overlay (hiding everything else) until all data have been loaded. Something seems to be hanging within my Javascript...

enter image description here.

I've been messing around with the test-environment, which had an effect:

config.action_controller.asset_host = "file://#{::Rails.root}/public"                                                                                             
config.assets.prefix = 'assets_test'

The test passes since the data is now there. A screenshot reveals missing assets, which is guided by a proper warning message Not allowed to load local resource: <path>. I'm puzzled since querying the data happens via an ajax-call from one of the files that capybara tells to be unaccessible. enter image description here

I don't know how to continue, since I don't want to start skipping tests. I hope you can help guiding me finding the error.

Thanks in advance, Andi

Update

Thanks to Thomas for his hint on ES6 features. I used poltergeist's inspector mode and hence was able to discover an arrow function I introduced! That's why the JS driver couldn't deal with a callback I was passing to a promise which did not resolve...

Solution

  • Firstly, ensure you have js_errors: true in your Poltergeist driver registration - https://github.com/teampoltergeist/poltergeist#customization - so that you will get runtime JS errors reported.

    Secondly, if you're using any ES6+ features in your JS code, make sure you transpiling them into ES5 compatible code since Poltergeist/PhantomJS only supports JS <= ES5, and will silently fail at JS parse time if it parses JS using features like let.

    And finally, by using trigger you are bypassing Poltergeists checks that the button is actually clickable by the user, so make sure you're not clicking a button too early (before whatever behavior gets attached to the button is actually attached)