Skip to content

fix: optional canvas-confetti via CDN with cached promise (Fix 2)#409

Open
Niboshi-Wasabi wants to merge 1 commit intokoala73:mainfrom
Niboshi-Wasabi:fix/canvas-confetti-cdn-optional
Open

fix: optional canvas-confetti via CDN with cached promise (Fix 2)#409
Niboshi-Wasabi wants to merge 1 commit intokoala73:mainfrom
Niboshi-Wasabi:fix/canvas-confetti-cdn-optional

Conversation

@Niboshi-Wasabi
Copy link
Contributor

Summary

Makes the celebration service work when the canvas-confetti package is not installed in node_modules, so the app builds and runs without "Failed to resolve import 'canvas-confetti'" (e.g. after a fresh clone before npm install, or in environments where dependencies are not fully installed).

When the import fails: The error occurs when Vite tries to resolve canvas-confetti at build or dev startup and the package is missing from node_modules — for example right after cloning the repo without running npm install, or in a workspace where dependencies have not been installed yet. We did not observe it in CI, Tauri build, or a specific Node version; it was the "package not installed" case.

Implementation:

  • Load confetti at runtime from a CDN script instead of bundling the npm package. No import 'canvas-confetti' in source, so Vite never tries to resolve it.
  • Use a module-scoped cached promise for the load so that only one <script> tag is ever appended. The record celebration calls run() twice (300ms apart); without the cache, a second script would be appended if the first load had not finished. All callers now share the same promise.
  • Do not add optimizeDeps.include: ['canvas-confetti'] in vite.config, so the package remains optional and Vite does not try to pre-bundle it at dev startup.

Trade-off: If the CDN is unavailable or the user is offline, celebrations still run but no confetti is shown. When the package is installed (after npm install), the CDN is used the same way so behavior is consistent.

Type of change

  • Bug fix
  • New feature
  • New data source / feed
  • New map layer
  • Refactor / code cleanup
  • Documentation
  • CI / Build / Infrastructure

Affected areas

  • Map / Globe
  • News panels / RSS feeds
  • AI Insights / World Brief
  • Market Radar / Crypto
  • Desktop app (Tauri)
  • API endpoints (/api/*)
  • Config / Settings
  • Other: celebration service (src/services/celebration.ts)

Checklist

  • Tested on worldmonitor.app variant
  • Tested on tech.worldmonitor.app variant (if applicable)
  • New RSS feed domains added to api/rss-proxy.js allowlist (if adding feeds)
  • No API keys or secrets committed
  • TypeScript compiles without errors (npm run typecheck)

Screenshots

None. Manual check: run the app without canvas-confetti in node_modules (e.g. remove it from node_modules and run npm run dev); app should start and celebrations should load confetti from CDN when triggered.

- Load confetti from CDN at runtime when package not in node_modules
- Module-scoped cached promise so only one script tag is appended (record type calls run() twice 300ms apart)
- No optimizeDeps for canvas-confetti; package stays optional
- PR rationale and description in docs/PR_FIX2_CANVAS_CONFETTI_BODY.md

Made-with: Cursor
@vercel
Copy link

vercel bot commented Feb 26, 2026

@Niboshi-Wasabi is attempting to deploy a commit to the Elie Team on Vercel.

A member of the Team first needs to authorize it.

@Niboshi-Wasabi
Copy link
Contributor Author

Hi @koala73,

This is the separate PR for Fix 2 we discussed on PR #388: optional canvas-confetti via CDN with a module-scoped cached promise (so only one script tag is appended), no optimizeDeps, and the rationale in the description. When you have time, I’d be glad if you could take a look. Thanks.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant