Add restriction warning when embedding a page with this library in iframe due to security policy for Mozilla Firefox (anti-fingerprinting)

[Utopiah]

Hi, great component.

Unfortunately trying the demo I get WEBGL_UNSUPPORTED whereas https://webglreport.com/?v=1 or v=2 gives me

Linux x86_64 Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:89.0) Gecko/20100101 Firefox/89.0
WebGL GLSL ES 3.00
GeForce RTX 2080 Ti/PCIe/SSE2

and https://get.webgl.org gives me a rotating cube.

[TimvanScherpenzeel]

Hi, thank you for your report. I am unsure why that would be the case and it will require some investigation. My initial thinking is that the WebGL context crashes because it is forced in 'high-performance' mode (which indicates to the browser that it should use the most powerful GPU available on the system). Safari 12 was experiencing similar issues.

https://github.com/pmndrs/detect-gpu/blob/1c3d24dea939f02f70002276a2d89188104f3d83/src/internal/getWebGLContext.ts#L17-L25

[Utopiah]

If there is a page with and without high performance happy to test there and report back.

FWIW I did test with the WebGL cube precisely because sometimes, silently, WebGL craches but that's usually browser-wide, meaning if one tab fails, others do. Here specifically one WebGL tab worked while I had this error.

[TimvanScherpenzeel]

At the moment we don't support overriding this option manually in the constructor so I think this is something we might have to introduce and then I can prepare a way for you so you can test this properly in the near future.

For now could you use possibly https://jdashg.github.io/misc/webgl/low-power.html, this should determine if the powerpreference option is the cause of the crash.

[Utopiah]

{"powerPreference":"low-power"}
  => GeForce RTX 2080 Ti/PCIe/SSE2

{}
  => GeForce RTX 2080 Ti/PCIe/SSE2

{"powerPreference":"high-performance"}
  => GeForce RTX 2080 Ti/PCIe/SSE2

[TimvanScherpenzeel]

Could you try again with https://pmndrs.github.io/detect-gpu/ and if there are any errors thrown in the console report them please (including the rendered snippet)? It could possibly have something to do with iframing in the sandbox.

[Utopiah]

{
  "fps": 403,
  "gpu": "nvidia geforce rtx 2080 ti rev. a",
  "isMobile": false,
  "tier": 3,
  "type": "BENCHMARK"
}

[Gusted]

It could possibly have something to do with iframing in the sandbox.

In that case we could detect it beforehand and log a error/warning.