iOS 14 and Embedded App, Safari getElementById().focus() via onclick works only first time

173 13 33

I suspect this is an iOS / safari issue and not a Shopify one, but I thought I'd ask here as well. 

I have an embedded Shopify app where I have an onclick event that triggers a function which then calls getElementById().focus() on a text input. On the first tap, it will work just fine and open the keyboard. On subsequent taps, however, it no longer focuses on the text input and it requires the user to tap on the text input. This is happening both within Shopify POS as well as when the app is embedded within Shopify Admin in iOS Safari itself. 

I believe I have isolated the cause of this to updating to iOS 14 (I am testing this on a physical 6th gen iPad). I have verified that on a physical iPhone running iOS 13, xcode iPad simulator running iOS 13.4, and another physical iPad running iOS 12, the .focus() still works as intended.

Pre iOS 14 behavior:

After iOS 14 update:

Has anyone else experienced this? Is there a workaround? Thank you.