Explore the sample site#
The maintained sample site is a deterministic host with one intentional profile-save bug and its fixed behavior. The documentation's example launch controls reuse this artifact; there is no second implementation of the scenario.
Open the built React playground, plain-HTML host, or reporting prototype alongside this guide. These links work when reading the locally served documentation artifact; use the command below from the repository.
Run it from the repository#
Use the pinned workspace setup, then:
pnpm worktree:setup
pnpm dev:examples
Use the server's printed URL. Append playground/, plain-html/, or playground/branding/; preserve any deployment prefix. Startup builds supported module entries. Restart after changing package source.
Compare buggy and fixed saves#
- Open the React playground and choose Buggy save.
- Replace Alex Morgan with Morgan Lee and click Save profile.
- Visit Overview, then Profile. The success message claimed a save, but Alex Morgan returns.
- Choose Fixed save and repeat. Morgan Lee remains across in-page navigation.
- Choose Reset scenario. Initial state returns while the selected mode stays selected.
Switching modes starts fresh. A full browser reload resets mode and data; this example does not implement durable storage. Whitespace-only names are rejected, and markup-like input stays literal text.
The scenario source owns state transitions. ProfileScenario renders it in the playground and reporting prototype. The matching fixed-save definition is a useful first agent test.
Inspect the plain-HTML host#
The plain-HTML example uses its own DOM script without React. Exercise its button by pointer and keyboard. Its labelled SnagBadger mount region is intentionally empty; universal embedding is future work.
Explore the reporting prototype#
For the interactive launcher and drawer, open the bug reporter demo. Use the right-edge Report a bug button, then try capture setup, start/stop, review, replay and settings. Pointer, keyboard and touch work with the same maintained interface. See its walkthrough and mocked boundaries; capture and submission are simulated.
The public reporting and recording routes share the site's warm Oops! Club styling, Technical mono headings, caped badger and centered navigation. They display the maintained profile scenario directly, without the former workspace frame or developer controls. Explicit variant A–E URLs retain the internal design studies; the public demo gallery does not link those controls.
Try start, pause, resume, stop, review, and restart. These are simulated recording states. No browser permission, real screen/audio recording, upload, persistence, or external submission occurs. Local evidence inclusion and draft state exist only for this session. See prototype notes for context.
Continue with the test catalog or runtime setup. Authored tests of the prototype must observe its simulated behavior, not claim real capture.