Site Picker: Esc key doesn't clear search input on non-Webkit browsers

[alisterscott]

The PR #5583 introduces esc key handling for the site picker.

On non-webkit browsers (Firefox, IE11, Edge) when a user has more than 5 sites if they have entered a search term the esc key doesn't clear the field when it should (Chrome, Safari OK)

Steps to reproduce

1. Starting at URL: https://calypso.live/?branch=add/escape-from-site-picker
2. Use site picker for account with more than 5 sites
3. Enter search text and then hit esc

What I expected

Search field to clear, another esc should close picker

What happened instead

Nothing

Browser / OS version

Firefox OSX Latest
IE11 Windows 10
Edge Windows 10

[marekhrabe]

We are not handling the ESC and clearing the input ourselves. The current behavior is a side effect of using <input type="search"> that has this clearing by ESC implemented in WebKit.

I would much rather use just basic <input type="text"> and implement clearing and closing in our code. That way it would be predictable and work the same across all browsers.

[blowery]

I would much rather use just basic and implement clearing and closing in our code. That way it would be predictable and work the same across all browsers.

I believe the fly up keyboard used on ios and android is different when the type is search. What else are we losing by moving off search?

[blowery]

Oof. https://css-tricks.com/webkit-html5-search-inputs/

That makes me want to run from search. Looks like it doesn't really offer any benefits.

[hoverduck]

#bug-scrub

Looks like this is no longer an issue. esc closes the Site Picker on all browsers I tested - Chrome, Firefox, and IE11

[marekhrabe]

This wasn't fixed, so I'm reopening. When there is some content inside of input, the first press of esc should clear the input, the second press should close the picker.

Just tested with last Firefox and the problem still persist at least for SitePicker component (located in the left sidebar as "← Switch Site")

[alisterscott]

This has been fixed and is no longer an issue. Closing.