Steps to reproduce the problem:
1. First you need a high resolution monitor (e.g. iMac 5K)
2. Start Safari and maximize your window
3. Go to http://threejs.org/examples/webgl_interactive_cubes.html
What is the expected behavior?
When you position your mouse exactly over a cube, it should be highlighted.
What went wrong?
On ultrad HD resolutions the application is not able to determine the correct cube. This problem only occurs when Safari exceeds a specific resolution. On smaller monitors (e.g.FullHD), everything works fine.
Did this work before?
I assume that Webkit must be limiting the maximum drawing buffer width/height which leads to incorrect canvas sizes.
My recommendation is to change the backbuffer limit from e.g. 4k per dimension to 4k x 4k total area like Blink does (see https://bugs.chromium.org/p/chromium/issues/detail?id=445542)
This problem is becoming increasingly critical as more users have high-resolution displays. Without any workarounds, interactive 3D applications like the mentioned three.js demo are unusable in combination with a large canvas.
Dup of bug 178223?
Yes. Although your mentioned bug is far newer than this post.
Also consider the fix of Blink (https://bugs.chromium.org/p/chromium/issues/detail?id=445542).
*** This bug has been marked as a duplicate of bug 178223 ***