Web Editor can't capture and display errors for p5.js >= 1.0.0

[akshay-99]

Nature of issue?

• Found a bug

Details about the bug:

• Web browser and version: Chrome 83.0.4103.116
• Operating System: Ubuntu 18.04
• Steps to reproduce this bug:

For sketches running on p5 versions 0.10.2 and older , the editor is able to capture an error, highlight the line and display the error in the editor console perfectly.

It cannot do the same for sketches running on newer versions of p5 ( >= 1.0.0 ) as seen here:
https://editor.p5js.org/akshay.padte/sketches/2yX5Q5CeV

This is likely because the initialization code for p5 was changed a bit in processing/p5.js#4233 ( just before 1.0.0 ) and it now runs inside a promise. Which also means that errors now happen inside a promise and would now be caught by unhandledrejection listener instead of onerror.

Also, since p5 0.6.0, several components of the FES report the line number of the error in the message. However since the editor concatenates the user-code into srcdoc, the line number reported by the FES is something like about:srcdoc:56:3

I was wondering if it's possible to fix this somehow. Maybe this belongs in an issue of its own.

[welcome]

Welcome! 👋 Thanks for opening your first issue here! And to ensure the community is able to respond to your issue, be sure to follow the issue template if you haven't already.

[catarak]

Thanks for reporting! It seems like the code meant to catch JS errors isn't intercepting unhandled promise rejections. This code is located in consoleUtils.js. Apparently window.onerror doesn't catch unhandled promise rejections, and a solution is proposed here.

[ridait]

Hello,
I can take a look at this one unless someone is already on it.