onBlur does not fire for TextField when clearButton prop is truthy

[shopifybradleystaples]

Summary

• with keyboard, if I tab off of the TextField I get the onBlur event to fire
• but if I use the clearButton prop, it tabs from Textfield > clearButton > <next thing>, and the onBlur does NOT fire
• if I have an empty TextField with clearButton prop, the clearButton does not render, and so tabbing does fire the onBlur
• using the mouse, clicking from TextField (with or without clearButton) to anything outside of the TextField fires the onBlur

Expected behavior

tabbing off of clearButton also fires onBlur for TextField OR tabbing from TextField > clearButton fires onBlur

Actual behavior

as explained, tabbing while clearButton is visible never fires onBlur

Steps to reproduce

Link to sandbox

1. open browser dev console once on sandbox page
2. tab/click around with values in two TextFields, one with and one without clearButton
3. note how onBlur event is not logged when you'd expect for tabbing around on TextField with clearButton

Are you using React components?

Yes

Polaris version number

"@shopify/polaris-internal": "^16.1.0"

Browser

Chrome Version 130.0.6723.117 (Official Build) (arm64)

Device

MacBook Pro, 14-Inch Nov 2023, MacOs Seqoia 15.1.1 (24B91)