UserAgent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/58.0.3029.110 Safari/537.36

Steps to reproduce the problem:
1. Open: 
Fiddle with SAPUI5: https://jsfiddle.net/95Loosr0/1/ 
Fiddle with only static html & css (no SAPUI5): https://jsfiddle.net/jm407pfo/1/
2. Click on the “Test” button
3. Click outside the “Test” button
4. Hover over the “Test” button or click on and around the button

What is the expected behavior?
At step 2 the button should be fully highlighted
At step 3 the button shouldn't be highlighted at all
At step 4 the button should be fully highlighted when hovering the button and not highlighted when hovering outside the button.

What went wrong?
There is an inconsistent behavior in both Fiddles:
At step 2: when clicking the button sometimes it is highlighted partially.
At step 3: when clicking outside the button area, sometimes the button itself is highlighted partially.
At step 4: when hovering the button it is partially highlighted.

Did this work before? N/A 

Chrome version: 58.0.3029.110  Channel: stable
OS Version: 10.0
Flash Version: Shockwave Flash 25.0 r0

The issue is reproducible also with version 59.0.3071.61 beta (64-bit) and version 60.0.3101.0 (Official Build) canary (64-bit).
The issue occurs when the button is:
- Within a scrollable container that currently shows a scrollbar
- The scrollable container has a css property “flex-direction: column” (no problem if this property is disabled)
- RTL is enabled