Reproduced on gmail.com

Deleted: gmail.png 41.5 KB

	gmail.png 41.5 KB View Download

I was able to repro this in a minimal HTML/JS sample. 
There are two viewports. The main viewport is the size of the browser window. When this is occluded, there is another outer viewport that clips this. When you are scrolling, the outer smaller viewport is scrolled first, and then scroll is applied to the inner larger viewport. 

Generally, for autocomplete hoverboxes, CSS fixed-positioning is used, which sets an elements position relative to the viewport. In the case of keyboard occlusion, this will be the smaller outer viewport. However, the JS offset fields are based on the larger outer viewport. When the top of both viewports are lined up, then this bug does not occur. So in gmail, if you scroll to the top while the keyboard is loaded, the autocomplete aligns correctly. In tall pages that have vertical scroll, scrolling down, and then up will also fix it. 

I need to investigate more how the offsetTop/scrollTop is reported to the DOM/JS as the fix for this is probably always making sure this value is relative to the top left corner of the outer viewport as opposed to the occluded inner one. 

I now notice that absolute positioning is used in gmail (not fixed positioning), and after tracing through the source, it seems like getBoundingClientRect() is where the ideal fix should be and should return appropriate values relative to the occluded larger viewport. 

blakeo@ is no longer working on virtual keyboard. Marking as available.