I have an Angular 4 app using a typeahead feature, currently being interfered with for users on Edge. Edge is populating an autocomplete dropdown that shows on top of the typeahead dropdown. Normally this wouldn't be more than annoyance except for the following scenario:
The user needs to select something we'll call a Case Name. It's likely that by this stage they've typed out the Case Name elsewhere on the application. Subsequently, when they click on this particular typeahead, they may see the Case Name they're looking for in the Edge autocomplete dropdown. If they use that, rather than the Input's typeahead, the corresponding Case ID never gets registered with the component, and this component executes a save using an ID, not a name. Essentially the user sees a valid Case Name, clicks save, and gets an error pop-up.
Moreover, the Input currently uses a typeahead select event to respond to an input change, rather than Angular's two-way data binding [(ngModel)]
.
I found virtually the exact issue in this GitHub issue, but they reference autocomplete="off"
as being a working solution, however neither autocomplete="off"
nor autocomplete="false"
seem to have any effect on the input
or form
tags in my case.
Similarly, this post has a discouraging response suggesting Edge had disabled autocomplete="off"
and didn't seem to offer any alternatives.
I also found this response to a post using a fake series of inputs, but it seems this only applies to login credential autofilling.