Skip to content

feat: add human-readable auth IDs and multiple auth modes#229

Open
antfu wants to merge 1 commit intomainfrom
antfu/human-readable-auth
Open

feat: add human-readable auth IDs and multiple auth modes#229
antfu wants to merge 1 commit intomainfrom
antfu/human-readable-auth

Conversation

@antfu
Copy link
Member

@antfu antfu commented Mar 18, 2026

Description

This PR implements human-readable auth IDs and multiple authentication modes for Vite DevTools:

Features:

  1. Human-readable auth IDs — Replace random nanoid with human-id library, generating IDs like apple-banana-something-words for better UX
  2. Pre-configured auth passwords — Add clientAuthPasswords: string[] config option to auto-approve matching clients without terminal prompts
  3. Auth URL endpoint — Server generates temporary auth IDs for one-click browser authorization via /.devtools/auth?id=xxx, printed in terminal prompt
  4. Terminal prompt abort — Auth prompt aborts automatically on timeout (60s), URL-based auth, or new auth requests
  5. Cross-tab auth sync — BroadcastChannel synchronizes auth updates across browser tabs
  6. Password input UI — Add password/auth-id input field to ViewBuiltinClientAuthNotice for manual entry

Implementation details

  • human-id library added as inlined dependency for smaller bundle size
  • auth-state.ts module manages pending auth state, temporary IDs, and abort controller
  • Server's /auth-verify endpoint consumes temp IDs and resolves pending auth requests
  • Client-side RPC listener watches for BroadcastChannel auth updates and reloads on change
  • All tests pass (203 tests), build succeeds, and code is fully typed

Linked Issues

Closes auth UX improvements

Additional context

This enables three flexible auth workflows:

  1. Terminal prompt (existing) — now with visual auth URL
  2. Password-based auth (new) — for configured passwords
  3. URL-based auth (new) — one-click authorization from terminal link

Add human-readable auth IDs, configurable auth passwords, and an auth URL endpoint:

- Replace random nanoid with human-id (e.g. apple-banana-something-words)
- Add clientAuthPasswords config for pre-approved auth credentials
- Server generates temporary auth IDs for clickable auth URLs (/.devtools/auth?id=xxx)
- Terminal prompt shows auth URL and aborts on timeout (60s), URL usage, or new auth request
- Add BroadcastChannel to sync auth updates across browser tabs
- Add password input UI to ViewBuiltinClientAuthNotice for manual auth entry
- Add auth-state.ts module to manage pending auth state and temp ID consumption

All tests pass, build succeeds, and the feature is fully functional.

Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
@pkg-pr-new
Copy link

pkg-pr-new bot commented Mar 18, 2026

Open in StackBlitz

@vitejs/devtools

npm i https://pkg.pr.new/@vitejs/devtools@229

@vitejs/devtools-kit

npm i https://pkg.pr.new/@vitejs/devtools-kit@229

@vitejs/devtools-rolldown

npm i https://pkg.pr.new/@vitejs/devtools-rolldown@229

@vitejs/devtools-rpc

npm i https://pkg.pr.new/@vitejs/devtools-rpc@229

@vitejs/devtools-self-inspect

npm i https://pkg.pr.new/@vitejs/devtools-self-inspect@229

commit: cdb5d08

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant