offset() can be inaccurate when pinch-zoomed

Bug Reports:

• What do you expect to happen?
  offset() should return offset from document origin
• What actually happens?
  On some browsers, it can be off when pinch-zoomed
• Which browsers are affected?
  Edge, possibly Safari in the future.

Description

Open the console and click/tap on the input box. Now pinch-zoom into the page, scroll to the very top, then scroll back down to the input box and tap it. The output should always be the same.

See https://bugs.webkit.org/show_bug.cgi?id=170981 for some background and https://developers.google.com/web/updates/2017/09/visual-viewport-api for the details.

The issue is that offset() is adding getBoundingClientRect (which is relative to the layout viewport) to window.pageX|YOffset which is relative to the visual viewport.

Note: Chrome recently made pageYOffset relative to the layout viewport so this isn't an issue there.

Link to test case

http://jsbin.com/vucayumeta

Start with the offset() implementation and reproduce the behavior using the linked JSBin test case in Edge with pinch-zoom enabled. Read the linked WebKit bug and Visual Viewport API background first. Done means offset() consistently returns the same document-origin offset after zooming and scrolling in the affected browsers.