Back to articles
Sending beautiful Playwright test reports via email using shadcn/ui and react-email

Sending beautiful Playwright test reports via email using shadcn/ui and react-email

via Dev.to ReactVitali Haradkou

Why email reports? After a CI run finishes you usually have two options: check GitHub Actions manually or wait for a Slack ping with a link. Neither is great when you want the whole team — including non-engineers — to see what broke. @playwright-labs/reporter-email solves this by hooking into Playwright's reporter API and sending an HTML email as soon as the run completes. No extra server, no external service — just SMTP. New in this release: shadcn/ui templates The package now ships 4 new templates built on top of email-safe shadcn/ui components. "Email-safe" means no Radix UI (requires browser APIs), no CSS variables (not supported in most clients), and <a> tags instead of <button> for interactive elements. Template overview Template Import Key feature Base …/shadcn Badge + Card layout Chart …/shadcn/base-chart Pass-rate stacked bar Button …/shadcn/base-button CTA links to report / failures Themes …/shadcn/base-themes 6 color themes Select …/shadcn/base-select Status filter Subpath e

Continue reading on Dev.to React

Opens in a new tab

Read Full Article
6 views

Related Articles