<p dir="auto"><strong>Describe the bug</strong></p>
<p dir="auto">We've been hitting this for awhile but finally dug into exactly why it's happening. With the addition of a normal offset bias for shadows (<a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="582838122" data-permission-text="Title is private" data-url="https://github.com/mrdoob/three.js/issues/18915" data-hovercard-type="pull_request" data-hovercard-url="/mrdoob/three.js/pull/18915/hovercard" href="https://github.com/mrdoob/three.js/pull/18915">#18915</a>) normals are <a href="https://github.com/higharc/three.js/blob/892543285102f5f00ea48fa9189b221990f244e1/src/renderers/shaders/ShaderChunk/shadowmap_vertex.glsl.js#L4-L10">required in the vertex shader</a> to compute the fragment position in the shadow frame. However if vertex normals are not available on the geometry then the behavior of this section of code seem unpredictable. On an NVidia GTX 1080 and Intel integrated graphics no shadows are rendered on the mesh with flat shading enabled but shadows are rendered as expected with a Radeon Pro 560. We are using flat shaded materials on some of our models that do not have vertex normals and / or it's too expensive to generate them because our geometry is dynamic.</p>
<p dir="auto"><strong>To Reproduce</strong></p>
<p dir="auto">Steps to reproduce the behavior:</p>
<ol dir="auto">
<li>Go to <a href="https://jsfiddle.net/1dptcou6/" rel="nofollow">https://jsfiddle.net/1dptcou6/</a>.</li>
<li>See that shadows are not displayed on the plane with <code class="notranslate">flatShading</code> enabled and no geometry normals.</li>
<li>Comment out the <code class="notranslate">flatShading: true</code> line on material instantiation and line removing vertex normals.</li>
<li>Shadows are rendered as expected.</li>
</ol>
<p dir="auto"><em><strong>Live example</strong></em></p>
<ul dir="auto">
<li><a href="https://jsfiddle.net/1dptcou6/" rel="nofollow">https://jsfiddle.net/1dptcou6/</a></li>
</ul>
<p dir="auto"><strong>Expected behavior</strong></p>
<p dir="auto">Shadows render normally even when <code class="notranslate">Material.flatShading = true</code> and no vertex normals are available. This worked as expected until r118 onward.</p>
<p dir="auto"><strong>Platform:</strong></p>
<ul dir="auto">
<li>Device: 2017 Microsoft Surface Laptop</li>
<li>OS: Windows 10</li>
<li>Browser: Chrome</li>
<li>Three.js version: r118+</li>
</ul>
<p dir="auto">Also observed with NVidia GTX 1080 GPU on Windows and Intel Integrated Graphics on OSX.</p>
<p dir="auto">cc <a class="user-mention notranslate" data-hovercard-type="user" data-hovercard-url="/users/Oletus/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="https://github.com/Oletus">@Oletus</a></p>
<p dir="auto">Minecraft Education edition has a tool for exporting .GLB files directly from the game, but the resulting GLB file won't receive shadows when displayed using three.js on Windows devices.</p>
<p dir="auto">This issue occurs when using Windows browsers (Firefox, Chrome, Edge), but not when using MacOS browsers (Chrome, Firefox, and Safari). <a href="https://discourse.threejs.org/t/gltf-model-shadows-not-receiving-with-gltfmeshstandardsgmaterial/24112/5" rel="nofollow">See the original thread on discourse.threejs.org for more information</a>.</p>
<p dir="auto"><strong>Steps to reproduce the behavior:</strong></p>
<ol dir="auto">
<li>Go to <a href="https://2cf782ea.minecraft-website.pages.dev/" rel="nofollow">the demo website</a>.</li>
<li>Note that on Windows, the red sphere does not cast a shadow onto the Minecraft model.</li>
</ol>
<p dir="auto"><strong>Live example</strong><br>
<a href="https://2cf782ea.minecraft-website.pages.dev/" rel="nofollow">https://2cf782ea.minecraft-website.pages.dev/</a><br>
Source code can be found in <a href="https://github.com/aufyx/minecraft-website">this GitHub repository</a>.</p>
<p dir="auto"><strong>Expected behavior</strong><br>
The red sphere should cast a shadow onto the 3D model.</p>
<p dir="auto"><strong>Screenshots</strong><br>
Windows users don't see the sphere shadow, its absence circled in red.</p>
<p dir="auto"><a target="_blank" rel="noopener noreferrer nofollow" href="https://camo.githubusercontent.com/dc4753afdcbc682ac2f54960040877812ca2edfa4f3604d60fdd4c6f4bedfe65/68747470733a2f2f617773312e646973636f757273652d63646e2e636f6d2f7374616e6461726431372f75706c6f6164732f74687265656a732f6f726967696e616c2f33582f662f662f666636623635613430396161393139353637376261363039323738366638306630346564333538382e6a706567"><img src="https://camo.githubusercontent.com/dc4753afdcbc682ac2f54960040877812ca2edfa4f3604d60fdd4c6f4bedfe65/68747470733a2f2f617773312e646973636f757273652d63646e2e636f6d2f7374616e6461726431372f75706c6f6164732f74687265656a732f6f726967696e616c2f33582f662f662f666636623635613430396161393139353637376261363039323738366638306630346564333538382e6a706567" alt="Windows Example" data-canonical-src="https://aws1.discourse-cdn.com/standard17/uploads/threejs/original/3X/f/f/ff6b65a409aa9195677ba6092786f80f04ed3588.jpeg" style="max-width: 100%;"></a></p>
<p dir="auto">Mac users see the shadow as expected, as well as the model casting shadows on itself.</p>
<p dir="auto"><a target="_blank" rel="noopener noreferrer nofollow" href="https://camo.githubusercontent.com/3f014d1660e05ce42e933a78deb33c286e7a73179ebd48c2b3365da6390b60c8/68747470733a2f2f617773312e646973636f757273652d63646e2e636f6d2f7374616e6461726431372f75706c6f6164732f74687265656a732f6f726967696e616c2f33582f612f622f616262343532383462356265613361373034333765383365643436633139383631303333646561612e6a706567"><img src="https://camo.githubusercontent.com/3f014d1660e05ce42e933a78deb33c286e7a73179ebd48c2b3365da6390b60c8/68747470733a2f2f617773312e646973636f757273652d63646e2e636f6d2f7374616e6461726431372f75706c6f6164732f74687265656a732f6f726967696e616c2f33582f612f622f616262343532383462356265613361373034333765383365643436633139383631303333646561612e6a706567" alt="Mac Example" data-canonical-src="https://aws1.discourse-cdn.com/standard17/uploads/threejs/original/3X/a/b/abb45284b5bea3a70437e83ed46c19861033deaa.jpeg" style="max-width: 100%;"></a></p>
<p dir="auto"><strong>Platform:</strong></p>
<ul dir="auto">
<li>Device: [Desktop]</li>
<li>OS: [Windows]</li>
<li>Browser: [Chrome, Firefox, Edge]</li>
<li>Three.js version: [r126]</li>
</ul>