Similar issue

There is a related issue already registered on Callout component. The pull request suggested would solve this Datepicker issue as well:
#19797

Environment Information

• Package version(s): @fluentui/react: 8.29.1
"react": "17.0.2"
• Browser and OS versions: Not relevant - fails similarly in all major browsers

Please provide a reproduction of the bug in a codepen:

Reproduction of the issue:
 https://codesandbox.io/s/fluentui-datepicker-9rlyo


• Render Datepicker from a shadow-dom (ie. web-component)
• Pick a date
• The Callout dismisses and the Datepicker closes without picking a date

The bug is in Callout, in dismissOnClickOrScroll which ev.target. It should read event's composedPath.

Expected behavior:

dismissOnClickOrScroll gets its target from ev.composedPath and properly calculates isEventTargetOutsideCallout.

Priorities and help requested:

Are you willing to submit a PR to fix?

This PR fixes the bug: #19798

Requested priority: Blocking -> We are unable to use Datepicker within our solution for now