From 93030397bf964e66834c413a2618ba76b00af1a1 Mon Sep 17 00:00:00 2001 From: Chris Bobbe Date: Thu, 17 Mar 2022 15:51:33 -0700 Subject: [PATCH] SmartUrlInput: Remove workaround for an RN bug that's less bothersome now Less bothersome because, after the previous commit, the only remaining .focus() call is for convenience (autofocus when back-navigating to the screen), not necessity. With this RN bug, whether we work around it or not, it remains possible to focus a TextInput by tapping on it. So why "necessity"? Before the previous commit, we had a hack where text elements were trying to blend in as part of a TextInput, with the real TextInput being as little as 1px wide when empty. So, pressing the text elements was an important way to give the input focus, and that was achieved with .focus(). --- src/common/SmartUrlInput.js | 57 +------------------------------------ 1 file changed, 1 insertion(+), 56 deletions(-) diff --git a/src/common/SmartUrlInput.js b/src/common/SmartUrlInput.js index 22a362be279..daab8bbf989 100644 --- a/src/common/SmartUrlInput.js +++ b/src/common/SmartUrlInput.js @@ -1,7 +1,7 @@ /* @flow strict-local */ import React, { useState, useRef, useCallback, useContext } from 'react'; import type { Node } from 'react'; -import { Platform, TextInput, View, Keyboard } from 'react-native'; +import { TextInput, View } from 'react-native'; import { useFocusEffect } from '@react-navigation/native'; import type { ViewStyleProp } from 'react-native/Libraries/StyleSheet/StyleSheet'; @@ -32,59 +32,6 @@ type Props = $ReadOnly<{| enablesReturnKeyAutomatically: boolean, |}>; -/** - * Work around https://github.com/facebook/react-native/issues/19366. - * - * The bug: If the keyboard is dismissed only by pressing the built-in - * Android back button, then the next time you call `.focus()` on the - * input, the keyboard won't open again. On the other hand, if you call - * `.blur()`, then the keyboard *will* open the next time you call - * `.focus()`. - * - * This workaround: Call `.blur()` on the input whenever the keyboard is - * closed, because it might have been closed by the built-in Android back - * button. Then when we call `.focus()` the next time, it will open the - * keyboard, as expected. (We only maintain that keyboard-closed listener - * when this SmartUrlInput is on the screen that's focused in the - * navigation.) - * - * Other workarounds that didn't work: - * - When it comes time to do a `.focus()`, do a sneaky `.blur()` first, - * then do the `.focus()` 100ms later. It's janky. This was #2078, - * probably inspired by - * https://github.com/facebook/react-native/issues/19366#issuecomment-400603928. - * - Use RN's `BackHandler` to actually listen for the built-in Android back - * button being used. That didn't work; the event handler wasn't firing - * for either `backPress` or `hardwareBackPress` events. (We never - * committed a version of this workaround.) - */ -function useRn19366Workaround(textInputRef) { - if (Platform.OS !== 'android') { - return; - } - - // (Disabling `react-hooks/rules-of-hooks` here is fine; the relevant rule - // is not to call Hooks conditionally. But the platform conditional won't - // vary in its behavior between multiple renders.) - - // eslint-disable-next-line react-hooks/rules-of-hooks - useFocusEffect( - // eslint-disable-next-line react-hooks/rules-of-hooks - React.useCallback(() => { - const handleKeyboardDidHide = () => { - if (textInputRef.current) { - // `.current` is not type-checked; see definition. - textInputRef.current.blur(); - } - }; - - Keyboard.addListener('keyboardDidHide', handleKeyboardDidHide); - - return () => Keyboard.removeListener('keyboardDidHide', handleKeyboardDidHide); - }, [textInputRef]), - ); -} - export default function SmartUrlInput(props: Props): Node { const { style, onChangeText, onSubmitEditing, enablesReturnKeyAutomatically } = props; @@ -126,8 +73,6 @@ export default function SmartUrlInput(props: Props): Node { [onChangeText], ); - useRn19366Workaround(textInputRef); - return (