Wp-calypso: Signup: domains input type=search with CSS height disables cursor placement in Chrome

[ramonjd]

Making sure you're using Chrome, head over to the signup domain step (at https://wordpress.com/start), enter a search query, then attempt to place your cursor somewhere in the text field value.

The rebellious cursor won't go where you want it to go!

It seems to be due to adding a CSS height value to an input type="search" field.

As far as I can tell, this is only occurring in Chrome (not Canary)

I've confirmed this behaviour on several computers. See: https://jsfiddle.net/mn96k3dh/3/

Possible remedies:

1. Remove the height, center the search field
2. Change the input type to text

Steps to reproduce

1. In the latest version of Chrome go to https://wordpress.com/start/domains-with-preview
2. Search for a domain
3. Try to click somewhere within the text field

What I expected

The cursor would land where I click within the text

What happened instead

The cursor either inaccurately lands somewhere in the text string or remains at the end of the field

Browser / OS version

Chrome 77

Screenshot / Video

[DustinHaefele]

Hey, I can fix this.

[ramonjd]

It looks like it's been fixed in Chromium (Build 78), though I have no clue how.

[ramonjd]

Fixed by https://github.com/Automattic/wp-calypso/pull/36190

[sixhours]

36190 caused some other visual regressions and was reverted, so this needs a new solution.

[VictorVermeulen]

Is it correct that this is fixed again? I can't reproduce the problem in Chrome myself.

[sixhours]

I can't reproduce this in Chrome 78. I think whatever bug was present was fixed on Chrome's end in recent updates.