fix: <input> in ShadowDOM will open docsearch (#2212)

mantou132 · 8bittitan · web-flow · commit ec351710b134 · 2025-03-14T16:53:27.000-04:00
Co-authored-by: Paul Jankowski &lt;33367713+8bittitan@users.noreply.github.com&gt;
diff --git a/packages/docsearch-react/src/useDocSearchKeyboardEvents.ts b/packages/docsearch-react/src/useDocSearchKeyboardEvents.ts
@@ -9,7 +9,7 @@ export interface UseDocSearchKeyboardEventsProps {
 }
 
 function isEditingContent(event: KeyboardEvent): boolean {
-  const element = event.target as HTMLElement;
+  const element = event.composedPath()[0] as HTMLElement;
   const tagName = element.tagName;
 
   return element.isContentEditable || tagName === 'INPUT' || tagName === 'SELECT' || tagName === 'TEXTAREA';

Original file line number	Diff line number	Diff line change
`@@ -9,7 +9,7 @@ export interface UseDocSearchKeyboardEventsProps {`
`9`	`9`	`}`
`10`	`10`
`11`	`11`	`function isEditingContent(event: KeyboardEvent): boolean {`
`12`		`- const element = event.target as HTMLElement;`
	`12`	`+ const element = event.composedPath()[0] as HTMLElement;`
`13`	`13`	`const tagName = element.tagName;`
`14`	`14`
`15`	`15`	`return element.isContentEditable \|\| tagName === 'INPUT' \|\| tagName === 'SELECT' \|\| tagName === 'TEXTAREA';`