Sample 3D platformer not work in HTML5 (black screen)

Hi guys I’m new to Defold, using version 1.13.1

I downloaded the sample-3d-platformer from GitHub but building a regular desktop version was a real struggle so from start I kept getting 5 errors in the console. The only thing that fixed it was completely deleting the context section from game.appmanifest in the win32 parts (wtf? what a great start :smiling_face_with_tear: )
Okay, after that I tried building for the web but just get a black screen.
Does anyone know what might be causing this? Is it all down to the shadow shaders? If so, how do I get them to work on the web?

Why? What happened? Didn’t it work to do Project->Build?

Also which version of Defold are you using? And which OS?

1 Like

You need to look for an error in the shader.
It might be an int instead of a float (vec2(1) instead of vec2(1.0)).

ERROR:GAMESYS: Failed to create shader program '/shader_1810231087805793281.spc':

Running 1.13.1 on Win10.
Just downloaded a sample project, hit Build and got errors​:man_shrugging:t2:

It does look like that but all the types and variables seem correct to me for now. I know nothing about shaders and DeepSeek I asked can’t pinpoint the real problem either.
Guess is that custom rendering and shadows just aren’t web-friendly but is that even true? ‘Pixel Line Platformer’ builds for web just fine and no issues but the ‘3D Third-Person Playground’ gives me the same trouble - black screen and errors (and that one has shadows too)

On windows this is app.manifest problem. defold 1.13+ has some issues with older manifests. I have experienced this before

the easiest two options are…

Option1

delete the file “game.appmanifest”

then open game.project, scroll down to native extension setting and delete the reference to the file.

Option2

delete the file “game.appmanifest”

then select new and create a new app manifest called “game” in the exactly the same directory as the original film. So effectively replacing the original file with a freshly created manifest

Both of these worked for me and i was able to run the project

This one? GitHub - defold/sample-3d-platformer · GitHub

I’m surprised this is the case. @Pawel can you please take a look?

Here are the setting from the downloaded zip for windows

 x86-win32:
    context:
      excludeLibs: [libphysics, libbox2d_defold, script_box2d_defold, librecord, vpx, libdecoder_wav, libliveupdate, libimage]
      excludeSymbols: [ScriptBox2DExt, AudioDecoderWav, ResourceTypeWav, ScriptImageExt, ScriptTypesExt]
      symbols: [AudioDecoderOpus, ResourceTypeOpus]
      libs: [libphysics_3d.lib, librecord_null.lib, libdecoder_opus.lib, libopus.lib, libliveupdate_null.lib, libimage_null.lib]
      linkFlags: []
  x86_64-win32:
    context:
      excludeLibs: [libphysics, libbox2d_defold, script_box2d_defold, librecord, vpx, libdecoder_wav, libliveupdate, libimage]
      excludeSymbols: [ScriptBox2DExt, AudioDecoderWav, ResourceTypeWav, ScriptImageExt, ScriptTypesExt]
      symbols: [AudioDecoderOpus, ResourceTypeOpus]
      libs: [libphysics_3d.lib, librecord_null.lib, libdecoder_opus.lib, libopus.lib, libliveupdate_null.lib, libimage_null.lib]
      linkFlags: []

If i create a new manifest ticking every option as per the original

x86-win32:
    context:
      excludeLibs: [physics, libbox2d_defold, script_box2d_defold, decoder_wav, liveupdate, image]
      excludeSymbols: [ScriptBox2DExt, AudioDecoderWav, ResourceTypeWav, ScriptImageExt, ScriptTypesExt]
      symbols: [AudioDecoderOpus, ResourceTypeOpus]
      libs: [physics_3d, decoder_opus, libopus, liveupdate_null, image_null]
      linkFlags: []
  x86_64-win32:
    context:
      excludeLibs: [physics, libbox2d_defold, script_box2d_defold, decoder_wav, liveupdate, image]
      excludeSymbols: [ScriptBox2DExt, AudioDecoderWav, ResourceTypeWav, ScriptImageExt, ScriptTypesExt]
      symbols: [AudioDecoderOpus, ResourceTypeOpus]
      libs: [physics_3d, decoder_opus, libopus, liveupdate_null, image_null]
      linkFlags: []

if you compare the libs

old: libs: [libphysics_3d.lib, librecord_null.lib, libdecoder_opus.lib, libopus.lib, libliveupdate_null.lib, libimage_null.lib]

new: libs: [physics_3d, decoder_opus, libopus, liveupdate_null, image_null]

