Community & Examples
Real-world examples, tutorials, and community content for TWD.
Contributors
People from the community who have shipped code, docs, or other improvements to TWD. If you're starting out in tech and looking for a beginner-friendly first PR, see the open issues — reach out and I'll help with setup and walk you through it.
| Contributor | Contribution |
|---|---|
| Francisco Javier Rodriguez | Documentation — PR #230 |
| Guillermo Ruiz Arranz | Code — PR #232 |
| Roberto Gomez Fabrega | Documentation — PR #239 |
Live Showcase
See TWD testing real shadcn/ui components with live code and tests running in the browser:
TWD + shadcn/ui Showcase — Interactive demo with component tests you can run yourself.
Example Repositories
| Repository | Framework | What it demonstrates |
|---|---|---|
| twd-shadcn | React + shadcn/ui | Testing shadcn components (forms, dialogs, tables) with live demo |
| twd-react-router | React Router (Framework Mode) | SSR-compatible setup with createRoutesStub, loader mocking |
| twd-tanstack-example | React + TanStack Router | TanStack Router integration with route + loader testing |
| twd-vue-example | Vue | Vue integration with bundled setup |
| twd-nuxt-example | Nuxt 4 (SSR) | Pages tested in the browser against a real SQLite backend, with a dev-only reset endpoint |
| twd-angular-example | Angular | Angular integration with manual test imports |
| twd-auth0 | React + Auth0 | Auth session mocking with Sinon stubs |
| twd-auth0-pkce | React + Auth0 PKCE | PKCE flow mocking for SPAs |
| twd-docs-tutorial | React | Step-by-step companion to the tutorial |
| twd-create-react-app | Create React App (Webpack) | require.context test loading, react-router loaders/actions, CI with twd-cli and contract validation |
| twd-vanillajs | Vanilla JS (no bundler) | TWD loaded from a CDN via an import map, counter + todo list, API mocking, CI with twd-cli and contract validation |
| twd-htmx | HTMX (no bundler) | TWD loaded from a CDN, HTMX todo list tested against a real HTML backend with a dev-only reset endpoint |
| twd-cells | Open Cells (Lit) | BBVA's Web Components framework: hashbang-router pages, request mocking, real localStorage, and CI with coverage via the vite plugin |
| frontend-challenge | React + Vite | Testing Library render() component tests running in the browser next to jsdom tests of the same component |
In-Repo Examples
The main TWD repository also includes working examples:
- twd-test-app — React app with forms, API mocking, and component mocking
- vue-twd-example — Vue integration
- astro-example — Astro + React integration
Videos
- TWD: Una nueva forma de testear el frontend (Commit Conf, Spanish)
- Testing while developing: una nueva forma de testear en frontend (Spanish)
Podcasts
Una nueva forma de testear frontend con TWD | Kevin Martinez #83 (Spanish)
How to Test This - Episode #14: How to Test with Testing While Developing (TWD) - Kevin Martínez
Blog Posts
Written by Kevin Martinez, TWD maintainer. More posts on DEV.to. Follow on Bluesky.