bug: In React, IonSearchbar can't be given focus with JS

Bug Report

Ionic version:

[x] 5.0.2

Current behavior:

The IonSearchbar component has a documented function for setting focus setFocus, but it doesn’t seem to work. Calling it does not produce a change in the current focus.

Expected behavior:

Calling setFocus on the searchbar should focus the element and bring the cursor into it.

Steps to reproduce:

See below for the linked repo containing a reproduction of the problem. Basically, all I’m doing is adding a searchbar, getting a ref to it, and then calling setFocus on the ref once it’s resolved. I have found that even if I inspect the element in the browser, set a variable to it in the console, and then call setFocus on that variable it does not work.

Related code:

I have a sample repo to show the problem here:

https://github.com/aub/ionic-searchbar-focus-problems

The only thing I changed in here after creating the app with ionic start focus-problems --type=react --capacitor was to add the searchbar and its setup in the ExploreContainer. I have verified that the console logging is being produced and setFocus is being called on the searchbar.

insert short code snippets here

Other information:

Ionic info:

Ionic:

   Ionic CLI       : 5.4.13 (/usr/local/lib/node_modules/ionic)
   Ionic Framework : @ionic/react 5.0.2

Capacitor:

   Capacitor CLI   : 1.5.0
   @capacitor/core : 1.5.0

Utility:

   cordova-res : not installed
   native-run  : not installed

System:

   NodeJS : v13.8.0 (/usr/local/Cellar/node/13.8.0/bin/node)
   npm    : 6.13.7
   OS     : macOS Catalina

[aub]

Grrr, it’s also working for me now. If you don’t mind, give me a few minutes to figure out what happened here and then if I still can’t reproduce it I’ll close this issue. Sorry about that, thanks for your time.

[aub]

Whoops, sorry I should have included that. This is on the desktop in Chrome.