IE11 and Edge reduce scroll dimension

Hi,

I’m having a problem with Vaadin 7.6.4. I’m not the developer of the original code and not a Vaadin expert either but I have to fix this.

The problem only happens with IE11 and Edge but everything is fine with Chrome and Firefox.

So we have a form with a thumbnail view, a main document view and a toolbar. The views have scrollbars.

The original developer has created an event handling function

public void viewportChanged(int scrollPosition, int viewportHeight, int viewportWidth)

This function seems to be wired with the client side code so when a breakpoint hits I only see invoke calls:

viewportChanged:72, LazyPager$1 (com.xxxx.lazypager)
invoke0:-1, NativeMethodAccessorImpl (sun.reflect)
invoke:62, NativeMethodAccessorImpl (sun.reflect)
invoke:43, DelegatingMethodAccessorImpl (sun.reflect)
invoke:498, Method (java.lang.reflect)
applyInvocation:158, ServerRpcManager (com.vaadin.server)
...

So when we have a large document like 2652 pages the scroll position is set to the last page correctly:

scrollPosition: 3215663

but then in IE11 and edge we get another callback that sets the scroll position to about half:

scrollPosition: 1532704

so jumping to page 2652 first jumps there but then jumps back to page 1265. The thumb after this is at the very bottom so one can not scroll further down. It’s as if the scrollbar height gets reduced. This happens only to documents of a certain number of pages but I don’t know the threshold.

On the attachement of IE11 you can see that the page stands on page 1265 of 2652 but the thumb is at the very bottom on the main view but not on the thumbnail view. On the chrome attachement you see that everything is fine. Very same code at the very same time.

This second call and reduction of scrollbar dimension just never happens on Chrome or Firefox. Is this a known problem which is fixed in later versions? Any other hints how I could solve this problem?

17462699.png
17462702.png

I think you are hitting the inherent height limitation of IE11 itself.

Here is some discussion about the topic https://stackoverflow.com/questions/7719273/determine-maximum-possible-div-height

“I’ve tested with Chrome and IE 11 and came up with the following numbers: - Chrome is fine until 25,165,824px - IE 11 has problems at 1,533,917px”

Thanks for your answer. That’s a very valuable lead. I will look into it.