Selenium element is hidden behind floating header

Question

The Selenium webdriver locator always puts elements on top of the page if scrolling is needed, but it wont take into account a floating header. At the moment I created a workaround with

Actions actions = new Actions(this.webdriver);
actions.sendKeys(Keys.ARROW_UP).perform();

Isnt there a nicer solution to tell the webdriver to center an element in the middle of the screen instead or with a fixed distance to the top?

The orange part is from the button the blue part is the header:

hidden button in orange

Answer 1

In my case, I choose to hide that floating element.

top = dr.find_element_by_xpath('//div[@node-type="top_all"]')
dr.execute_script("arguments[0].setAttribute('style','display:none')", top)

After that, move to the element I want, I can even add an offset.

Answer 2

Bring the element into view using javascript. Here is a possible solution:

1. Bring the element into the view port using selenium api.
2. Use javascript to figure out if the element is obstructed by another element, (floating header / footer etc...).
3. Use javascript to scroll to the middle of the view port.

See the javascript utility class I created here: https://github.com/gterre/stuff

usage...JavascriptUtils.bringIntoView(WebElement element);

I'm sure you can modify the script to your needs.