Frontend Labs
⋯
🟨

Support Desk — full source

The complete, tested source of Support Desk, generated from the files in JS/projects/support-desk/ by build-source-pages.mjs. 15 files.

18 chapters · 27 min of reading

A small, realistic agentic web app: a signed-in customer chats with a support agent that looks up orders and proposes refunds, which the customer approves in the UI. It is the project for Parts XI, XII and XIV of the JavaScript field guide (§63, §68, §74–§78).

  • Zero runtime dependencies: node:http on the server, plain ES modules in the browser.
  • Session-cookie auth (scrypt, HttpOnly, SameSite), CSRF tokens + Fetch Metadata.
  • An agent endpoint that streams typed events (AG-UI style) over Server-Sent Events.
  • An actionable-UI component registry with prop validation and human approval.
  • Strict CSP with Trusted Types, rate limits, one fail-closed error handler.
  • A 26-test Playwright suite: UI, API, security, clock, accessibility, visual.

Contents

18 chapters, one page each. Prefer one long page? Read the whole book on one page.

  1. Run it1 min
  2. Test it1 min
  3. Files1 min
  4. package.json1 min
  5. server.mjs9 min
  6. public/index.html1 min
  7. public/agent-ui.js2 min
  8. public/api.js1 min
  9. public/app.js3 min
  10. public/styles.css2 min
  11. playwright.config.js1 min
  12. tests/a11y.spec.js1 min
  13. tests/auth.setup.js1 min
  14. tests/chat.spec.js3 min
  15. tests/fixtures.js1 min
  16. tests/login.spec.js1 min
  17. tests/security.spec.js2 min
  18. tests/session.spec.js1 min

Generated from SOURCE.md · 8 Oct 2026 16:36