Clicking on image using Capybara in cucumber

Question

I am attempting to click an image with Capybara for a Cucumber test, but cannot find a way to get Capybara to see the image as a link.

My code for the image is:

link_to(image_tag('ico_edit_16.png', alt: 'Edit', class: 'icon16', title: "Edit #{qualification.title}"), edit_qualification_path(qualification))

Which shows up as

<a href="/qualifications/1/edit">
    <img class="icon16" title="Title" src="/images/ico_edit_16.png?1279303992" alt="Edit">
</a>

in the html, and I have been unable to find a good way to use capybara to click the image.

Any suggestions?

Answer 1

This should work:

find('img.icon16').click

Alternatively to lookup based on the alt text:

find("img[alt='Edit']").click

Answer 2

I had a problem when the image was not recognized because there were multiple elements hidden in the page with the same id. Try using something like this.

with_scope("#modal_window") do
  find("#close").click

Answer 3

This step solves the problem for me. You have to use xpaths to match an element then find its parent. A caveat, though, is that this might not be synchronized:

When /^I follow the link containing(?:| an| a| the|) "([^\"])" image(?:| within "([^\"])")$/

do |*args|
  alt = args[0] ; within = args[1]

  outer = find(within)
  outer.find(:xpath, "//img[@alt='#{alt}']/..").click
end