Search code examples
ruby-on-railstestingcapybararspec-railspoltergeist

Javascript action not triggering in Capybara test


I have an instant search-as-you-type implemented with Turbo and a Stimulus controller, as outlined in this post. Relevant JavaScript, in app/javascript/controllers/form_submission_controller.js:

import { Controller } from "@hotwired/stimulus"

export default class extends Controller {

  search() {
    clearTimeout(this.timeout)
    this.timeout = setTimeout(() => {
      this.element.requestSubmit()
    }, 200)
  }
}

and in the view, something like:

<%= form_with(url: users_path, method: :get, data: { controller: "form-submission", turbo_frame: "users", turbo_action: "advance" }) do |form| %>
  <%= form.label :query, "Search by name:" %>
  <%= form.text_field :query, data: { action: "input->form-submission#search" } %>
<% end %>

It works in my browser, but not in my test suite. I'm using RSpec + Capybara with Poltergeist driver, and it seems that when using fill_in to enter the query, this doesn't trigger the Stimulus controller to update the page; the entire list is still there, and there is no HTTP request for the search in the logs. How can I trigger this controller function from the test suite?


Solution

  • The poltergeist driver has been discontinued for 4 years and is basically equivalent to a 6 year old version of Safari, at best. Because of that the most likely issue here is that your page is using JS poltergeist doesn’t support. Stop using poltergeist and move to an updated/supported driver (selenium, etc)