<h5 dir="auto">Description of the problem</h5>
<p dir="auto">Migrated to v118.1, gltf model with compressed textures stopped rendering it's material, here's the error:<br>
<a target="_blank" rel="noopener noreferrer nofollow" href="https://user-images.githubusercontent.com/5939063/85894113-6b666f80-b7f4-11ea-9dff-206868d56585.png"><img src="https://user-images.githubusercontent.com/5939063/85894113-6b666f80-b7f4-11ea-9dff-206868d56585.png" alt="image" style="max-width: 100%;"></a></p>
<p dir="auto">I suspect it's related to <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="435197805" data-permission-text="Title is private" data-url="https://github.com/mrdoob/three.js/issues/16287" data-hovercard-type="pull_request" data-hovercard-url="/mrdoob/three.js/pull/16287/hovercard" href="https://github.com/mrdoob/three.js/pull/16287">#16287</a></p>
<p dir="auto">here's what that looks like:<br>
<a target="_blank" rel="noopener noreferrer nofollow" href="https://user-images.githubusercontent.com/5939063/85894177-8cc75b80-b7f4-11ea-8215-92cad5ba1293.png"><img src="https://user-images.githubusercontent.com/5939063/85894177-8cc75b80-b7f4-11ea-8215-92cad5ba1293.png" alt="image" style="max-width: 100%;"></a></p>
<p dir="auto">just to be clear, the black things are the models with compressed textures. Here's a snippet of what those look like in gltf (only relevant parts):</p>
<div class="highlight highlight-source-json notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="{
        &quot;extensionsUsed&quot;:[
		&quot;MSFT_texture_dds&quot;
	],
	&quot;images&quot; : [
        {
            &quot;name&quot; : &quot;diffuse&quot;, 
            &quot;uri&quot; : &quot;props1_512.png&quot;
        },
        {
            &quot;name&quot; : &quot;normal&quot;, 
            &quot;uri&quot; : &quot;props1_n_512.png&quot;
        },
        {
            &quot;name&quot; : &quot;metalness&quot;, 
            &quot;uri&quot; : &quot;props1_arm_512.png&quot;
        },
		{
			&quot;uri&quot;: &quot;props1_512_dtx5.dds&quot;
		},
		{
			&quot;uri&quot;: &quot;props1_n_512_dtx5.dds&quot;
		},
		{
			&quot;uri&quot;: &quot;props1_arm_512_dtx5.dds&quot;
		}
    ],
	&quot;textures&quot; : [
        {
            &quot;source&quot; : 0,
			&quot;extensions&quot;: {
            &quot;MSFT_texture_dds&quot;: {
					&quot;source&quot;: 3
				}
			}
        },
        {
            &quot;source&quot; : 1,
			&quot;extensions&quot;: {
				&quot;MSFT_texture_dds&quot;: {
					&quot;source&quot;: 4
				}
			}
        },
        {
            &quot;source&quot; : 2,
			&quot;extensions&quot;: {
				&quot;MSFT_texture_dds&quot;: {
					&quot;source&quot;: 5
				}
			}
        }
    ],
    &quot;materials&quot; : [
        {
            &quot;name&quot; : &quot;Props1&quot;,
            &quot;normalTexture&quot; : {
                &quot;index&quot; : 1,
                &quot;scale&quot; : 1,
                &quot;texCoord&quot; : 0
            },
            &quot;pbrMetallicRoughness&quot; : {
                &quot;baseColorFactor&quot; : [
                    1, 
                    1, 
                    1, 
                    1.0
                ], 
                &quot;baseColorTexture&quot; : {
                    &quot;index&quot; : 0
                },
                &quot;metallicRoughnessTexture&quot; : {
                    &quot;index&quot; : 2
                }
            }
        }
    ]
}"><pre class="notranslate">{
        <span class="pl-ent">"extensionsUsed"</span>:[
		<span class="pl-s"><span class="pl-pds">"</span>MSFT_texture_dds<span class="pl-pds">"</span></span>
	],
	<span class="pl-ent">"images"</span> : [
        {
            <span class="pl-ent">"name"</span> : <span class="pl-s"><span class="pl-pds">"</span>diffuse<span class="pl-pds">"</span></span>, 
            <span class="pl-ent">"uri"</span> : <span class="pl-s"><span class="pl-pds">"</span>props1_512.png<span class="pl-pds">"</span></span>
        },
        {
            <span class="pl-ent">"name"</span> : <span class="pl-s"><span class="pl-pds">"</span>normal<span class="pl-pds">"</span></span>, 
            <span class="pl-ent">"uri"</span> : <span class="pl-s"><span class="pl-pds">"</span>props1_n_512.png<span class="pl-pds">"</span></span>
        },
        {
            <span class="pl-ent">"name"</span> : <span class="pl-s"><span class="pl-pds">"</span>metalness<span class="pl-pds">"</span></span>, 
            <span class="pl-ent">"uri"</span> : <span class="pl-s"><span class="pl-pds">"</span>props1_arm_512.png<span class="pl-pds">"</span></span>
        },
		{
			<span class="pl-ent">"uri"</span>: <span class="pl-s"><span class="pl-pds">"</span>props1_512_dtx5.dds<span class="pl-pds">"</span></span>
		},
		{
			<span class="pl-ent">"uri"</span>: <span class="pl-s"><span class="pl-pds">"</span>props1_n_512_dtx5.dds<span class="pl-pds">"</span></span>
		},
		{
			<span class="pl-ent">"uri"</span>: <span class="pl-s"><span class="pl-pds">"</span>props1_arm_512_dtx5.dds<span class="pl-pds">"</span></span>
		}
    ],
	<span class="pl-ent">"textures"</span> : [
        {
            <span class="pl-ent">"source"</span> : <span class="pl-c1">0</span>,
			<span class="pl-ent">"extensions"</span>: {
            <span class="pl-ent">"MSFT_texture_dds"</span>: {
					<span class="pl-ent">"source"</span>: <span class="pl-c1">3</span>
				}
			}
        },
        {
            <span class="pl-ent">"source"</span> : <span class="pl-c1">1</span>,
			<span class="pl-ent">"extensions"</span>: {
				<span class="pl-ent">"MSFT_texture_dds"</span>: {
					<span class="pl-ent">"source"</span>: <span class="pl-c1">4</span>
				}
			}
        },
        {
            <span class="pl-ent">"source"</span> : <span class="pl-c1">2</span>,
			<span class="pl-ent">"extensions"</span>: {
				<span class="pl-ent">"MSFT_texture_dds"</span>: {
					<span class="pl-ent">"source"</span>: <span class="pl-c1">5</span>
				}
			}
        }
    ],
    <span class="pl-ent">"materials"</span> : [
        {
            <span class="pl-ent">"name"</span> : <span class="pl-s"><span class="pl-pds">"</span>Props1<span class="pl-pds">"</span></span>,
            <span class="pl-ent">"normalTexture"</span> : {
                <span class="pl-ent">"index"</span> : <span class="pl-c1">1</span>,
                <span class="pl-ent">"scale"</span> : <span class="pl-c1">1</span>,
                <span class="pl-ent">"texCoord"</span> : <span class="pl-c1">0</span>
            },
            <span class="pl-ent">"pbrMetallicRoughness"</span> : {
                <span class="pl-ent">"baseColorFactor"</span> : [
                    <span class="pl-c1">1</span>, 
                    <span class="pl-c1">1</span>, 
                    <span class="pl-c1">1</span>, 
                    <span class="pl-c1">1.0</span>
                ], 
                <span class="pl-ent">"baseColorTexture"</span> : {
                    <span class="pl-ent">"index"</span> : <span class="pl-c1">0</span>
                },
                <span class="pl-ent">"metallicRoughnessTexture"</span> : {
                    <span class="pl-ent">"index"</span> : <span class="pl-c1">2</span>
                }
            }
        }
    ]
}</pre></div>
<h5 dir="auto">Three.js version</h5>
<ul class="contains-task-list">
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> Dev</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox" checked=""> r118</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> ...</li>
</ul>
<h5 dir="auto">Browser</h5>
<ul class="contains-task-list">
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> All of them</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox" checked=""> Chrome</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> Firefox</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> Internet Explorer</li>
</ul>
<h5 dir="auto">OS</h5>
<ul class="contains-task-list">
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> All of them</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox" checked=""> Windows</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> macOS</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> Linux</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> Android</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> iOS</li>
</ul>
<h5 dir="auto">Hardware Requirements (graphics card, VR Device, ...)</h5>
<h5 dir="auto">Description of the problem</h5>
<p dir="auto">Due to the recently added usage of BitmapLoader in GLFTLoader (<a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="628099071" data-permission-text="Title is private" data-url="https://github.com/mrdoob/three.js/issues/19518" data-hovercard-type="pull_request" data-hovercard-url="/mrdoob/three.js/pull/19518/hovercard" href="https://github.com/mrdoob/three.js/pull/19518">#19518</a>), using handlers for specific file formats will be overwritten from the BitmapLoader.</p>
<p dir="auto">In r117 to support basis textures for gltf files you would just need to add</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="var basisLoader = new BasisTextureLoader();
basisLoader.setTranscoderPath( 'js/libs/basis/' );
basisLoader.detectSupport( renderer );
THREE.DefaultLoadingManager.addHandler( /\.basis$/, basisLoader );"><pre class="notranslate"><code class="notranslate">var basisLoader = new BasisTextureLoader();
basisLoader.setTranscoderPath( 'js/libs/basis/' );
basisLoader.detectSupport( renderer );
THREE.DefaultLoadingManager.addHandler( /\.basis$/, basisLoader );
</code></pre></div>
<p dir="auto">This is not possible anymore, since the resolve will be overwritten here: </p><div class="Box Box--condensed my-2">
  <div class="Box-header f6">
    <p class="mb-0 text-bold">
      <a href="https://github.com/mrdoob/three.js/blob/7df06a0e4054247f87a7b5aa555ca97cd6b15662/examples/jsm/loaders/GLTFLoader.js#L2077-L2093">three.js/examples/jsm/loaders/GLTFLoader.js</a>
    </p>
    <p class="mb-0 color-fg-muted">
        Lines 2077 to 2093
      in
      <a data-pjax="true" class="commit-tease-sha" href="/mrdoob/three.js/commit/7df06a0e4054247f87a7b5aa555ca97cd6b15662">7df06a0</a>
    </p>
  </div>
  <div itemprop="text" class="Box-body p-0 blob-wrapper blob-wrapper-embedded data">
    <table class="highlight tab-size mb-0 js-file-line-container" data-tab-size="8" data-paste-markdown-skip="">

        <tbody><tr class="border-0">
          <td id="L2077" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="2077"></td>
          <td id="LC2077" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line"> <span class="pl-k">return</span> <span class="pl-k">new</span> <span class="pl-v">Promise</span><span class="pl-kos">(</span> <span class="pl-k">function</span> <span class="pl-kos">(</span> <span class="pl-s1">resolve</span><span class="pl-kos">,</span> <span class="pl-s1">reject</span> <span class="pl-kos">)</span> <span class="pl-kos">{</span> </td>
        </tr>

        <tr class="border-0">
          <td id="L2078" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="2078"></td>
          <td id="LC2078" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">  </td>
        </tr>

        <tr class="border-0">
          <td id="L2079" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="2079"></td>
          <td id="LC2079" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line"> 	<span class="pl-k">var</span> <span class="pl-s1">onLoad</span> <span class="pl-c1">=</span> <span class="pl-s1">resolve</span><span class="pl-kos">;</span> </td>
        </tr>

        <tr class="border-0">
          <td id="L2080" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="2080"></td>
          <td id="LC2080" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">  </td>
        </tr>

        <tr class="border-0">
          <td id="L2081" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="2081"></td>
          <td id="LC2081" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line"> 	<span class="pl-k">if</span> <span class="pl-kos">(</span> <span class="pl-s1">useImageBitmap</span> <span class="pl-kos">)</span> <span class="pl-kos">{</span> </td>
        </tr>

        <tr class="border-0">
          <td id="L2082" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="2082"></td>
          <td id="LC2082" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">  </td>
        </tr>

        <tr class="border-0">
          <td id="L2083" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="2083"></td>
          <td id="LC2083" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line"> 		<span class="pl-s1">onLoad</span> <span class="pl-c1">=</span> <span class="pl-k">function</span> <span class="pl-kos">(</span> <span class="pl-s1">imageBitmap</span> <span class="pl-kos">)</span> <span class="pl-kos">{</span> </td>
        </tr>

        <tr class="border-0">
          <td id="L2084" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="2084"></td>
          <td id="LC2084" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">  </td>
        </tr>

        <tr class="border-0">
          <td id="L2085" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="2085"></td>
          <td id="LC2085" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line"> 			<span class="pl-s1">resolve</span><span class="pl-kos">(</span> <span class="pl-k">new</span> <span class="pl-v">CanvasTexture</span><span class="pl-kos">(</span> <span class="pl-s1">imageBitmap</span> <span class="pl-kos">)</span> <span class="pl-kos">)</span><span class="pl-kos">;</span> </td>
        </tr>

        <tr class="border-0">
          <td id="L2086" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="2086"></td>
          <td id="LC2086" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">  </td>
        </tr>

        <tr class="border-0">
          <td id="L2087" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="2087"></td>
          <td id="LC2087" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line"> 		<span class="pl-kos">}</span><span class="pl-kos">;</span> </td>
        </tr>

        <tr class="border-0">
          <td id="L2088" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="2088"></td>
          <td id="LC2088" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">  </td>
        </tr>

        <tr class="border-0">
          <td id="L2089" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="2089"></td>
          <td id="LC2089" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line"> 	<span class="pl-kos">}</span> </td>
        </tr>

        <tr class="border-0">
          <td id="L2090" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="2090"></td>
          <td id="LC2090" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">  </td>
        </tr>

        <tr class="border-0">
          <td id="L2091" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="2091"></td>
          <td id="LC2091" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line"> 	<span class="pl-s1">loader</span><span class="pl-kos">.</span><span class="pl-en">load</span><span class="pl-kos">(</span> <span class="pl-en">resolveURL</span><span class="pl-kos">(</span> <span class="pl-s1">sourceURI</span><span class="pl-kos">,</span> <span class="pl-s1">options</span><span class="pl-kos">.</span><span class="pl-c1">path</span> <span class="pl-kos">)</span><span class="pl-kos">,</span> <span class="pl-s1">onLoad</span><span class="pl-kos">,</span> <span class="pl-c1">undefined</span><span class="pl-kos">,</span> <span class="pl-s1">reject</span> <span class="pl-kos">)</span><span class="pl-kos">;</span> </td>
        </tr>

        <tr class="border-0">
          <td id="L2092" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="2092"></td>
          <td id="LC2092" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line">  </td>
        </tr>

        <tr class="border-0">
          <td id="L2093" class="blob-num border-0 px-3 py-0 color-bg-default" data-line-number="2093"></td>
          <td id="LC2093" class="blob-code border-0 px-3 py-0 color-bg-default blob-code-inner js-file-line"> <span class="pl-kos">}</span> <span class="pl-kos">)</span><span class="pl-kos">;</span> </td>
        </tr>
    </tbody></table>
  </div>
