Webview, which is wrapped around native Views, gets focus upon the first touch. Android only

[aryojamousi]

As it was described in this issue, a wrapped Webview inside native views gets focus upon the first touch on it.
#26858
This problem only appears on Android and we cannot reproduce it on iOS.

React Native version:

System:
    OS: macOS 10.15.2
    CPU: (4) x64 Intel(R) Core(TM) i5-4278U CPU @ 2.60GHz
    Memory: 21.32 MB / 8.00 GB
    Shell: 3.2.57 - /bin/bash
  Binaries:
    Node: 12.13.1 - ~/.nvm/versions/node/v12.13.1/bin/node
    Yarn: 1.12.3 - /usr/local/bin/yarn
    npm: 6.12.1 - ~/.nvm/versions/node/v12.13.1/bin/npm
  SDKs:
    iOS SDK:
      Platforms: iOS 13.1, DriverKit 19.0, macOS 10.15, tvOS 13.0, watchOS 6.0
    Android SDK:
      API Levels: 23, 24, 25, 26, 27, 28
      Build Tools: 23.0.1, 25.0.2, 26.0.2, 26.0.3, 27.0.3, 28.0.0, 28.0.1, 28.0.3
      System Images: android-19 | Google APIs Intel x86 Atom, android-22 | Google APIs Intel x86 Atom, android-23 | Google APIs Intel x86 Atom, android-26 | Google Play Intel x86 Atom, android-27 | Google APIs Intel x86 Atom, android-28 | Google APIs Intel x86 Atom, android-28 | Google Play Intel x86 Atom
  IDEs:
    Android Studio: 3.3 AI-182.5107.16.33.5264788
    Xcode: 11.1/11A1027 - /usr/bin/xcodebuild
  npmPackages:
    react: 16.9.0 => 16.9.0 
    react-native: 0.61.5 => 0.61.5

Steps To Reproduce

1. create react native App
2. install react-native-webview dependency
3. use code snippet from below

return (
    <ScrollView>
      <Text style={{ fontSize: 20 }}>Native Component</Text>
      <Text>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</Text>
      <Text style={{ fontSize: 20 }}>WebView</Text>
      <WebView style={{ height: 1000 }} source={{ uri: 'https://www.lipsum.com/' }} />
    </ScrollView>
);

Snack, code example, screenshot, or link to a repository:

https://snack.expo.io/@aryojaam/webview-scrollview-problem

Cause

We think that this PR has caused this problem. Particularly this method
We first experienced this problem when we upgraded our project from react-native 59.x to react-native 60.x

[Zynio]

+1 .I have the same problem.

@ontzic Can you help us?

[fabOnReact]

#25105 has no attached issue and no reproducible example, it is hard to fix this bug and test for regressions

I don't have a clear understanding of the below bug from #25105 and currently I don't know how to reproduce it.

... when paged this allows focus on elements that are not within the current page. Combined with logic to scroll to the focused view, this breaks the paging for ReactHorizontalScrollView.

Focus should not trigger on element that are not within the current page, but to test for regressions we would need to see the mentioned logic

[fabOnReact]

react-native-webview/react-native-webview#951

[fabOnReact]

I am working on a pr for this issue that checks that focused is not instanceof SimpleViewManager

react-native/ReactAndroid/src/main/java/com/facebook/react/views/scroll/ReactScrollView.java

Lines 251 to 257 in 60b7a30

	@Override
	public void requestChildFocus(View child, View focused) {
	if (focused != null) {
	scrollToChild(focused);
	}
	super.requestChildFocus(child, focused);
	}

This is the value passed as focused WebView

com.reactnativecommunity.webview.RNCWebViewManager$RNCWebView{bf6a567 VFEDHVC.. .F...... 0,0-1080,2750 #11}

[bashen1]

same issue

[ngsayjoe]

Can confirm that the issue still persists as of 0.63.4

[shushu2013]

react-native: 0.66.4
same issue