Babylon.js freezes on mobile (iphone) upon 2nd touch when using Chrome browser

Bugs
1

Babylon Version: 5.0.0-alpha.16 (WebGL)
Device: iPhone 11
iOS: 14.4.2
Browser: Chrome 87.0.428.77

Steps to reproduce:

  1. Navigate to https://playground.babylonjs.com
  2. Touch the screen and drag around to rotate the camera, then release your finger.
  3. Touch a 2nd time to attempt to drag and rotate the camera and discover that the camera no longer rotates. The window is now unresponsive.
  4. Additionally: Attempt to refresh the page by clicking on the url bar at the top and see that the bar progress bar gets stuck and never finishes. It seems even reload is unresponsive and not even the back button on the browser history works.

The only way to exit is to close the tab.

I also tested in mobile safari and mobile firefox and they seem to be fine, it’s only Chrome that this happens with at this time.

1 Like
2

I was having the same issue as well, after the rollout of iOS 14 chrome has been behaving drastically bad

1 Like
3

Probably something they will fix soon (ish)

4

Is there a way I can switch the Babylon version on the playground back to 4.2 to test on mobile? On desktop there is a drop down menu, but on mobile I don’t see an obvious way to try a previous build version.

5

I can confirm that this issue does not happen on v4.2. I have a project that was running off of preview.babylonjs.com/babylon.js (5.0.0 alpha 18) and could reproduce the issue. After replacing that URL with cdn.babylonjs.com/babylon.js which runs the last stable version the freezing issue does not occur.

6

bringing @Cedric to the mix :wink:

7

Let me take a look

8

Hey @owen
Your issue is still on my radar. I’m just a little busy. My plan is to take a look this week. I’ll keep you posted.

9

Thank you sir!

As a side note: The other thing I noticed (might not be totally related) as a discrepancy between 4.2 and 5.0.0 alpha 18 for chrome (this time on desktop), was that bringing focus to the canvas on any keypress:

var setFocus = function (event) {
  const canvas = document.getElementById("roomCanvas")
  canvas.focus();
  window.removeEventListener('keydown', setFocus, false);
}
window.addEventListener("keydown", setFocus, false);

As a technique for allowing arrow keys to move the camera without the user having to click on anything with the mouse, does not work on 4.2, but works on 5.0.0 alpha 18 using Chrome, but does work on desktop for firefox and safari on a macbook pro.

10

@owen

Wow! I think I have seem exactly the same behaviour you described in 2-4. It always happens on Chrome. I believe I also reproduced it on Safari sometimes. Definitely when I add the app to Home Screen and then launch it in full screen mode.

Do you have any updates?

Device: iPhone 8
iOS: 14.7