[p5.js 2.0 Bug Report]: [p5.streands] Assignment in a nested if statement produces broken GLSL output

[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.1-rc1

Web browser and version

Any

Operating system

Any

Steps to reproduce this

Steps:

1. Create a p5.strands shader
2. Create a variable you will reassign
3. Modify the variable only in a nested if statement
4. Output the variable in the hook (e.g. in the color)
   When using the shader, it won't compile due to broken output.

Snippet:

function setup() {
  createCanvas(400, 400, WEBGL);
  const sh = baseMaterialShader().modify(() => {
    const val = uniformFloat(() => PI * 8)
    getPixelInputs((inputs) => {
      let shininess = 0;
      let color = 0;
      if (val > 5) {
        const elevation = sin(val);
        if (elevation > 0.4) {
          shininess = 0;
        } else if (elevation > 0.25) {
          shininess = 30;
        } else {
          color = 1;
          shininess = 100;
        }
      } else {
        shininess += 25;
      }
      inputs.shininess = shininess;
      inputs.color = [color, color, color, 1];
      return inputs;
    });
  });

  shader(sh);
  plane(width, height);
}

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