Mobile: When target is input type="text"

[critchie]

I have an input of type "text" that is set to be the target of a drop. The idea is that the app will display the drop when the input gets focus (user clicks in the box for example). This works fine in a desktop browser. However, on my iPad using either Safari or Chrome, when the input receives the focus the drop displays but the keyboard does not display.

When I remove the drop code the input/keyboard work as they should.

I thought it may be a z-index issue but nothing I tried worked. Something about displaying the drop is stopping the keyboard from displaying.

This is an angular 2 app and I'm using the latest npm tether-drop and @types/tether-drop.