After upgrading to @Ionic/angular@6 when a toast is displayed it prevents focus on input elements, therefore blocking users from fully interacting with the app until the toast is dismissed. I am hoping this behavior isn’t intended as there is no mention of the change on the merge documentation.
I have tested this behavior on three projects using Ionic 6 and I have experienced the same results throughout.
The last project was the angular base ionic project that was upgraded to version 6 by the Ionic Team.
I implemented a basic toast using the code from the ionic documentation and added an ion-input tag to the app component, when the toast is presented using the OnInit function, the input can not be used until the toast is dismissed.
Downgrading the ionic base project to its previous version of Ionic (5.5.2) makes it so the input is useable when the toast is present. I also found this to be true when switching my own project back to 5.8 from 6.0.0.
Hi @Scryer-John, I’m facing the same issue after upgrading to @Ionic/angular@6.
What I discovered so far: my ion-input still owns the focus after displaying the toast (the CSS property “has-focus” is correctly triggered), but the caret inside the input is missing
Not sure why, but inspecting in the HTML element, the create method appends an HTML element called “ion-toast” with some css classes and attributes, one of the attributes is tabindex="-1" and if you remove it in the inspector, the input focus works as expected, so adding the previous code prevents the attribute from being added at all