p5.js icon indicating copy to clipboard operation
p5.js copied to clipboard

fixed the Friendly Error message issue in p5.js where error stack tra…

Open Mario5T opened this issue 2 months ago • 5 comments

The Problem (Issue #8212)

When using functions like createVector(10, NaN) or float() incorrectly, the Friendly Error message would point to the line in the p5.js library file that executes the error message, rather than the line in the user's sketch that caused the error.
This made debugging difficult for users.


Root Cause

In validate_params.js, the code used a hardcoded stack frame index parsed[3] to extract the location of the error.
This assumed a fixed call stack depth, which didn't account for errors originating from within p5.js library functions.


Typical Stack Trace

Index Description
[0] Error creation in _friendlyParamError
[1] _friendlyParamError itself
[2] _validateParameters
[3] The p5.js function (e.g., createVector, float) ← was pointing here
[4] User's code ← should point here

The Fix

Modified validate_params.js (lines 608–672) to:

  • Detect the p5.js library file name by throwing a test error and parsing its stack trace
  • Filter out all frames from the p5.js library to find the first frame from user code
  • Use the user's code frame for error location reporting
  • Maintain backward compatibility by falling back to parsed[3] if no user frame is found

This approach mirrors the logic already used in the processStack() function in fes_core.js for handling global errors.


Testing

The fix can be tested with the examples from the bug report:

function setup() {
  let vectorA = createVector(10, NaN);  // Error will now point to this line
  let vectorB = createVector(vectorA.x + vectorA.y, vectorA.y);
}

Mario5T avatar Nov 10 '25 10:11 Mario5T

🎉 Thanks for opening this pull request! For guidance on contributing, check out our contributor guidelines and other resources for contributors! 🤔 Please ensure that your PR links to an issue, which has been approved for work by a maintainer; otherwise, there might already be someone working on it, or still ongoing discussion about implementation. You are welcome to join the discussion in an Issue if you're not sure! 🌸 Once your PR is merged, be sure to add yourself to the list of contributors on the readme page !

Thank You!

welcome[bot] avatar Nov 10 '25 10:11 welcome[bot]

@perminder-17 plz review it.

Mario5T avatar Nov 12 '25 05:11 Mario5T

Hi, thanks for your work and your patience. https://github.com/processing/p5.js/issues/8212#issuecomment-3520598906 I just wrote a comment, and could wait for the approvals?

perminder-17 avatar Nov 12 '25 08:11 perminder-17

@perminder-17 just asking if the issue is approved to be worked on will my pr be considered?

Mario5T avatar Nov 12 '25 11:11 Mario5T

@perminder-17 just asking if the issue is approved to be worked on will my pr be considered?

Actually, @sahilsharda commented first on the issue. If they still want's to work, I think I should wait for their PR to open. If not, I'll surely review your PR.

perminder-17 avatar Nov 15 '25 10:11 perminder-17