bug: Multiple clear icons in searchbar

When using the ion-searchbar like so, <ion-searchbar id="main-search" show-cancel-button="never" animated></ion-searchbar>

There are 2 clear icons shown like this when typing into the searchbar like this:

After digging in, I understood that one of the icons was given by the browser because input type=“search” is being used by ionic with inputmode as search thereby the browser gives a default clearing icon by itself.

In addition to this, Ionic also adds a clear icon when using searchbar making it 2 clear icons.

In any case, only one clear icon must be displayed. Any ideas on how I can go ahead with this?

Currently, I am solving this by explicitly setting the type as text like this:

<ion-searchbar id="main-search" inputmode="search" type="text" show-cancel-button="never" animated></ion-searchbar>

Thanks.

[tvvignesh]

@liamdebeasi I remember getting this error in the browser (when running serving the app directly from www folder). Don’t remember if the same occured in the android device.

[ionitron-bot[bot]]

Thanks for the issue! This issue is being closed due to inactivity. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.

Thank you for using Ionic!