I have created custom upload form using the following html stack:
<form>
<label></label>
<input type="file">
</form>
The file field is hidden via css with display: none
property. So the file attach dialogue is being called by user when she clicks on label (which is custom styled).
In my feature test I can't attach a file since the input field is hidden. I've tried few possible solutions, but neither of them work:
find(:xpath, '//input', visible: false).set(some_file_path)
or
within('form') do
attach_file(:input, some_file_path, visible: false)
end
And many others. All of the time I end up with Failed to click element at unknown position error. Once I remove the label overlapping the input field, make it visible and run my spec everything passes. So the issue here is the fact that:
- The input file field has
display: none
property (and by thus is can't be found) - There is a label overlapping the hidden file field (probably)
Is there any way to make Capybara with Capybara-webkit driver handle this delicate situation in some sane way?
Best Answer
With capybara-webkit you can tell the driver to run any javascript you want within the context of the page, so you can write something custom to hack around the visibility issue:
This is pseudo-code, but you should be able to do something similar to make the field visible before you call
attach_file
on it.That said, every time (I at least) do something a little gross like this in my tests it is a good idea to take a quick moment and ask if it is the test or the interface that needs to be fixed. If you're happy with the interface, you should be able to use a small js snippet like the above to get the element visible for your test.
Update:
Support for this behavior has become more widespread and is now standardized in capybara, so you can just:
This shorter version should work with capybara 2.x and recent versions of capybara-webkit or poltergeist, which is a lower-dependency alternative I'm using now.
There is also a partner method,
evaluate_script
:Hope this helps!