P5.js: Shader failure on Ubuntu Firefox

[vanyamil]

Nature of issue?

• [x] Found a bug

Most appropriate sub-area of p5.js?

• [x] Core/Environment/Rendering
• [x] WebGL

Which platform were you using when you encountered this?

• [x] Desktop/Laptop

Details about the bug:

• p5.js version: NPM version 0.7.2
• Web browser and version: Firefox 64.0 (Build ID 20181207230928)
• Operating System: Ubuntu 16.04.5 LTS (Xenial)
• Steps to reproduce this:
  On a project I wrote that works on Chrome and Mozilla on Windows, I receive an error during the first draw :

    TypeError: this.curFillShader.attributes.aNormal is undefined[Learn More] 
    a/<[74]</a.RendererGL.prototype.drawBuffers
    a/<[74]</a.RendererGL.prototype.drawBuffersScaled
    a/<[65]</a.prototype.ellipsoid
    a/<[65]</a.prototype.sphere
    d.draw/<
    o.a.prototype.draw_wrapper
    d.draw
    V</e.draw
    a/<[36]</a.prototype.redraw
    a/<[30]</a.prototype.resizeCanvas
    V</e.windowResized
    V</e.setup
    r/this._setup<
    <anonymous>
    r/this._runIfPreloadsAreDone
    r/this._decrementPreload
    a/<[45]</a.prototype.loadImage/r.onload

Seems to happen when trying to draw a sphere with a preloaded image texture (.jpg; network tab says the image loads correctly). It crashes the entire script.

I tried to see if the same happens on any example scripts and found that the 3D materials script seems to not display the normal-textured (top right) torus (however, it is able to draw the rest of them without hard errors). Not sure if that is entirely related.

[sanketsingh24]

are you able to reproduce this error in v0.7.3?

[vanyamil]

Actually, v0.7.3 has its own issues; I can't use it at all due to some function in p5.File failing its imports.

[sanketsingh24]

Can you please elaborate more on this? If possible, can you share your code?

[vanyamil]

https://github.com/vanyamil/vanyamil.github.io/tree/7e1c84b564c7929704adc2e58e2e0bb1059b261d

[stalgiag]

I can confirm that the link you provided works fine in chrome&firefox for Windows

[Janglee123]

I can reproduce this!
I am using Solus 4(another Linux distro) and Firefox 65 and chrome also throw an error.

vendor.js:1 Uncaught TypeError: Cannot read property 'location' of undefined
    at i.RendererGL.drawBuffers (vendor.js:1)
    at i.RendererGL.drawBuffersScaled (vendor.js:1)
    at r.i.ellipsoid (vendor.js:1)
    at r.i.sphere (vendor.js:1)
    at orbitsim.js:1
    at r.s.a.draw_wrapper (orbitsim.js:1)
    at Function.y.draw (orbitsim.js:1)
    at e.draw (orbitsim.js:1)
    at r.i.redraw (vendor.js:1)
    at r.i.resizeCanvas (vendor.js:1)

I am not much aware of this issue though.

[sanketsingh24]

The errors are different, but can you show us the code? small sample of code perhaps? you can use the online editor for that

[stalgiag]

It seems like the attributes are missing somehow. Perhaps the shader objects aren't loading attributes correctly. If I am right, then I am not sure why this would be OS-specific but it is a little hard to investigate without access to Linux testing environment.

I do know that code very relevant to both of these errors has been modified recently. Testing with the current master build might help. Also calling console.log(p5.instance._renderer.getRetainedFillShader()) in master or console.log(p5.instance._renderer.curFillShader) in 0.7.3 before the crashing line might help illuminate the problem better.

[Janglee123]

@sanketsingh24

The errors are different, but can you show us the code? small sample of code perhaps? you can use the online editor for that

I am talking about vanyamil.github.io

[Janglee123]

@stalgiag can you give me more details about where to look further? I will try to solve this.

Also calling console.log(p5.instance._renderer.getRetainedFillShader()) in master or console.log(p5.instance._renderer.curFillShader) in 0.7.3 before the crashing line might help illuminate the problem better.

Both return undefined.

And output of console.log(p5._renderer.curFillShader.attributes); is

json {"aPosition":{"name":"aPosition","location":0,"type":35665,"size":1}} ​

[stalgiag]

@Janglee123 thanks for the follow-up and sorry for the delay! I am not able to test for this but I am curious if 0.8.0 changes anything. I think that overall though this example is not useful for debugging this problem. Everything is minified and the example is much to big to really track down what is causing the problem. I think unfortunately this problem is unfixable unless we are able to narrow this down a little so that it can be recreated in a much more simple example.

[stalgiag]

Any Ubuntu users out there able to test the 3D Materials page? The todo is simply to go that link with Ubuntu and Firefox (more browsers too if so enclined) and check the console for any unexpected output. Thanks!

[vanyamil]

Looks like no particular output. Complains about torus detail levels but no
reds.

If this change is part of an active NPM version, I can try updating the
website to test it there too.

On Mon, Sep 2, 2019 at 6:27 AM Stalgia Grigg [e-mail]
wrote:

Any Ubuntu users out there able to test the 3D Materials page
https://p5js.org/examples/3d-materials.html? The todo is simply to go
that link with Ubuntu and Firefox (more browsers too if so enclined) and
check the console for any unexpected output. Thanks!

—
You are receiving this because you authored the thread.
Reply to this email directly, view it on GitHub
https://github.com/processing/p5.js/issues/3485?email_source=notifications&email_token=AEBHK7XZDQUE5O7ISAYCZW3QHTS7JA5CNFSM4GS2B5CKYY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOD5VNNBQ#issuecomment-527095430,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AEBHK7VJXKLSZQPZOMRGRFDQHTS7JANCNFSM4GS2B5CA
.

[aferriss]

@stalgiag The materials page looks fine to me as well on Ubuntu 18.04 with Firefox v69.

[Janglee123]

It works fine for me too.
OS: Solus
Web Browser: Firefox 69.0.1

[stalgiag]

Thank you @Janglee123 and @aferriss.

So it seems that the Materials page is working with Ubuntu.

@vanyamil have you tried updating your website example to the latest p5 release (0.9.0)? If you do, and the crash still happens can you try isolating the problem to the smallest code example possible?Once you've done that you can add it to a sketch on editor.p5.org and then once others are able to reproduce we can track down the problem.

[lmccart]

@stalgiag is this one resolved then?

[stalgiag]

Yes, I think we can close this. @vanyamil if you are able to recreate with a simpler piece of code, feel free to post here and we can reopen