How do I prevent errors when clicking an element on the page but element is not clickable?

Question

I am writing a test for an element on the page, but when I use pageObject.click("@MyElement) on the element, sometimes it throws this error:

Element <i class="...">...</i> is not clickable at point (25, 299). Other element would receive the click: <div class =...></div>

I have tried using pageObject.waitForElementVisible("@selector"), but it does not work.I don't know why this only happends sometimes, while other times the tests don't fail. Any ideas?

Answer 1

Sometimes there's an overlay element which is invisible and blocking the 'path' to the element you want to click.

In my case the following works great:

browser.moveToElement(using, element, 1, 1);
browser.mouseButtonClick(0);