Wrong toolbar button getting focused when the toolbar receives focus

[vivinkrishna-ni]

🐛 Bug Report

In nimble-toolbar, button focusing operates based on the tabindex value. However, when clicking (mouse down) on another button with tabindex=-1, the button with tabindex=0 receives focus during the mouse down event. This makes the nimble-button being focused when clicking another button.

Note: This issue is reproducible only in the Chrome browser.

💻 Repro or Code Sample

1. Adding another control for the nimble-toolbar (in the below example added textarea)
2. In the click event, add a focus event to the other control (say textarea)
3. Click the button that is not recently focused (i.e. not the one with tabindex=0)

🤔 Expected Behavior

No button in the toolbar should receive focus.

😯 Current Behavior

The button with the tabindex=0 receives focus.

💁 Possible Solution

🔦 Context

It is needed in the nimble-rich-text-editor as we focus back on the editor when a formatting button in the nimble-toolbar is clicked.
For more details, see #1416 (comment) (Issue 1)

🌍 Your Environment

• OS & Device: Windows on PC
• Browser Google Chrome
• Version 115.0.5790.170

[mollykreis]

The issue appears to be in the FAST toolbar, as I can reproduce the problem in their toolbar as well. The toolbar's clickHandler changes the newly clicked item to be the focused item, but this handler doesn't run until the click event occurs (which is on mouse up). However, the toolbar's focusinHandler re-focus what was previously focused when the toolbar receives focus. The focusinHandler runs on mouse down, so the previously focused item gets the focus-visible styling while the mouse is pressed, and then the clickHandler adjusts the focused element when the mouse is released.

[mollykreis]

I created microsoft/fast#6819 to track the underlying issue in the FAST toolbar.

However, we should also evaluate whether adding pointer-events: none to some of our nimble styles makes sense, such as the start and end slots of our button styles.

Edit: I added this comment to the wrong issue. This comment doesn't apply to this issue.

[mollykreis]

I created microsoft/fast#6835 to track the underlying issue in the FAST toolbar.

[jattasNI]

Marking as blocked to reflect the dependency on the FAST issue