question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

ImageBitmapLoader (GLTFLoader) fails in Firefox ESR

See original GitHub issue

Describe the bug

GLTF models don´t load in Firefox ESR due to lack of support for ImageBitLoader.

To Reproduce

  1. Install Firefox ESR (version number 91) from https://www.mozilla.org/en-GB/firefox/all/#product-desktop-esr
  2. Open https://www.geofront.eu/tmp/ironmen_bugreport_fail
  3. GLTF model is not being loaded. See also error: THREE.GLTFLoader: Couldn´t load texture tex.webp

Code

The problem lies in the removal of a check for Firefox to avoid usage of ImageBitmapLoader (compare r130). The most recent Firefox version works fine with this - but Firefox ESR (used internally in the museum that has published this webpage) is not yet capable of handling ImageBitmapLoader. We therefore suggest an additional check for Firefox and its ESR-channel version number 91 in this code snippet of GLTFLoader.js:

 if ( typeof createImageBitmap !== 'undefined' && /^((?!chrome|android).)*safari/i.test( navigator.userAgent ) === false  && /Firefox\/91/.test( navigator.userAgent ) === false) {
this.textureLoader = new ImageBitmapLoader( this.options.manager );
} else {
this.textureLoader = new TextureLoader( this.options.manager );
}

Note: This will have to be extended to later Firefox ESR versions (we did not track down the exact version where Firefox´ ImageBitmapLoader starts working).

Live example

Expected behavior

The GLTF should have loaded and displayed, just like in Firefox 99.

Platform:

Issue Analytics

  • State:closed
  • Created a year ago
  • Comments:7 (3 by maintainers)

github_iconTop GitHub Comments

2reactions
Mugen87commented, Apr 18, 2022

Let’s see if @donmccurdy and @mrdoob are happy with the PR^^.

0reactions
gernotzieglercommented, Apr 18, 2022

@Mugen87 You are of course welcome to remove the detection code from three.js whenever you like; I only needed it for the museum and will keep it around in pages we create for them until they have upgraded their systems.

Read more comments on GitHub >

github_iconTop Results From Across the Web

GLTFloader not working in Firefox, Opera, Edge - three.js forum
some variable is not defined. what can i do about this, i am only a newby in three.js. the Firefox console says: TypeError:...
Read more >
Three.js GLTFLoader cant load gltf files on my computer
Web browsers cannot load files like images or models from local disk (unless you disable security restrictions). To get around this you must ......
Read more >
css transform: translate and scale not working in firefox - Retejs/Rete
ImageBitmapLoader (GLTFLoader) fails in Firefox ESR, 7, 2022-04-16, 2022-07-19 ; pyqt4 runtime hook uses qt plugins from other folders, 1, 2022-01-31, 2022-08-22.
Read more >
Not able to set ImageBitmapLoader options in GLTFLoader
Why do you need to configure flipY in the first place? GLTFLoader uses ImageBitmapLoader such that the textures are automatically displayed ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found