diff --git a/src/DocSearch.tsx b/src/DocSearch.tsx
index 7a174a6e0..bce446bc6 100644
--- a/src/DocSearch.tsx
+++ b/src/DocSearch.tsx
@@ -29,6 +29,7 @@ export interface DocSearchProps
 
 export function DocSearch(props: DocSearchProps) {
   const [isOpen, setIsOpen] = React.useState(false);
+  const searchButtonRef = React.useRef<HTMLButtonElement>(null);
 
   const onOpen = React.useCallback(() => {
     setIsOpen(true);
@@ -38,11 +39,11 @@ export function DocSearch(props: DocSearchProps) {
     setIsOpen(false);
   }, [setIsOpen]);
 
-  useDocSearchKeyboardEvents({ isOpen, onOpen, onClose });
+  useDocSearchKeyboardEvents({ isOpen, onOpen, onClose, searchButtonRef });
 
   return (
     <>
-      <DocSearchButton onClick={onOpen} />
+      <DocSearchButton onClick={onOpen} ref={searchButtonRef} />
 
       {isOpen &&
         createPortal(
diff --git a/src/useDocSearchKeyboardEvents.ts b/src/useDocSearchKeyboardEvents.ts
index ac86a72a0..79040e3eb 100644
--- a/src/useDocSearchKeyboardEvents.ts
+++ b/src/useDocSearchKeyboardEvents.ts
@@ -25,7 +25,10 @@ export function useDocSearchKeyboardEvents({
         }
       }
 
-      if (searchButtonRef.current === document.activeElement) {
+      if (
+        searchButtonRef &&
+        searchButtonRef.current === document.activeElement
+      ) {
         if (/[a-zA-Z0-9]/.test(String.fromCharCode(event.keyCode))) {
           onOpen();
         }