# Better Auth DevTools

> Stop logging in and out to test role-based UIs.

Source: https://www.harxit.com/products/better-auth-devtools

- Author: [Harshit Sharma](https://www.harxit.com/about)
- Published: March 1, 2025
- Technologies: TypeScript, React, Better Auth
- Repository: [GitHub](https://github.com/C-W-D-Harshit/better-auth-devtools)
- Website: [Open project](https://www.better-auth-devtools.com/)

The [ERP product I worked on](https://buildenfra.in/) had Managers, Owners, Admins, Editors, and several other roles. Each role changed the navigation, actions, and data visible on the screen.

Testing one UI change meant signing in as one role, checking the page, signing out, and repeating the process with another account. I built Better Auth DevTools to remove that loop.

![Better Auth DevTools: instant user switching and session editing for Better Auth.](https://www.harxit.com/products/better-auth-devtools/overview.png)

_Test personas belong beside the application, not in a password spreadsheet._

## What I wanted

I wanted to define test personas once, create them locally, and switch the active session without leaving the page.

Better Auth already had admin impersonation and multi-session support, but they solve different problems. Impersonation can operate on real users, while multi-session still requires accounts to be created and signed in. My scope was narrower:

- Development environments only
- Test users managed by the tool
- One-click switching between known personas
- Session inspection without opening the database
- Edits limited to approved fields

## Making the API smaller

The first version was split into four packages: a Better Auth plugin, a React panel, shared contracts, and internal utilities.

It was flexible because applications can store roles in the user table, a membership table, or a custom profile model. But the application had to provide callbacks, database queries, client configuration, and wrapper code for a small development tool.

I installed the package in a separate Next.js app, first with Prisma and then with Drizzle. That exposed the integration work hidden by the monorepo demo.

The current version is one package with two integration points: add `devtools()` to the Better Auth configuration and mount `<BetterAuthDevtools />` in React. It uses Better Auth's adapter and plugin schema for the common case. Role templates stay declarative, while callbacks remain available for applications with custom role storage.

## Keeping it out of production

Switching sessions bypasses the normal credential flow, so production safety had to be enforced by the server:

- `NODE_ENV=production` disables every DevTools endpoint and cannot be overridden.
- The plugin can only switch into users it created and manages.
- Writes require a trusted origin, CSRF checks, and rate limiting.
- Session tokens and secret-like fields never reach the inspector.
- Editable fields are allowlisted and validated.

The panel also hides when the server reports that DevTools is unavailable, but the real guard remains at the endpoint.

## Shipping the package

The release checks build the npm tarball, install it in a temporary project, import every public entry point, and render the React panel. Integration tests also cover the complete create → switch → edit → delete flow against a real Better Auth instance.

## Result

Better Auth DevTools is now listed in the official [Better Auth community plugins](https://better-auth.com/docs/plugins/community-plugins).

The package has [5,000+ downloads on npm](https://www.npmjs.com/package/better-auth-devtools). The repository also reached [37 GitHub stars](https://github.com/C-W-D-Harshit/better-auth-devtools).

If you use Better Auth and have the same role-testing loop, [Better Auth DevTools is available on npm](https://www.npmjs.com/package/better-auth-devtools).