Improve user experience when interacting with internal search

[Marc4]

When have to make heavy use of the WordPress input browser getting right to click on the "x" to remove the field from the search input can be very frustrating.

We could improve this with a button inside or outside the input, expanding the "x" clickable area.

[joedolson]

Thanks for contributing, @marc4!

The clear search button is a browser feature, and is only available in Webkit and Blink based browsers. We could probably hide it and implement a separate clear search button, but I'm not sure that I see a lot of value in that.

I do think that those clear search buttons are badly implemented in the browsers, but coming up with a consistent cross-browser solution to remove the existing button is a lot of engineering for something that already has multiple paths on the user front.

The search can be cleared using the button, Ctrl + A and delete, or double click and delete; adding a custom method seems excessive.

[Marc4]

Thanks for your response @joedolson

I have created a plugin to add this button. The plugin has been sent for review, but if anyone is interested can download it from here:

​https://github.com/marcarmengou/clear-internal-search-button

[Marc4]

Hi @joedolson, I have recently worked some more on this functionality and wanted to show the progress.

In my tests it works fine in Chrome, Brave and Firefox.

Preview

• ​https://playground.wordpress.net/?plugin=clear-internal-search-button&blueprint-url=https://wordpress.org/plugins/wp-json/plugins/v1/plugin/clear-internal-search-button/blueprint.json?rev=3086729

Download

• ​https://wordpress.org/plugins/clear-internal-search-button/