On blur following <Textfield type="number" ... > component spinner click doesn't happen

[curtisburns]

Issue summary

OnBlur doesn't happen after interacting with the number spinners without first clicking inside the field itself. This is an issue when it comes to field/form validation or simply updating the state/fields with the final values on the blur event.

Expected behavior

Users should interact with a number field in any way, either via the spinners or direct key input, and trigger the onBlur event for that field after interacting with any other element as you would expect.

Actual behavior

Any interaction with other elements following a key input into a number field triggers the onBlur for that field correctly as focus shifts. If incrementing or decrementing a value with the spinners, however, the onBlur event is never triggered, and that field, including any other number fields that have been used to increment/decrement values, will remain focused. In order to remove the focus, users have to click inside the textbox, then click out of it.

Steps to reproduce the problem

1. Add the <Textfield type="number" ... > component to a page.
2. Run in the browser and interact with the input as described above, i.e both key input and spinners.
3. Note how the focus remains after interaction with spinners only until you click back inside the field, then click back out.

Specifications

• Are you using the React components? (Y/N): Y
• Polaris version number: Both 9.15.0 and 9.19.0
• Browser: Firefox, Chrome, Edge, Safari
• Device: Desktop
• Operating System: macOS Big Sur 11.5.2

👋 Thanks for opening your first issue. A contributor should give feedback soon. If you haven’t already, please check out the contributing guidelines.

[chloerice]

Thanks for raising this @curtisburns! Related to #6117 and #5931

[bkspace]

Have validated that this bug only appears from v9.12.0 and up, so if you run into this bug, the quickest solution is just to revert back to v9.11.0

[thefaded]

Same for me, when you have activator as TextField on Popover, then input only focuses after 2nd click. On 9.11.0 everything works fine.

[chloerice]

Closed by #8091