diff --git a/packages/react-select/src/Select.tsx b/packages/react-select/src/Select.tsx
index 16daa33094..9bce8d7c09 100644
--- a/packages/react-select/src/Select.tsx
+++ b/packages/react-select/src/Select.tsx
@@ -1360,18 +1360,22 @@ export default class Select<
   onTouchEnd = (event: TouchEvent) => {
     if (this.userIsDragging) return;
 
+    const target =
+        event.target instanceof Element && event.target.shadowRoot && event.composedPath?.()[0] || event.target;
     // close the menu if the user taps outside
     // we're checking on event.target here instead of event.currentTarget, because we want to assert information
     // on events on child elements, not the document (which we've attached this handler to).
     if (
-      this.controlRef &&
-      !this.controlRef.contains(event.target as Node) &&
-      this.menuListRef &&
-      !this.menuListRef.contains(event.target as Node)
+        !target ||
+        !(target instanceof Element) ||
+        (this.controlRef &&
+            !this.controlRef.contains(target) &&
+            this.menuListRef &&
+            !this.menuListRef.contains(target))
     ) {
       this.blurInput();
     }
-
+    
     // reset move vars
     this.initialTouchX = 0;
     this.initialTouchY = 0;