I have had a similar issue before see Defold 1.13.0 BETA - #66 by Mathias_Westerdahl . In version 1.13, some of the library names were changed, but if you have a 1.12 manifest, it keeps the old names and doesn’t update them to the new ones. Mathias recommended the best strategy was to recreate the manifest

2 Likes

Yeah it’s definitely a “.lib” path issue I figured that out too
But I actually managed to get a build working by completely clearing the appmanifest for windows section like this:

x86-win32:
context: {}
x86_64-win32:
context: {}

I tried removing the manifest from the project and from the settings but it still wouldn’t build. Haven’t tried recreating the file from scratch but I think that might actually do the trick.

1 Like

Yes that’s the one.
I’m really curious is this a bug in the shadow shaders / custom rendering or is it something on my side? Again neither this project nor the other 3D sample (GitHub - defold/sample-third-person-playground: Third person playground with a player controlled character and interactive gameplay elements · GitHub) with shadows and custom rendering works on the web, it crashes right after build and load. Meanwhile the other project builds with no issues at all (GitHub - defold/sample-pixel-line-platformer: Defold sample project for a platformer game. · GitHub)

Could you please create an issue on GitHub? We need to fix this ASAP.

1 Like

i’ve created an issue on the main defold github. The issue has been already raised on the sample project

I get the black screen too.

The dev console says that

dmloader.js:912 ERROR:GAMESYS: Failed to create shader program ‘/shader_1810231087805793281.spc’:

printErr @ dmloader.js:912
dmloader.js:911 WARNING:RESOURCE: Unable to create resource: /shader_1810231087805793281.spc: FORMAT_ERROR

dmloader.js:911 WARNING:RESOURCE: Unable to create resource: /shadow_mapping/materials/mid/diffuse.materialc: FORMAT_ERROR

so it is failing to compile/process a shader.

if i switch the manifest to webGPU; it won’t even build

\Users\andre\AppData\Local\Temp\shader_-2494035481125388950.spc.frag1831074528983781406.glsl
ERROR: C:\Users\andre\AppData\Local\Temp\shader_-2494035481125388950.spc.frag1831074528983781406.glsl:266: ‘directional_shadow_visibility’ : no matching overloaded function found
ERROR: C:\Users\andre\AppData\Local\Temp\shader_-2494035481125388950.spc.frag1831074528983781406.glsl:266: ‘’ : missing #endif
ERROR: C:\Users\andre\AppData\Local\Temp\shader_-2494035481125388950.spc.frag1831074528983781406.glsl:266: ‘’ : compilation terminated
ERROR: 3 compilation errors. No code generated.

ERROR: Linking fragment stage: Missing entry point: Each stage requires one entry point

SPIR-V is not generated for failed compile or link

diffuse.fp in the mid folder does call “shadowed_diffuse_lambert” which in turn calls “directional_shadow_visibility”. This may provide some help in trying to determine where the issue may be occurring in the html5 build.

1 Like

оmg thanks for trying! at least now we know for sure that the bug really does exist

Thanks for reporting, I’m looking into this :wink:

1 Like

