[p5.js 2.0 Bug Report]: p5.strands callbacks don't work with inline anonymous non-arrow functions

[davepagurek]

Most appropriate sub-area of p5.js?

• Accessibility
• Color
• Core/Environment/Rendering
• Data
• DOM
• Events
• Image
• IO
• Math
• Typography
• Utilities
• WebGL
• Build process
• Unit testing
• Internationalization
• Friendly errors
• Other (specify if possible)

p5.js version

2.0.3

Web browser and version

Firefox

Operating system

MacOS

Steps to reproduce this

Steps:

1. Take a p5.strands example (e.g. the first on here: https://beta.p5js.org/reference/p5/basematerialshader/)
2. Change the arrow function to a function() { ... }

The code stops working.

Snippet:

let myShader;

function setup() {
  createCanvas(200, 200, WEBGL);
  // Works:
  // myShader = baseMaterialShader().modify(() => {
  
  // Doesn't work:
  myShader = baseMaterialShader().modify(function() {
    let time = uniformFloat(() => millis());
    getWorldInputs((inputs) => {
      inputs.position.y +=
        20 * sin(time * 0.001 + inputs.position.x * 0.05);
      return inputs;
    });
  });
}

function draw() {
  background(255);
  shader(myShader);
  lights();
  noStroke();
  fill('red');
  sphere(50);
}

Live: https://editor.p5js.org/davepagurek/sketches/Xla02SjFQ

[nking07049925]

Hello! @davepagurek

Decided to poke around. Seems like acorn is failing to parse a top level nameless anonymous function.
\acornjs\acorn\acorn\src\expression.js

Here's a reproduction on playcode

Looking further in, they seem to have tests for anonymous functions
But in all of their cases they are at least wrapped into braces.

Wrapping the same declaration in braces seems to fix the error. Playground link

So its likely that manually wrapping sourceString in shaderModifier into a pair of braces could work as a temporary workaround.

[davepagurek]

Great find @nking07049925! Would you be interested in making that change?

[nking07049925]

Great find @nking07049925! Would you be interested in making that change?

Done!

[nking07049925]

I think it might be a good idea to also report this error in acorns repository. If they fix the issue upstream the bracket wrapping would be unnecessary.

[davepagurek]

@nking07049925 that would be good! Do you feel like opening an issue in Acorn too?

[nking07049925]

@nking07049925 that would be good! Do you feel like opening an issue in Acorn too?

Sure!
What is the standard procedure for dealing with workarounds that might become obsolete through a bugfix in a dependency? This one seems unobtrusive enough where it staying around shouldn't be an issue. Should the link to the acorn issue also be added to a comment once I create one?

[davepagurek]

That works, and also when the issue in Acorn gets closed, we can make a new issue in the p5 repo to bump our acorn version and remove the workaround.