Toolbar Active control blur/focus-out events not happening when clicking within in Edge and Chrome

[aagash-ni]

🐛 Bug Report

In Chrome and Edge, when a control (e.g., a button or text field) within a toolbar is focused or active, clicking anywhere else within the toolbar does not blur the currently active control or set its value. However, clicking outside the toolbar works as expected and blurs the active control.

This behavior functions correctly in Firefox, where clicking within the toolbar properly blurs the active control.

💻 Repro or Code Sample

• Click on any element inside the toolbar to make it focused or active.
• Then, click on any other area within the toolbar to blur or remove focus from the currently active control.

🤔 Expected Behavior

• clicking on any area within the toolbar should blur or remove focus from the currently active control, just as it does when clicking outside the toolbar.

😯 Current Behavior

• Clicking within the toolbar does not blur or focus out the currently active control

🔦 Context

Discussion link: https://dev.azure.com/ni/DevCentral/_git/Skyline/pullRequest/850146#1733521296

🌍 Your Environment

• OS: Windows
• Browser: Microsoft Edge, Google Chrome, Mozilla FireFox