Clicking a button in filepicker modal with rspec

Question

I am testing an implementation of filepicker.io in a rails app and in my integration test that I am writing, when I get to the following point:

sleep(5.0)
find_button('#fileUploadDummy').click

I get this error:

Failure/Error: find_button('#fileUploadDummy').click
     Capybara::ElementNotFound:

I am watching the browser open and progress to this point before reaching this error. How can I click on this button within the filepicker modal?

Answer 1

I was not able to get this test working with Capybara-webkit or Poltergeist (they are headless) so I switched to Selenium.

Example code:

test 'filepicker upload' do
    # in case your default driver is :webkit
    Capybara.current_driver = :selenium

    # this click_on will trigger filepicker.io plugin
    click_on 'Upload'

    # waiting for filepicker.io
    sleep 5

    within_frame 'filepicker_dialog' do
        # attach image to filepicker file input and upload...
        find('#fileUploadInput', visible: false).set("#{Rails.root}/test/integration/test_image.png")
        sleep 5
    end
end

From my debugging there was a issue with origin privacy or something like that, because I was getting error:

Unsafe JavaScript attempt to access frame with URL

Answer 2

Most likely you'll need to first get a handle to the iframe and then do a find inside that document. I'm not sure how this translates to rspec, but the equivalent js code would be

var iframe_doc = document.getElementById("filepicker_dialog").contentDocument;
iframe_doc.getElementById("fileUploadDummy")

Of course this gets upset due to cross-origin javascript calls, but rspec should be fine

Answer 3

Turns out what I thought was a button on the filepicker modal is an input element of type file and that to upload the picture in rspec I needed to use the method attach_file.