From d0516143423afaf6fe9c6db71ee67e5aef99b013 Mon Sep 17 00:00:00 2001
From: Hailey <me@haileyok.com>
Date: Thu, 23 May 2024 08:45:24 -0700
Subject: implement a safari hack for ime (#4186)

remove debug logs

use a better hack

implement a safari hack

extract `isSafari` and `isFirefox` to a global variable
---
 .../Messages/Conversation/MessageInput.web.tsx       | 20 ++++++++++++++++++++
 1 file changed, 20 insertions(+)

(limited to 'src/screens/Messages/Conversation/MessageInput.web.tsx')

diff --git a/src/screens/Messages/Conversation/MessageInput.web.tsx b/src/screens/Messages/Conversation/MessageInput.web.tsx
index 3e78608a7..55599bed6 100644
--- a/src/screens/Messages/Conversation/MessageInput.web.tsx
+++ b/src/screens/Messages/Conversation/MessageInput.web.tsx
@@ -10,6 +10,7 @@ import {
   useMessageDraft,
   useSaveMessageDraft,
 } from '#/state/messages/message-drafts'
+import {isSafari} from 'lib/browser'
 import * as Toast from '#/view/com/util/Toast'
 import {atoms as a, useTheme} from '#/alf'
 import {useSharedInputStyles} from '#/components/forms/TextField'
@@ -47,6 +48,25 @@ export function MessageInput({
     (e: React.KeyboardEvent<HTMLTextAreaElement>) => {
       // Don't submit the form when the Japanese or any other IME is composing
       if (isComposing.current) return
+
+      // see https://github.com/bluesky-social/social-app/issues/4178
+      // see https://www.stum.de/2016/06/24/handling-ime-events-in-javascript/
+      // see https://lists.w3.org/Archives/Public/www-dom/2010JulSep/att-0182/keyCode-spec.html
+      //
+      // On Safari, the final keydown event to dismiss the IME - which is the enter key - is also "Enter" below.
+      // Obviously, this causes problems because the final dismissal should _not_ submit the text, but should just
+      // stop the IME editing. This is the behavior of Chrome and Firefox, but not Safari.
+      //
+      // Keycode is deprecated, however the alternative seems to only be to compare the timestamp from the
+      // onCompositionEnd event to the timestamp of the keydown event, which is not reliable. For example, this hack
+      // uses that method: https://github.com/ProseMirror/prosemirror-view/pull/44. However, from my 500ms resulted in
+      // far too long of a delay, and a subsequent enter press would often just end up doing nothing. A shorter time
+      // frame was also not great, since it was too short to be reliable (i.e. an older system might have a larger
+      // time gap between the two events firing.
+      if (isSafari && e.key === 'Enter' && e.keyCode === 229) {
+        return
+      }
+
       if (e.key === 'Enter') {
         if (e.shiftKey) return
         e.preventDefault()
-- 
cgit 1.4.1

