Capybara Trouble Filling in Js Modal

Capybara trouble filling in JS modal

I can't reproduce this issue against Stripe's demo checkout page.

require "capybara"

sess = Capybara::Session.new(:selenium)
sess.visit("https://stripe.com/docs/checkout")
sess.click_button('Pay with Card')
sess.within_frame('stripe_checkout_app') do
  sess.fill_in 'Email', with: 'test@example.com' # it's visible that field becomes filled in
  sleep 3 # just to inspect that manually
end

The issue described by you is because there are two iframes with name stripe_checkout_app. within_frame finds the first of them that doesn't contain billing fields. To find second iframe you can do e.g.:

stripe_iframe = all('iframe[name=stripe_checkout_app]').last
within_frame stripe_iframe do
  # your code here
end

(Capybara) access modal window

I didn't use Capybara, but your problem has to do with the fact that Bootstrap's modal dialog is actually a pseudo-modal, in that it's actually just a div element and a transparent overlay behind it. A true modal dialog would be one created using window.confirm, for example, which can indeed be queried using your sample code. In your case you should give the modal div element an id, and use that as a handle to query it from Capybara and wait until its display is "block". Didn't test anything though.

Capybara having trouble finding and filling in first form element

Capybara is actually finding the input and filling it in, but then the value is being removed. This is because you have some JS library that is adding functionality/behavior to the input after the Capybara has filled in the element. Once the JS has augmented the input it is resetting its value to the inputs value property (as opposed to the value attribute which has been changed) which ends up setting it back to blank. Sleeping before the first fill_in is a workaround, other than that it would mean figuring out what JS is being run on the element and waiting for a detectable change (if there are any) before calling fill_in.

Filling in a search box and then clicking on the autocomplete

Working with autocompletes can be pretty difficult, depending on how it's implemented. Some tricks I've used in the past:

• Click the input before sending text to it

  find('#js-emu-operation-search').click()

• Try using the underlying element methods instead of the fill_in wrapper, e.g.

  find('#js-emu-operation-search').set("Alternator Replacement")

• Select from the dropdown options with find("#results-pane", text: "My Result").click, or if you get really desperate, make sure there's only a single result and select it with the down arrow, find('#js-emu-operation-search').native.send_keys(:arrow_down)

Disclaimer: My capybara is getting rusty, may have to tinker. If you're working on a team, I've also had good luck dragging another developer into it, preferably the guy who implemented the autocomplete.

Capybara #set not filling in the entire string

If you're using Chrome with selenium-webdriver you're probably running into - https://bugs.chromium.org/p/chromedriver/issues/detail?id=1771&q=sendkeys&sort=-id&colspec=ID%20Status%20Pri%20Owner%20Summary - A possible workaround, until Chromedriver fixes the issue, is to sleep for a second or two after calling fill_in on the fields where it's having issues.

Filling in text box with capybara

To fill the <input> using Capybara you can use either of the following locator strategies:

find('[aria-label=Filter for column]').set('1414234')

or

find('input[aria-label=Filter for column]').set('1414234')

---

Related Topics