[Bug]: Card component - If focusMode = 'tab-only', and the Card has an onClick event handler, then focusMode regresses to no-tab behaviour

[katiearriagam]

Library

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

System Info

System:
    OS: Windows 10 10.0.22631
    CPU: (12) x64 12th Gen Intel(R) Core(TM) i7-1265U
    Memory: 14.86 GB / 31.83 GB
  Browsers:
    Edge: Chromium (123.0.2420.97)
    Internet Explorer: 11.0.22621.3527

Are you reporting Accessibility issue?

yes

Reproduction

https://stackblitz.com/edit/4g3qid?file=src%2Fexample.tsx

Bug Description

If focusMode = 'tab-only', and the Card has an event handler (especially 'onClick'), then focusMode regresses to no-tab behaviour (which is both undocumented and unexpected).
This behaviour is introduced here.

Actual Behavior

When the card is focusable, onClick event handlers are not allowed and adding them regresses the focusMode to no-tab.

Expected Behavior

When the card is focused, onClick event handlers should be supported. As well as the onKeyDown/onKeyUp for pressing Enter which should match the onClick behavior.

Logs

No response

Requested priority

Normal

Products/sites affected

Microsoft Loop

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.

[katiearriagam]

Related to: #31505

[kolaps33]

I have experience the same behavior... would be nice to fix it...
when it is "tab-only" focus mode, then Enter should bring user focus inside the card...