fix: prevent terminal shortcuts from intercepting keystrokes in editable elements

Replace fragile tagName checks with a robust isEditableTarget() helper that
covers input, textarea, select, and contenteditable elements. Also add
Cmd/Ctrl+Enter support and stopPropagation to the WorktreeMetaDialog comment
textarea so Enter doesn't trigger terminal handlers.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Jinjing
2026-03-25 09:48:19 -07:00
co-authored by Claude Opus 4.6
parent 8da05ff386
commit 1bfacd2a59
2 changed files with 24 additions and 6 deletions
@@ -117,8 +117,9 @@ const WorktreeMetaDialog = React.memo(function WorktreeMetaDialog() {
const handleCommentKeyDown = useCallback(
(e: React.KeyboardEvent<HTMLTextAreaElement>) => {
if (e.key === 'Enter' && !e.shiftKey) {
if (e.key === 'Enter' && (e.metaKey || e.ctrlKey || !e.shiftKey)) {
e.preventDefault()
e.stopPropagation()
handleSave()
}
},
@@ -201,7 +202,7 @@ const WorktreeMetaDialog = React.memo(function WorktreeMetaDialog() {
className="w-full min-w-0 rounded-md border border-input bg-transparent px-3 py-2 text-xs shadow-xs transition-[color,box-shadow] outline-none placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 resize-none max-h-60 overflow-y-auto"
/>
<p className="text-[10px] text-muted-foreground">
Press Enter to save, Shift+Enter for a new line.
Press Enter or Cmd+Enter to save, Shift+Enter for a new line.
</p>
</div>
</div>
@@ -2,6 +2,19 @@ import { useEffect } from 'react'
import type { PaneManager } from '@/lib/pane-manager/pane-manager'
import type { PtyTransport } from './pty-transport'
function isEditableTarget(target: EventTarget | null): boolean {
if (!(target instanceof HTMLElement)) {
return false
}
if (target.isContentEditable) {
return true
}
const editableAncestor = target.closest('input, textarea, select, [contenteditable=""], [contenteditable="true"]')
return editableAncestor !== null
}
type KeyboardHandlersDeps = {
isActive: boolean
managerRef: React.RefObject<PaneManager | null>
@@ -36,6 +49,9 @@ export function useTerminalKeyboardShortcuts({
if (e.repeat) {
return
}
if (isEditableTarget(e.target)) {
return
}
if (!e.metaKey || e.altKey || e.ctrlKey) {
return
}
@@ -148,8 +164,7 @@ export function useTerminalKeyboardShortcuts({
if (e.key !== 'Backspace') {
return
}
const tag = (e.target as HTMLElement)?.tagName
if (tag === 'INPUT' || tag === 'TEXTAREA') {
if (isEditableTarget(e.target)) {
return
}
@@ -177,8 +192,7 @@ export function useTerminalKeyboardShortcuts({
if (e.key !== 'Backspace') {
return
}
const tag = (e.target as HTMLElement)?.tagName
if (tag === 'INPUT' || tag === 'TEXTAREA') {
if (isEditableTarget(e.target)) {
return
}
@@ -205,6 +219,9 @@ export function useTerminalKeyboardShortcuts({
if (e.key !== 'Enter') {
return
}
if (isEditableTarget(e.target)) {
return
}
const manager = managerRef.current
if (!manager) {