[Bug]: Menu button pop up options not accessible via voiceOver, when background is clickable

Library

React Components / v9 (@fluentui/react-components)

System Info

DEVICE USED: IOS, iphone12pro

Are you reporting Accessibility issue?

yes

Reproduction

https://stackblitz.com/edit/dedagv?file=src%2FApp.tsx

Bug Description

Bug Description

Actual Behavior

When user try to activate the dropdown pop-up menu items using Voiceover 'double tap to activate', here the control is not getting activated. whereas on double tap it closes the menu pop up
The a11y box is bigger than the focus box, hence the selection is not happening.

AND THE OUTER CONTAINER IS CLICKABLE SO THATS WHY ITS NOT GETTING THE VOICE OVER CLICK

NOTE: TRIED IT ON FLUENT V9 DROPDOWN THROUGH SANDBOX LINK

Expected Behavior

All interactive controls should be accessible and actionable using Voiceover swipe gestures and Keyboard.

SIMILAR BUG RAISED ON OUR TEAM BY A11Y TEAM: Bug 3459615: [TFL- School Connection]: The 'Help' pop up menu items are not actionable using Voiceover.

Logs

No response

Requested priority

High

Products/sites affected

No response

Are you willing to submit a PR to fix?

no

Validations

• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• The provided reproduction is a minimal reproducible example of the bug.