requestFocus() call crashes on iOS

Bug description: When I call requestFocus() on a webview I’m getting this error: dispatchViewManagerCommand must be called with a string or integer command This happens only on iOS, android looks OK.

To Reproduce: Pull the repro I made here: https://github.com/alexisbronchart/WebViewFocus

Expected behavior: The app should load the webview with the text input already focused as it does on android.

Environment:

• OS: iOS
• OS version: 13
• react-native version: 0.61.4
• react-native-webview version: 7.5.1

[Slapbox]

Thanks for your reply @seanstrom.

I can confirm that calling .focus on an element through the injectedJavaScript prop was a “good-enough” workaround.

You’re right! After simply removing webview.current.requestFocus() it fixed the issue. Kind of baffling that it would break the app to call a supported method that’s required to achieve focusing the contents on Android, but ¯\_(ツ)_/¯ - at least it works!

[seanstrom]

@Slapbox It’s been a while since I’ve dug into this, though I can try to help 😃. I’m not sure what the best way to compare notes will be, but I think I can post a demo with react-native-webview and expo. Are there any other dependencies that you’re using in your code? Can you provide a small example of how you’re using the ref version of the API? I’m not as familiar with the ref API in this case.

Based on my experience of using react-native-webview, I can confirm that calling .focus on an element through the injectedJavaScript prop was a “good-enough” workaround. Though, there’s a chance that loading the initial HTML or content of the webview isn’t “ready” before the .focus call on the node. In my case, I was loading the HTML and waiting for the page to fully load before calling .focus, I may even have deferred the call with a setTimeout too.

Some ideas for debugging:

• Double check the injected code is running, maybe with a console.log statement
• Verify that the element is being focused, you can try to attach styles or event handlers on the element to detect focus
• Potentially play around with setTimeout around the .focus call, this can help with DOM elements that aren’t ready