Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: keep the Android keyboard visible when pasting #42622

Merged
merged 14 commits into from
Jun 17, 2024
Merged
Show file tree
Hide file tree
Changes from 12 commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
10 changes: 5 additions & 5 deletions ios/Podfile.lock
Original file line number Diff line number Diff line change
Expand Up @@ -1852,7 +1852,7 @@ PODS:
- RNGoogleSignin (10.0.1):
- GoogleSignIn (~> 7.0)
- React-Core
- RNLiveMarkdown (0.1.83):
- RNLiveMarkdown (0.1.84):
- glog
- hermes-engine
- RCT-Folly (= 2022.05.16.00)
Expand All @@ -1870,9 +1870,9 @@ PODS:
- React-utils
- ReactCommon/turbomodule/bridging
- ReactCommon/turbomodule/core
- RNLiveMarkdown/common (= 0.1.83)
- RNLiveMarkdown/common (= 0.1.84)
- Yoga
- RNLiveMarkdown/common (0.1.83):
- RNLiveMarkdown/common (0.1.84):
- glog
- hermes-engine
- RCT-Folly (= 2022.05.16.00)
Expand Down Expand Up @@ -2589,7 +2589,7 @@ SPEC CHECKSUMS:
RNFS: 4ac0f0ea233904cb798630b3c077808c06931688
RNGestureHandler: 74b7b3d06d667ba0bbf41da7718f2607ae0dfe8f
RNGoogleSignin: ccaa4a81582cf713eea562c5dd9dc1961a715fd0
RNLiveMarkdown: 88030b7d9a31f5f6e67743df48ad952d64513b4a
RNLiveMarkdown: bf516c02a4549a059829a3fbb8f51c2e0a3110e7
RNLocalize: d4b8af4e442d4bcca54e68fc687a2129b4d71a81
rnmapbox-maps: df8fe93dbd251f25022f4023d31bc04160d4d65c
RNPermissions: 0b61d30d21acbeafe25baaa47d9bae40a0c65216
Expand All @@ -2606,7 +2606,7 @@ SPEC CHECKSUMS:
SocketRocket: f32cd54efbe0f095c4d7594881e52619cfe80b17
Turf: 13d1a92d969ca0311bbc26e8356cca178ce95da2
VisionCamera: 1394a316c7add37e619c48d7aa40b38b954bf055
Yoga: 64cd2a583ead952b0315d5135bf39e053ae9be70
Yoga: 1b901a6d6eeba4e8a2e8f308f708691cdb5db312

PODFILE CHECKSUM: 66a5c97ae1059e4da1993a4ad95abe5d819f555b

Expand Down
8 changes: 4 additions & 4 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -65,7 +65,7 @@
"@babel/plugin-proposal-private-methods": "^7.18.6",
"@babel/plugin-proposal-private-property-in-object": "^7.21.11",
"@dotlottie/react-player": "^1.6.3",
"@expensify/react-native-live-markdown": "0.1.83",
"@expensify/react-native-live-markdown": "0.1.84",
"@expo/metro-runtime": "~3.1.1",
"@formatjs/intl-datetimeformat": "^6.10.0",
"@formatjs/intl-listformat": "^7.2.2",
Expand Down
18 changes: 14 additions & 4 deletions src/hooks/useHtmlPaste/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -18,8 +18,7 @@ const insertAtCaret = (target: HTMLElement, text: string) => {
// Move caret to the end of the newly inserted text node.
range.setStart(node, node.length);
range.setEnd(node, node.length);
selection.removeAllRanges();
selection.addRange(range);
selection.setBaseAndExtent(range.startContainer, range.startOffset, range.endContainer, range.endOffset);

// Dispatch paste event to simulate real browser behavior
target.dispatchEvent(new Event('paste', {bubbles: true}));
Expand All @@ -46,9 +45,20 @@ const useHtmlPaste: UseHtmlPaste = (textInputRef, preHtmlPasteCallback, removeLi
insertByCommand(text);
}

if (!textInputRef.current?.isFocused()) {
textInputRef.current?.focus();
return;
}

// Pointer will go out of sight when a large paragraph is pasted on the web. Refocusing the input keeps the cursor in view.
textInputRef.current?.blur();
textInputRef.current?.focus();
// to avoid the keyboard in mobile web if using blur() and focus() function, we just need to dispatch the event to trigger the onFocus handler
dominictb marked this conversation as resolved.
Show resolved Hide resolved

dominictb marked this conversation as resolved.
Show resolved Hide resolved
// need to trigger the bubbled "focusin" event to make sure the onFocus handler is triggered
dominictb marked this conversation as resolved.
Show resolved Hide resolved
textInputHTMLElement.dispatchEvent(
new FocusEvent('focusin', {
bubbles: true,
}),
);
// eslint-disable-next-line no-empty
} catch (e) {}
// We only need to set the callback once.
Expand Down
Loading