ElementNotVisibleError when clicking on imagemap-area using Watir Webdriver

Question

I'm using Watir Webdriver and I am trying to click on an area on a HTML imagemap. The single areas are found (exists? == true) but an error appears telling me that the element is not visible:

> fxdriver.preconditions.visible': Element is not currently visible and so may not be    interacted with (Selenium::WebDriver::Error::ElementNotVisibleError)

The html looks like this:

<map name="Map">
    <area onclick="javascript:Next('1k59elae');" coords="2,5,65,90">
    <area onclick="javascript:Next('kaxfrfzy');" coords="67,5,131,90">
</map>

I try to click like this:

browser = Watir::Browser.new :firefox
map = browser.element(:tag_name => 'map')
area = map.element(:tag_name => 'area')
area.click

Answer 1

I do not have enough understanding of Selenium-Webdriver's implementation of to understand why the exception occurs. Perhaps it is just an oversight or bug - several people seem to have the same problem (see Issue 2354).

However, while using a similar map to yours, I found two workarounds.

Solution 1 - Add shape attribute

I got the same exception as you when the area element did not have a shape attribute. After adding the shape attribute (to the html), the clicking worked as expected. If you have control of the page, I would suggest explicitly specifying the shape:

<map name="Map">
    <area onclick="javascript:Next('1k59elae');" coords="2,5,65,90" shape="rect">
    <area onclick="javascript:Next('kaxfrfzy');" coords="67,5,131,90" shape="rect">
</map>

Solution 2 - Manually fire event

If changing the markup is not an option or does not work, an another solution is to manually fire the onclick event. This is done by using Watir's fire_event method:

map = browser.element(:tag_name => 'map')
area = map.element(:tag_name => 'area')
area.fire_event('onclick')

Aside

The map and area element types are defined in Watir-Webdriver. I would recommend using the map and area methods rather than the generic element method. It is easier to read, less to type and ensures you get access to any element specific methods (though there are none in this case).

The above code could have been simplified to:

map = browser.map
area = map.area
area.fire_event('onclick')