Environment Information

• Package version(s): 7.121.1
• Browser and OS versions: Edge: Version 83.0.478.56 (Official build) (64-bit)

Please provide a reproduction of the bug in a codepen:

Actual behavior:

I'm getting inconsistent behaviour when tracking mouseOver and mouseOut events on an IconButton when triggering the submenu to open. I'm opening the menu with an IButton ref call to openMenu. Sometimes when triggering openMenu with the mouse directly over the button I see mouseOut and then mouseOver in quick succession. I've set the submenuProps shouldFocusOnContainer: false and shouldFocusOnMount: false. Interestingly, when making a codepen repro this behaviour seems more consistent and doesn't call mouseOut.

Codepen that doesn't seem to repro here: https://codepen.io/campbellowen/pen/rNxmeaP?editable=true%3Dhttps%3A%2F%2Fdeveloper.microsoft.com%2F
Here's a storybook component I made with the same code as the codepen, running in my repo, where I do see this issue:

export const ButtonTest = () => {
    const buttonRef = React.createRef<IButton>();
    return (
        <IconButton
            componentRef={buttonRef}
            onMouseOver={() => {
                console.log('Mouse Over');
                setTimeout(
                    () => buttonRef.current?.openMenu(false, false),
                    5000
                );
            }}
            onMouseOut={() => {
                console.log('Mouse Out');
            }}
            menuProps={{
                items: [{ key: 'test', text: 'Test' }],
                shouldFocusOnContainer: false,
                shouldFocusOnMount: false,
            }}
        />
    );
};

I added the delay of 5 seconds to make it more obvious that onMouseOut and onMouseOver are called when the menu opens.

Expected behavior:

onMouseOut and onMouseOver not called, because the mouse never left the button.

Priorities and help requested:

Requesting help identifying why this is happening and how to fix it.

Are you willing to submit a PR to fix? Yes

Requested priority: Normal

Products/sites affected: (if applicable)