</div>
<p></p>
<p dir="auto">I'm getting the following error:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="THREE.WebGLState: TypeError: Failed to execute 'texImage2D' on 'WebGL2RenderingContext': No function was found that matched the signature provided.
    at Object.texImage2D (three.module.js:21828)
    at uploadTexture (three.module.js:22749)
    at setTexture2D (three.module.js:22274)
    at WebGLTextures.safeSetTexture2D (three.module.js:23169)
    at SingleUniform.setValueT1 [as setValue] (three.module.js:17755)
    at Function.WebGLUniforms.upload (three.module.js:18260)
    at setProgram (three.module.js:26406)
    at WebGLRenderer.renderBufferDirect (three.module.js:25441)
    at renderObject (three.module.js:25994)
    at renderObjects (three.module.js:25966)"><pre class="notranslate"><code class="notranslate">THREE.WebGLState: TypeError: Failed to execute 'texImage2D' on 'WebGL2RenderingContext': No function was found that matched the signature provided.
    at Object.texImage2D (three.module.js:21828)
    at uploadTexture (three.module.js:22749)
    at setTexture2D (three.module.js:22274)
    at WebGLTextures.safeSetTexture2D (three.module.js:23169)
    at SingleUniform.setValueT1 [as setValue] (three.module.js:17755)
    at Function.WebGLUniforms.upload (three.module.js:18260)
    at setProgram (three.module.js:26406)
    at WebGLRenderer.renderBufferDirect (three.module.js:25441)
    at renderObject (three.module.js:25994)
    at renderObjects (three.module.js:25966)
</code></pre></div>
<ul dir="auto">
<li><a href="https://rawcdn.githack.com/JohannesDeml/three.js/37a8f7fd309b15900c624252147cbbec70bcc6eb/examples/webgl_loader_gltf_basis.html" rel="nofollow">demo</a></li>
<li><a href="https://github.com/JohannesDeml/three.js/blob/og-dev/examples/webgl_loader_gltf_basis.html">code</a></li>
</ul>
<h5 dir="auto">Three.js version</h5>
<ul class="contains-task-list">
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox" checked=""> Dev</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox" checked=""> r118</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> r117</li>
</ul>
<h5 dir="auto">Browser</h5>
<ul class="contains-task-list">
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> All of them</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox" checked=""> Chrome</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> Firefox</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> Edge</li>
</ul>
<h5 dir="auto">OS</h5>
<ul class="contains-task-list">
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox" checked=""> All of them</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> Windows</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> macOS</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> Linux</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> Android</li>
<li class="task-list-item"><input type="checkbox" id="" disabled="" class="task-list-item-checkbox"> iOS</li>
</ul>
<h5 dir="auto">Hardware Requirements (graphics card, VR Device, ...)</h5>