Skip to content

fix: guard against undefined event.key in ThemeHotkey (fixes #10378)#10404

Open
armorbreak001 wants to merge 1 commit intoshadcn-ui:mainfrom
armorbreak001:fix/issue-10378
Open

fix: guard against undefined event.key in ThemeHotkey (fixes #10378)#10404
armorbreak001 wants to merge 1 commit intoshadcn-ui:mainfrom
armorbreak001:fix/issue-10378

Conversation

@armorbreak001
Copy link
Copy Markdown

Background

The ThemeHotkey component in the generated theme-provider.tsx template attaches a global keydown listener. During browser autofill/autocomplete on Chrome and Edge, a synthetic keydown event is fired where event.key is undefined. The listener calls event.key.toLowerCase() without a null-check, causing an uncaught TypeError.

Solution

Add a guard that checks event.key is truthy before calling .toLowerCase().

Changes

  • templates/next-app/components/theme-provider.tsx — Added !event.key || guard
  • templates/next-monorepo/apps/web/components/theme-provider.tsx — Same guard
  • templates/vite-app/src/components/theme-provider.tsx — Same guard
  • templates/vite-monorepo/apps/web/src/components/theme-provider.tsx — Same guard

Verification

  1. Create a new Next.js project using npx shadcn@latest init
  2. Add an input type=email to a page
  3. Save an autofill entry in Chrome/Edge
  4. Focus the input and select a suggestion from browser autocomplete
  5. Previously: TypeError: Cannot read properties of undefined (reading toLowerCase)
  6. Now: Autofill completes without error

@vercel
Copy link
Copy Markdown
Contributor

vercel bot commented Apr 15, 2026

@armorbreak001 is attempting to deploy a commit to the shadcn-pro Team on Vercel.

A member of the Team first needs to authorize it.

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