preload does not block on custom fetch calls before setup runs
0 reputation · 25 Jul 2023, 01:12 UTC
Observed behavior
When a sketch uses preload() with loadImage() the setup() is deferred until the image finishes loading. However, a fetch() call placed inside preload() does not pause setup(); the sketch proceeds while the network request is still in flight.
Constraints
- Using p5.js 1.9.x via npm ESM import (
import p5 from 'p5') in instance mode. - Test harness loads the sketch in a headless JSDOM environment where
fetchis polyfilled. - No production credentials are involved; the goal is deterministic initialization order for snapshot tests.
Unresolved decision
The documentation states that preload() only waits for p5’s built-in loaders. It is unclear whether wrapping a fetch() in a Promise and returning it from preload() would be respected, or if the only supported pattern is to move custom async work into setup() and guard draw() with a readiness flag.
Specific questions:
- Does returning a
Promisefrompreload()actually delaysetup()in current releases? - If not, what is the recommended pattern for ensuring external data is available before the first
draw()without polling indraw()? - Are there version-specific differences between the CDN UMD build and the npm ESM build regarding this behavior?