fix: Super editor popover menus on iOS (#2061)

packages/mobile/ios/Podfile.lock

@@ -583,7 +583,7 @@ EXTERNAL SOURCES:
 SPEC CHECKSUMS:
   boost: a7c83b31436843459a1961bfd74b96033dc77234
   CocoaAsyncSocket: 065fd1e645c7abab64f7a6a2007a48038fdc6a99
-  DoubleConversion: 5189b271737e1565bdce30deb4a08d647e3f5f54
+  DoubleConversion: 831926d9b8bf8166fd87886c4abab286c2422662
   FBLazyVector: 48289402952f4f7a4e235de70a9a590aa0b79ef4
   FBReactNativeSpec: dd1186fd05255e3457baa2f4ca65e94c2cd1e3ac
   Flipper: 26fc4b7382499f1281eb8cb921e5c3ad6de91fe0
@@ -596,7 +596,7 @@ SPEC CHECKSUMS:
   Flipper-RSocket: d9d9ade67cbecf6ac10730304bf5607266dd2541
   FlipperKit: cbdee19bdd4e7f05472a66ce290f1b729ba3cb86
   fmt: ff9d55029c625d3757ed641535fd4a75fedc7ce9
-  glog: 04b94705f318337d7ead9e6d17c019bd9b1f6b1b
+  glog: 85ecdd10ee8d8ec362ef519a6a45ff9aa27b2e85
   hermes-engine: 2af7b7a59128f250adfd86f15aa1d5a2ecd39995
   libevent: 4049cae6c81cdb3654a443be001fb9bdceff7913
   OpenSSL-Universal: ebc357f1e6bc71fa463ccb2fe676756aff50e88c

packages/web/src/javascripts/App.tsx

@@ -16,6 +16,7 @@ declare global {
     webClient?: DesktopManagerInterface
     electronRemoteBridge?: unknown
     reactNativeDevice?: WebDevice
+    platform?: Platform
 
     application?: WebApplication
     mainApplicationGroup?: ApplicationGroup
@@ -25,7 +26,7 @@ declare global {
 
 import { disableIosTextFieldZoom } from '@/Utils'
 import { IsWebPlatform, WebAppVersion } from '@/Constants/Version'
-import { DesktopManagerInterface, SNLog } from '@standardnotes/snjs'
+import { DesktopManagerInterface, Platform, SNLog } from '@standardnotes/snjs'
 import ApplicationGroupView from './Components/ApplicationGroupView/ApplicationGroupView'
 import { WebDevice } from './Application/Device/WebDevice'
 import { StartApplication } from './Application/Device/StartApplication'
@@ -100,6 +101,7 @@ if (IsWebPlatform) {
 
   setTimeout(() => {
     const device = window.reactNativeDevice || new WebDevice(WebAppVersion)
+    window.platform = device.platform
 
     startApplication(window.defaultSyncServer, device, window.enabledUnfinishedFeatures, window.websocketUrl).catch(
       console.error,

packages/web/src/javascripts/Hooks/useDocumentRect.ts

@@ -1,9 +1,14 @@
+import { isIOS } from '@/Utils'
 import { useEffect, useState } from 'react'
 
 const DebounceTimeInMs = 100
 
+const getBoundingClientRect = () => {
+  return isIOS() ? document.body.getBoundingClientRect() : document.documentElement.getBoundingClientRect()
+}
+
 export const useDocumentRect = (): DOMRect => {
-  const [documentRect, setDocumentRect] = useState<DOMRect>(document.documentElement.getBoundingClientRect())
+  const [documentRect, setDocumentRect] = useState<DOMRect>(getBoundingClientRect())
 
   useEffect(() => {
     let debounceTimeout: number
@@ -12,7 +17,7 @@ export const useDocumentRect = (): DOMRect => {
       window.clearTimeout(debounceTimeout)
 
       window.setTimeout(() => {
-        setDocumentRect(document.documentElement.getBoundingClientRect())
+        setDocumentRect(getBoundingClientRect())
       }, DebounceTimeInMs)
     }
 

packages/web/src/javascripts/Utils/Utils.ts

@@ -174,7 +174,8 @@ export const convertStringifiedBooleanToBoolean = (value: string) => {
 // https://stackoverflow.com/questions/9038625/detect-if-device-is-ios/9039885#9039885
 export const isIOS = () =>
   (/iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream) ||
-  (navigator.userAgent.includes('Mac') && 'ontouchend' in document && navigator.maxTouchPoints > 1)
+  (navigator.userAgent.includes('Mac') && 'ontouchend' in document && navigator.maxTouchPoints > 1) ||
+  window.platform === Platform.Ios
 
 // https://stackoverflow.com/a/57527009/2504429
 export const disableIosTextFieldZoom = () => {