autocomplete: tapping autocomplete does not focus input on iOS

[Splaktar]

Bug

CodePen and steps to reproduce the issue:

CodePen Demo which demonstrates the issue:

https://codepen.io/Splaktar/pen/XWrZYbp?editors=1010#0

Detailed Reproduction Steps:

1. Tap an md-autocomplete
2. Virtual keyboard automatically opens
3. Type "Ha"

What is the expected behavior?

The letters "Ha" should show up in the input and the only option displayed should be Hawaii.

What is the current behavior?

The "Ha" keys are ignored and only the default list of all 50 states is displayed.
You can tap around enough to finally get focus on the input so that you can type, but it is frustrating and error prone.

What is the use-case or motivation for changing an existing behavior?

Basic UX.

Which versions of AngularJS, Material, OS, and browsers are affected?

• AngularJS: 1.7.8
• AngularJS Material: 1.1.2+
• OS: iOS
• Browsers: Safari 12.4.1

Is there anything else we should know? Stack Traces, Screenshots, etc.

This is a regression introduced in AngularJS Material 1.1.2.

This is still an issue on HEAD even after PR #11782 which improves autocomplete UX on touch devices.

I'm not sure which of the autocomplete changes in 1.1.2 caused this.

This issue does not occur on Android with Chrome 76.

[Splaktar]

This can no longer be reproduced on iOS 14 in the above CodePen or in the demo on the docs site.