Issues between ShadowGenerator and IOS/OSX

Hello everyone,

We had very weird stuff happening with the latest Apple products :

Macbook OSX 10:
As you can see in the video, it feels like the computer is going to explode :smile:
Plus that is the first time in my life that I see a bug impacting the entire screen outside from the browser window! This only happens with last Macbook Pro, but we had no problem with former models.

|Operating System|Mac OSX 10 (Unknown Version)|
|Screen Resolution|1440 x 900|
|Web Browser|Chrome 71.0.3578.98|
|Browser Size|1417 x 677|
|IP Address||
|Color Depth|24|
|Flash Version|Not Installed|
|User Agent|Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_2) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/71.0.3578.98 Safari/537.36|

Iphone X

With Iphone the page can’t load at all. It load a first time with an error saying its going to reload the page and when the page has been reloaded, it just can’t show anything.

We spent the entire afternoon looking for what may cause this. And everything stops bugging when we deleted all the ShadowGenerator. So logically it should come from that or something linked to ShadowGenerator.

We currently work with BABYLON V3.3.0

Tell me if you need anything more in order to catch the bug on your side.

Woot! I love Apple product so much :smiley:

One day they will fix their crappy browser for sure…

Can you try with shadows but no blur for instance? Also try to overload console.error and console.log to display the error somewhere so we can get an idea of what is happening

Also do you repro with a Safari on Mac attached to your iphone ? (To get a sense of the error)

1 Like

Hello @Deltakosh,

In fact it doesn’t depend on the browser. Because the bug is showing no matter if we are on Safari, Chrome or Firefox. So it really is the last Macbook Pro.
And we did go to see the console but there isn’t any errors showing! Or can you tell me how to trigger one error linked to what we see?

Same thing with our iphone. As the page reloads really quickly, this is hard to catch the error in the console with safari open and attached to the phone.

The shadowGenerator we created didn’t set any parameters except the darkness, so I just tried with parameter useBlurExponentialShadowMap set to true but it still bugs.

Hope that helps :wink:

this is sad :slight_smile: They shoudl test their products.

Let’s try another one: call this after creating your engine:

engine.getCaps().textureFloatRender = false;
engine.getCaps().textureHalfFloat= false;
engine.getCaps().textureHalfFloatRender= false;

Also make sure to create your engine with no webgl2 support


We tried with what you suggest and no webgl2 support and we still have the bug.

When testing we observed it actually gets worst when on MAC application which has a blur where you can see the 3D scene behind. Like in the video I sent when the select menu appears at the top, the menu has a blur effect.
It also gets worst with MAC animation, like when a window is showing or hiding with the 3D scene behind.

So indeed this must be a MACOS/WebGL conflict!
But why this is only when a ShadowGenerator is present? very curious :wink:

tbh the stuttering on the mbp is pretty common when the gpu gets heavily used. I’ve got a dual 1080p monitor setup at work on a 2015 mbp, it tends to glitch out after an intensive day of 3d dev : same kind of stutters in your video, really weird artifacts on screen, and laggy inputs until you quit any 3d view. It gets even worse on the original retina display… I blame the really low spec gpus on that one, but I’ll agree that ShadowGenerators on Apple products tend to crash perfs like crazy, so I wouldn’t be surprised if the iphone just can’t stand it and gives up before giving a head’s up. We solved it with a blob “shadow” if you’re up for old school solutions :sob:

one thing you could try is through the iOS sim using the mbp’s safari’s “dev” console to connect to the open page in the sim. It can give at least a bit of draw context from the canvas, but it’s not a real application of what happens on device unfortunately

1 Like

Shadowgenerator is using render to textures so can you try with say a postprocess? I would like to reduce the list of culprits

Have you guys found anything else on this? I am running into this same problem on iOS devices

1 Like

FYI, I’ve run into this exact problem. Haven’t found a solution yet. Can’t even try…catch the error to prevent page reload.

That sounds not good at all. This could be a showstopper issue.

This seems to work fine for me any browsers Mac 2014 2017 and Iphone 8:

Could you create a repro in the PG ? I am really wondering what could happen here.

We just put the shadow back again in Naker Edition tool. So far it works fine everywhere now.
We recently switch to BabylonJS V4 so it might be that but can’t confirm.

1 Like

Have this problem on latest iOS =( Also a bunch of people on apple forums also have it

Could you share the playground where it is not working for you as well as you iOS version ?

I can provide the link to the hosted version, not sure how to use playground( I’ve done a couple of other models, they work fine. I also tried with and without shadows - same result.

You should find all the info here: Introduction to the Playground - Babylon.js Documentation

and Using External Assets - Babylon.js Documentation

This helps a lot to have it in the playground as it takes lot of time to enter in every single app usually having lots of overhead compared to the issue we want to focus on.

This is just a model, nothing else

But you are also using shadows with a specific setup and so on, and recreating locally to test takes usually quite some time that we can not spend on every single post of the forum. I know it is a bit of effort for you but it would definitely help the whole community to address the issue faster.

1 Like

OK, I’ll make a playground then

1 Like

Apologies for not having a playground yet, but I just ran into a similar error today – in an earlier version of my code everything still works on Safari/iOS, but since I’ve added new features (meshes, fog, nothing about the shadowGenerators themselves) I get this error in the Safari console when I apply shadows (it also calls ‘texture unit 1’ and 3, one for each shadowGenerator):

“WebGL: drawElements: texture bound to texture unit 2 is not renderable. It maybe non-power-of-2 and have incompatible texture filtering or is not ‘texture complete’, or it is a float/half-float type with linear filtering and without the relevant float/half-float linear extension enabled.” at:
n ? this._gl.drawElementsInstanced(r, i, o, t * a, n) : this._gl.drawElements(r, i, o, t * a)

I followed the the “engine.getCaps()” suggestion and pared the shadowGenerators to defaults, but the only thing that lets my code run is if I disable some part of the shadow equation, either not receiving shadows (ground.receiveShadows = false) or not sending them (disabling the generators). My earlier code runs three shadowGenerators and renders great on Safari/iOS. It’s weird.