Microsoft Edge behaves strange on start

[PixelPartner]

I encountered the following behaviour on start/init using the EDGE browser with a set of (non-interactive) examples. The canvas stays blank until I manually change the window size that forces a redraw.

Namely: Texture.html and TexturedSphere.html

Your example Webapps with interactivity seem not affected.

[w0rm]

@PixelPartner I think this may be an issue with WebGL in Elm. Can you try https://github.com/elm-explorations/webgl/blob/master/examples/Intersection.elm example and re-report the issue in https://github.com/elm-explorations/webgl?

The first frame is different from the subsequent frames. Because the canvas node has just been created and not attached to the DOM, we need to request animation frame, and draw there.

Maybe there is something weird in the way Edge schedules this request animation frame so that the canvas node is still not in the DOM by the time it is executed.

[PixelPartner]

I tried Intersection.elm in Ellie on Edge without Trouble. Maybe Ellie does ist own Thing here.

[w0rm]

@PixelPartner ok! Then this is something else.

[PixelPartner]

This Ellie of the Texture.elm sample also behaves wrong on the first Frame in Edge and needs a window resize to show content

[ianmackenzie]

Interesting, it seems very dependent on the exact Edge version/PC:

• I could reproduce the bug on Edge version 44 on my desktop
• I could not reproduce it on Edge version 42 on my laptop
• Updating to the new Chromium-based Edge on my desktop also fixed it

@PixelPartner which version of Edge have you been testing with? Does everything work OK with other browsers (Chrome, Firefox) on the same machine?

[ianmackenzie]

I did a bit more testing and it seems like the issue is related to how those examples have code like

case model of
    Loading ->
        -- Waiting for texture to load
        [ Html.text "Loading" ]

    Loaded texture ->
        -- Texture loaded successfully, render a scene using it
        [ Scene3d.unlit { ... } ]

which means that some non-<canvas> HTML element is later replaced by an actual <canvas> element. If instead the loading case renders an empty scene instead (e.g. Scene3d.unlit with no entities) then everything works. @PixelPartner can you confirm that this is the case for you as well?

[PixelPartner]

I was just running your example scenes for the first time in Edge on a new machine. Have not encountered it in my own WebApps. And I honestly did not find an About Box or version string in Edge, I'm new to as well. This specific PC has Firefox installed, but it did not launch.

[PixelPartner]

Got arround to reinstall FireFox. No strange behaviour in FF. The Edge-Logo is the old one, solid blue "e". Will install the latest and report back soon.

[PixelPartner]

Latest public Edge (Chromium?) works fine also for me.

[ianmackenzie]

This looks like a general WebGL issue, not specific to elm-3d-scene - I made a pure WebGL SSCCE which reproduces the problem, so I've logged it as https://github.com/elm-explorations/webgl/issues/29.

I'm not actually sure if this is really an elm-explorations/webgl issue, a core Elm virtual DOM thing, or just a bug in Edge...if the latter, any thoughts on anything elm-3d-scene could do to work around the problem or otherwise try to avoid it? If not, I'm inclined to close this issue.

The workaround seems to be to always render a WebGL scene, even while waiting to load textures/models etc. (even if it's just a dummy scene with no entities). So perhaps there could be something like

Scene3d.empty : 
    { dimensions : ( Quantity Int Pixels, Quantity Int Pixels )
    , background : Background coordinates
    } 
    -> Html msg

to make this easier/cleaner. Once there's proper support for overlaying 2D graphics on a 3D scene, then maybe there could also be an option to overlay some sort of status text etc.

[PixelPartner]

Since this affects only some versions of the now outdated "old" Edge and it is not specific to this project, let's close the issue.