Failed to create WebGL context: WebGL creation failed

[janwendt]

maplibre-gl-js version: 3.0.1

browser: Firefox 113.0.2

Steps to Trigger Behavior

1. Run the Quickstart: https://maplibre.org/maplibre-gl-js-docs/api/#quickstart on Windows Server 2022

Link to Demonstration

https://maplibre.org/maplibre-gl-js-docs/api/#quickstart

Expected Behavior

The Map should load.

Actual Behavior

On my Desktop PC everything works as expected.
Since 3.0.0 (with 2.4.0 everything works fine) im getting the following error on my Windows Server 2022 in the Firefox console and the map is not shown its just blank (AllowWebgl2 is set to true in about:config that is not the problem):

WebGL warning: <Create>: AllowWebgl2:false restricts context creation on this system.

Failed to create WebGL context: WebGL creation failed: 
* AllowWebgl2:false restricts context creation on this system. ()

Uncaught Error: {"requestedAttributes":{"alpha":true,"stencil":true,"depth":true,"failIfMajorPerformanceCaveat":false,"preserveDrawingBuffer":false,"antialias":false},"statusMessage":"WebGL creation failed: \n* AllowWebgl2:false restricts context creation on this system. ()","type":"webglcontextcreationerror","message":"Failed to initialize WebGL"}
    _setupPainter https://unpkg.com/maplibre-gl@latest/dist/maplibre-gl.js:35
    Map https://unpkg.com/maplibre-gl@latest/dist/maplibre-gl.js:35
    <anonymous> file:///C:/Users/jwendt/OneDrive - IW/Projekte/Regionale Preise/MapLibre/test.html:10

With Chrome everything works as expected!

[HarelM]

The error is pretty descriptive to me:
WebGL warning: <Create>: AllowWebgl2:false restricts context creation on this system.
Version 3.0 uses webgl2 and not webgl(1).

[janwendt]

But then it shouldn't work in Google Chrome either, right? But it does.

[HarelM]

They have independent configuration and implementation, I've seen it work the other way around too where FF works and chrome doesn't.

[janwendt]

Okay. Fallback to webgl1 is not available? So I have to continue with 2.4.0 to support those devices?

[tpneumat]

iOS 13.5 also fails. I don't think we can get rid of webgl1 altogether yet can we?

https://caniuse.com/?search=webgl2

[tpneumat]

Came up with a fairly simple way to handle this by pulling in the old lib dynamically on fail..not my exact code below but this idea is working for me.

let mapobj;
let mapconf = { //your config };
let loadScript=(url)=>{
    return new Promise((resolve, reject) => {
        var script = document.createElement('script')
        script.type = 'text/javascript';
        script.src = url;
        script.onload = () => {
            resolve()
        }
        script.onerror = () => {
            reject('cannot load script '+ url)
        }
        document.body.appendChild(script)
    });
}
try{
   mapobj = new maplibregl.Map(mapconf);
} catch(e){
    if(e.message.includes('Failed to initialize WebGL')) {
        console.log('webgl2 load failed, downgrading map lib');
        await loadScript('https://unpkg.com/maplibre-gl@2.4.0/dist/maplibre-gl.js');
        mapobj = new maplibregl.Map(mapconf);
    }
}

[birkskyum]

Closed in favor or #2653

[birkskyum]

@janwendt , @tpneumat Thanks for speaking up. WebGL1 fallback added in newly release v3.1.