Editor does not work in Safari 14.1 on Catalina or Big Sur

[stalgiag]

Nature of issue?

• Found a bug

Details about the bug:

• p5.js version: newest, linked from https://editor.p5js.org (can't immediately find it in the page source)
• Web browser and version: Safari 14.1 (15611.1.21.161.7 on Catalina, 16611.1.21.161.6 on Big Sur)
• Operating System: MacOS 10.15.7 "Catalina" and 11.3.1 "Big Sur"
• Steps to reproduce this: go to https://editor.p5js.org, load a script or not, click the Run button, the canvas area only shows "Loading..." and does not change ever.

I am transferring this manually from the p5.js repo. The issue was originally filed by @ednl . For whatever reason, this repo does not show up as a transfer option at the moment.

I am able to reproduce this issue on Safari 14.1 and macOS 11.3.1. Many of my students have replicated it as well.

[catarak]

Sorry for the delay in getting to this! I've had my focus elsewhere and haven't been following bug reports closely. I'm not able to run Safari version 14.1 (I'm running 14.0.3, and when I try to update Safari there are no updates listed.) Right now, given #1878, I believe this may be an issue with p5.sound rather than the web editor. Would it be possible to test if a downloaded sketch still shows this issue in Safari? Appreciate the help testing!

[stalgiag]

I think Apple doesn't let you get the most recent Safari update unless your OS is the latest Big Sur.

Just got a chance to test and the problem doesn't happen locally and it also does not happen if I remove p5.sound from the index.html file with the online editor. Seems that this is specific to loading p5.sound with the online editor in the latest Safari. I tested and this happens with the latest version of p5.sound (v 1.0.1) and the version linked in new editor sketches currently (v 0.3.1).

The error message in the console with the editor is:
Unhandled Promise Rejection: AbortError: Failed to fetch module, error: Cross origin requests are only supported for HTTP.

[catarak]

Thank you @stalgiag! I was finally able to reproduce this error. I just pushed a release (v1.4.1) to downgrade the default p5.sound version, and I'll work on pinpointing the exact issue.

[mashimolab]

Hello, All
I also had the same issue, and I could resolve it by disable "WebAudio AudioWorklet API" from Develop menu on Safari.
The API is new feature of the safari 14.1, so I think the API is conflict with p5.sound. (I think the conflict might be relateded to ScriptProcessorNode).

[catarak]

This has been fixed in v2.0.0

[ffd8]

@catarak I know you're not leading this repo anymore, but perhaps you recall the changes necessary from this issue...

I'm currently trying to figure out why P5LIVE won't work on Safari (same issue as mentioned above, hasn't worked for a while, now in 2023, Safari 15.6.1 - also prevents coding with an ipad) – the minute I disable p5.sound.min.js it works fine. When enabled, I receive the following error:

[Error] Unhandled Promise Rejection: AbortError: Cross-origin script load denied by Cross-Origin Resource Sharing policy.
	promiseEmptyOnRejected
	promiseReactionJob

This is both online and offline usage. The answer for the p5js-web-editor was to roll back the version used for p5.sound, however loading the editor now, I see that p5.sound v1.8.0 (technically 1.0.1) is being loaded? Did something change or is there other code changes necessary within the editor to get it working again? thanks for any insights!

EDIT: huge thanks to @montoyamoraga , p5.sound v1.0.2 solves this issue!
edit 2: spoke too soon.. now getting the following error in safai: Unhandled Promise Rejection: InvalidStateError: No ScriptProcessor was registered with this name. Working fine in web-editor, so I'm curious if there's other fixes to using the p5.sound lib in safari?