Search Issue Tracker

Fixed in 2020.1

Fixed in 2018.4, 2019.2, 2019.3

Votes

0

Found in

2018.4

2018.4.8f1

2019.2

2019.3

2020.1

Issue ID

1190839

Regression

No

[WebGL] Mouse input is blocked after a few moves when using Edge browser

WebGL

-

How to reproduce:
1. Open attached project ("MouseTestWebGL.zip")
2. Open Build Settings window (File->Build Settings...)
3. Select platform to WebGL
4. Click Build And Run
5. From opened browser window copy page URL and paste it to Edge browser
6. Try to move the ball around

Expected result: Mouse moves only the ball
Actual result: Mouse moves the whole player window

Reproducible with: 2018.4.11f1, 2019.2.10f1, 2019.3.b7, 2020.1.0a9

  1. Response avatar

    Resolution Note (fix version 2020.1):

    Fixed with 2020.1.0a16, backported to 2019.3.0f5, 2019.2.19f1, 2018.4.16f1

Comments (1)

  1. 7cc0501dcfb253637f5643d25fb24cef?d=mm

    jukka_j

    Oct 17, 2019 14:06

    To work around the issue, navigate to

    C:\Program Files\Unity\Hub\Editor\2019.3.0b7\Editor\Data\PlaybackEngines\WebGLSupport\BuildTools\

    and edit UnityLoader.js and find "instantiate:" function with lines

    var Module = gameInstance.Module;
    Module.canvas = document.createElement("canvas");

    after those two lines, put in

    // Disable Microsoft Edge (Chromium-based, tested on 44.17763.771.0) from dragging the whole canvas as an image object when one drags with a mouse over the canvas
    Module.canvas.ondragstart = function(e) { e.preventDefault(); };

    That will remove Edge from attempting to start an image drag on the canvas.

    Another workaround, slightly hacky, but self-contained to user template, is to edit the main html file, find

    <script>
    var gameInstance = UnityLoader.instantiate("gameContainer", "Build/game.json", {onProgress: UnityProgress});
    </script>

    and change it to

    <script>
    var gameInstance = UnityLoader.instantiate("gameContainer", "Build/game.json", {onProgress: UnityProgress});
    function disableEdgeCanvasDrag() {
    var canvas = document.querySelector('canvas');
    if (!canvas) return setTimeout(disableEdgeCanvasDrag, 1000);
    canvas.ondragstart = function(e) { e.preventDefault(); };
    }
    disableEdgeCanvasDrag();
    </script>

Add comment

Log in to post comment

All about bugs

View bugs we have successfully reproduced, and vote for the bugs you want to see fixed most urgently.