I made a quick fix for a suspected root cause, but I need to test it further (if you could check if there’s still issue with it - It’s up on a branch fix-shadowmapping, PR: Fix for shadow mapping - avoid passing shadow sampler through shader … by paweljarosz · Pull Request #4 · defold/sample-3d-platformer · GitHub)

@Pawel I downloaded the fix version but the HTML5 build still has the same console errors unfortunately

Here is the full information copied from the browser console for the fixed version:

index.html:1 <meta name="apple-mobile-web-app-capable" content="yes"> is deprecated. Please include <meta name="mobile-web-app-capable" content="yes">
:59099/favicon.ico:1  Failed to load resource: the server responded with a status of 404 (Not Found)
dmloader.js:914 Running...
dmloader.js:911 INFO:DLIB: Log server started on port 0

dmloader.js:911 INFO:GRAPHICS: Installed graphics device 'ADAPTER_FAMILY_OPENGL'

dmloader.js:911 INFO:ENGINE: Defold Engine 1.13.1 (574678c)

3DPlatformerStarterKit_wasm.js:1         Made with Defold            https://www.defold.com
dmloader.js:911 INFO:PROFILER: Skipped ProfilerJS profiler due to setting profiler.performance_timeline_enabled

dmloader.js:911 INFO:DLIB: Writing log to: ./log.txt

dmloader.js:911 INFO:GRAPHICS: Device: OpenGL

dmloader.js:911 INFO:GRAPHICS: Renderer: WebKit WebGL

dmloader.js:911 INFO:GRAPHICS: Version: OpenGL ES 3.0 (WebGL 2.0 (OpenGL ES 3.0 Chromium))

dmloader.js:911 INFO:GRAPHICS: Vendor: WebKit

dmloader.js:911 INFO:GRAPHICS: Extensions:

dmloader.js:911 INFO:GRAPHICS:   EXT_clip_control

dmloader.js:911 INFO:GRAPHICS:   EXT_color_buffer_float

dmloader.js:911 INFO:GRAPHICS:   EXT_color_buffer_half_float

dmloader.js:911 INFO:GRAPHICS:   EXT_conservative_depth

dmloader.js:911 INFO:GRAPHICS:   EXT_depth_clamp

dmloader.js:911 INFO:GRAPHICS:   EXT_disjoint_timer_query_webgl2

dmloader.js:911 INFO:GRAPHICS:   EXT_float_blend

dmloader.js:911 INFO:GRAPHICS:   EXT_polygon_offset_clamp

dmloader.js:911 INFO:GRAPHICS:   EXT_texture_compression_bptc

dmloader.js:911 INFO:GRAPHICS:   EXT_texture_compression_rgtc

dmloader.js:911 INFO:GRAPHICS:   EXT_texture_filter_anisotropic

dmloader.js:911 INFO:GRAPHICS:   EXT_texture_norm16

dmloader.js:911 INFO:GRAPHICS:   KHR_parallel_shader_compile

dmloader.js:911 INFO:GRAPHICS:   NV_shader_noperspective_interpolation

dmloader.js:911 INFO:GRAPHICS:   OES_texture_float_linear

dmloader.js:911 INFO:GRAPHICS:   WEBGL_blend_func_extended

dmloader.js:911 INFO:GRAPHICS:   WEBGL_clip_cull_distance

dmloader.js:911 INFO:GRAPHICS:   WEBGL_compressed_texture_s3tc

dmloader.js:911 INFO:GRAPHICS:   WEBGL_compressed_texture_s3tc_srgb

dmloader.js:911 INFO:GRAPHICS:   WEBGL_debug_renderer_info

dmloader.js:911 INFO:GRAPHICS:   WEBGL_debug_shaders

dmloader.js:911 INFO:GRAPHICS:   WEBGL_lose_context

dmloader.js:911 INFO:GRAPHICS:   WEBGL_multi_draw

dmloader.js:911 INFO:GRAPHICS:   WEBGL_polygon_mode

dmloader.js:911 INFO:GRAPHICS:   GL_EXT_clip_control

dmloader.js:911 INFO:GRAPHICS:   GL_EXT_color_buffer_float

dmloader.js:911 INFO:GRAPHICS:   GL_EXT_color_buffer_half_float

dmloader.js:911 INFO:GRAPHICS:   GL_EXT_conservative_depth

dmloader.js:911 INFO:GRAPHICS:   GL_EXT_depth_clamp

dmloader.js:911 INFO:GRAPHICS:   GL_EXT_disjoint_timer_query_webgl2

dmloader.js:911 INFO:GRAPHICS:   GL_EXT_float_blend

dmloader.js:911 INFO:GRAPHICS:   GL_EXT_polygon_offset_clamp

dmloader.js:911 INFO:GRAPHICS:   GL_EXT_texture_compression_bptc

dmloader.js:911 INFO:GRAPHICS:   GL_EXT_texture_compression_rgtc

dmloader.js:911 INFO:GRAPHICS:   GL_EXT_texture_filter_anisotropic

dmloader.js:911 INFO:GRAPHICS:   GL_EXT_texture_norm16

dmloader.js:911 INFO:GRAPHICS:   GL_KHR_parallel_shader_compile

dmloader.js:911 INFO:GRAPHICS:   GL_NV_shader_noperspective_interpolation

dmloader.js:911 INFO:GRAPHICS:   GL_OES_texture_float_linear

dmloader.js:911 INFO:GRAPHICS:   GL_WEBGL_blend_func_extended

dmloader.js:911 INFO:GRAPHICS:   GL_WEBGL_clip_cull_distance

dmloader.js:911 INFO:GRAPHICS:   GL_WEBGL_compressed_texture_s3tc

dmloader.js:911 INFO:GRAPHICS:   GL_WEBGL_compressed_texture_s3tc_srgb

dmloader.js:911 INFO:GRAPHICS:   GL_WEBGL_debug_renderer_info

dmloader.js:911 INFO:GRAPHICS:   GL_WEBGL_debug_shaders

dmloader.js:911 INFO:GRAPHICS:   GL_WEBGL_lose_context

dmloader.js:911 INFO:GRAPHICS:   GL_WEBGL_multi_draw

dmloader.js:911 INFO:GRAPHICS:   GL_WEBGL_polygon_mode

dmloader.js:911 INFO:GRAPHICS: Context features:

dmloader.js:911 INFO:GRAPHICS:   CONTEXT_FEATURE_MULTI_TARGET_RENDERING

dmloader.js:911 INFO:GRAPHICS:   CONTEXT_FEATURE_TEXTURE_ARRAY

dmloader.js:911 INFO:ENGINE: Loading data from: archive:game.dmanifest

dmloader.js:911 INFO:SOUND: Info

dmloader.js:911 INFO:SOUND:   nSamplesPerSec:   48000

dmloader.js:911 INFO:SOUND:   DSP backend: Fallback

dmloader.js:911 INFO:SOUND: Sound

dmloader.js:911 INFO:SOUND:   nSamplesPerSec:   48000

dmloader.js:911 INFO:SOUND:        useThread:   0

dmloader.js:911 INFO:ENGINE: Initialised sound device 'default'

dmloader.js:911 INFO:PHYSICS: Created physics context: Bullet v2.77

dmloader.js:912 ERROR:GRAPHICS: Unable to link program.

printErr @ dmloader.js:912
dmloader.js:911 WARNING:GRAPHICS: 


dmloader.js:912 ERROR:GAMESYS: Failed to create shader program '/shader_1810231087805793281.spc': 

printErr @ dmloader.js:912
dmloader.js:911 WARNING:RESOURCE: Unable to create resource: /shader_1810231087805793281.spc: FORMAT_ERROR

dmloader.js:911 WARNING:RESOURCE: Unable to create resource: /shadow_mapping/materials/mid/diffuse.materialc: FORMAT_ERROR

dmloader.js:912 Aborted(Assertion failed: resource_hash, at: /home/runner/work/defold/defold/engine/resource/src/resource.cpp,1476,Release)
printErr @ dmloader.js:912
dmloader.js:914 Exception thrown, see JavaScript console
dmloader.js:911 INFO:CRASH: Successfully wrote Crashdump to file: /data/.Defold/_crash

dmloader.js:912 ERROR:CRASH: CALL STACK:
["RuntimeError: Aborted(Assertion failed: resource_hash, at: /home/runner/work/defold/defold/engine/resource/src/resource.cpp,1476,Release). Build with -sASSERTIONS for more info.","abort@http://localhost:59099/html5/3DPlatformerStarterKit_wasm.js:1:18484","___assert_fail@http://localhost:59099/html5/3DPlatformerStarterKit_wasm.js:1:25336","@wasm://wasm/00afff86:wasm-function[525]:0x626e","@wasm://wasm/00afff86:wasm-function[3530]:0x17f503","@wasm://wasm/00afff86:wasm-function[1887]:0xc3857","@wasm://wasm/00afff86:wasm-function[579]:0x9730","@wasm://wasm/00afff86:wasm-function[4227]:0x1de464","@wasm://wasm/00afff86:wasm-function[2652]:0x13c06f","Module._main@http://localhost:59099/html5/3DPlatformerStarterKit_wasm.js:1:284511","callMain@http://localhost:59099/html5/3DPlatformerStarterKit_wasm.js:1:288651"]
CALL STACK END

printErr @ dmloader.js:912
3DPlatformerStarterKit_wasm.js:1 Uncaught RuntimeError: Aborted(Assertion failed: resource_hash, at: /home/runner/work/defold/defold/engine/resource/src/resource.cpp,1476,Release). Build with -sASSERTIONS for more info.
    at abort (3DPlatformerStarterKit_wasm.js:1:18484)
    at ___assert_fail (3DPlatformerStarterKit_wasm.js:1:25336)
    at 00afff86:0x626e
    at 00afff86:0x17f503
    at 00afff86:0xc3857
    at 00afff86:0x9730
    at 00afff86:0x1de464
    at 00afff86:0x13c06f
    at Module._main (3DPlatformerStarterKit_wasm.js:1:284511)
    at Object.callMain (3DPlatformerStarterKit_wasm.js:1:288651)
index.html:1 WebGL: CONTEXT_LOST_WEBGL: loseContext: context lost
index.html:1 WebGL: CONTEXT_LOST_WEBGL: loseContext: context lost

1 Like