model viewer crashing on IOS

[Tommy-Huls]

Description

GLBs don't seem to be loading anymore on IOS. This was never an issue until yesterday/today.
Chrome does still sometimes load the model, but not always. Safari never.

Sometimes it quickly shows a light blue screen, but then it seems like it crashes.

dev tools through Safari show the below:

[Error] WebGL: context lost.
	getContext
	Tt (model-viewer.min.js:17:427081)
	io (model-viewer.min.js:17:427511)
	Bf (model-viewer.min.js:798:756)
	singleton (model-viewer.min.js:798:1454)
	h (model-viewer.min.js:1092:27764)
	d (model-viewer.min.js:1092:20040)
	y (model-viewer.min.js:1092:8716)
	s (model-viewer.min.js:1092:6639)
	s (model-viewer.min.js:1092:5398)
	s (model-viewer.min.js:1092:2787)
	r (model-viewer.min.js:1092:480)
	define
	Module Code (model-viewer.min.js:1092:31837)
[Warning] TypeError: null is not an object (evaluating 't.getShaderPrecisionFormat(t.VERTEX_SHADER,t.HIGH_FLOAT).precision') — model-viewer.js:15391 (model-viewer.min.js, line 798)
[Error] TypeError: undefined is not an object (evaluating 'this.threeRenderer.xr')
	Hg (model-viewer.min.js:728:2069)
	Bf (model-viewer.min.js:798:1084)
	singleton (model-viewer.min.js:798:1454)
	h (model-viewer.min.js:1092:27764)
	d (model-viewer.min.js:1092:20040)
	y (model-viewer.min.js:1092:8716)
	s (model-viewer.min.js:1092:6639)
	s (model-viewer.min.js:1092:5398)
	s (model-viewer.min.js:1092:2787)
	r (model-viewer.min.js:1092:480)
	define
	Module Code (model-viewer.min.js:1092:31837)
[Error] Unhandled Promise Rejection: TypeError: undefined is not an object (evaluating 'e.getFieldOfView')
	(anonymous function) (model-viewer.min.js:1092:16774)
	(anonymous function) (model-viewer.min.js:1092:16976)
	(anonymous function) (model-viewer.min.js:1011:5994)
	(anonymous function) (model-viewer.min.js:1011:2413)
[Log] THREE.WebGLRenderer: Context Lost. (model-viewer.min.js, line 17)

Live Demo

https://a.rendered.ar/api/EmbedTrigger?uuid=8348-G&rda=123456

Version

• model-viewer: v3.5.0

Browser Affected

• Chrome IOS
• Safari IOS

OS

• iOS

[Tommy-Huls]

This also happens if I load the GLB from the editor on mobile.

And with all other GLB files.

[Tommy-Huls]

Latest beta update on IOS seems to have fixed it for me, however I can't expect my clients and their customers to also have the latest update...

[elalish]

Can you be specific about which devices and OS/browser versions are producing this behavior? Do you see the behavior on our modelviewer.dev examples pages as well? @AdaRoseCannon any known WebGL context loss bugs recently in iOS Safari?

[AdaRoseCannon]

If they could file a Feedback Assistant report it would help a lot. I’m not an iOS engineer so couldn’t say for sure.

[henrik-dons]

For me the viewer also crashes on ModelViewer version 3.5.0 on iPhone 12 iOS 17 Safari browser

Live product page: https://pedocpower.com/product/5x5-hinge-top-with-base/
3D model url: https://pedocpower.com/wp-content/uploads/2024/05/5P18-C-HT-BRZ-140_OPENED.GLB

Hope this helps for debugging purposes.

[AdaRoseCannon]

Please file a Feedback Assistant request then if you can let me know the number I'll keep an eye on it.

[Filyus]

iPhone XsMax iOS 17.6.1, same issue on the demo page. Also I have such error on the custom Three.JS project with a GLTFLoader.

[Filyus]

The problem with iOS itself, some versions hungs on the new WebGLRenderer(), or more exactly on the getContext() call:
https://bugs.webkit.org/show_bug.cgi?id=264684

With iOS 18.1 same issue, but this happens after large canvas creation. You need to restart iPhone to try another canvas resolution.

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/canvas#maximum_canvas_size

The exact maximum size of a element depends on the browser and environment. While in most cases the maximum dimensions exceed 10,000 x 10,000 pixels, notably iOS devices limit the canvas size to only 4,096 x 4,096 pixels.