Masterbar: Auto-focus on site picker search field after clicking on new post icon

[rachelmcr]

Steps to reproduce

1. Starting at URL: https://wordpress.com/
2. Click on new post icon in the masterbar
3. When the site picker opens, start typing or use the arrow keys to try to select a site

What I expected

I expect the search field in the site picker to get auto-focus, so I can immediately start searching for the right blog where I want to create a new post.

Every time I start a new post in Calypso, I run into this issue — I just expect to be able to start typing immediately after opening the site picker. It's always disappointing when I realize nothing I typed had any effect and I have to go back, click on the search field, and type again.

It also seems like a clear win to auto-focus somewhere in the site picker, since the user is expected to continue the flow by selecting a site to open the editor.

What happened instead

When the site picker opens, neither the search field nor the site list get focus, so typing (to search) or using the arrow keys (to browse the list) don't work. Hitting enter closes the site picker, but I need to manually click on the search field to focus on it and search.

Using the arrow keys at this point, with the expectation that you can use them to select a site in the picker, is especially jarring because it starts scrolling the Reader underneath the site picker instead.

Browser / OS version

Chrome 50.0.2661.102 and Firefox 47.0 / Mac OSX 10.11.5

Screenshot / Video

Context / Source

dogfooding

[marekhrabe]

I'm addressing this in #5808. I hope it will be merged soon :)

[lancewillett]

Bug scrub note: #5808 changes are close but still in testing.