fix(picker-column): fallback to elementFromPoint for iOS 16 Shadow DOM bug

Co-authored-by: Vilhelm Josander <[email protected]>

Author: thetaPC

core/src/components/picker-column/picker-column.tsx

@@ -376,7 +376,23 @@ export class PickerColumn implements ComponentInterface {
          * elementsFromPoint can returns multiple elements
          * so find the relevant picker column option if one exists.
          */
-        const newActiveElement = elementsAtPoint.find((el) => el.tagName === 'ION-PICKER-COLUMN-OPTION');
+        let newActiveElement = elementsAtPoint.find((el) => el.tagName === 'ION-PICKER-COLUMN-OPTION');
+
+        /**
+         * TODO(FW-6594): Remove this workaround when iOS 16 is no longer
+         * supported.
+         *
+         * If `elementsFromPoint` failed to find the active element (a known
+         * issue on iOS 16 when elements are in a Shadow DOM and the
+         * referenceNode is the document), a fallback to `elementFromPoint`
+         * is used. While `elementsFromPoint` returns all elements,
+         * `elementFromPoint` returns only the top-most, which is sufficient
+         * for this use case and appears to handle Shadow DOM retargeting
+         * more reliably in this specific iOS bug.
+         */
+        if (!newActiveElement) {
+          newActiveElement = referenceNode.elementFromPoint(centerX, centerY) as HTMLIonPickerColumnOptionElement;
+        }
 
         if (activeEl !== undefined) {
           this.setPickerItemActiveState(activeEl, false);