[Bug]: (accessibility) Accordion missing aria-controls

[limitedmage]

Component

Accordion

Package version

9.60.0

React version

18.3.1

Environment

System:
    OS: Linux 5.15 Ubuntu 24.04.2 LTS 24.04.2 LTS (Noble Numbat)
    CPU: (24) x64 Intel(R) Core(TM) i9-10920X CPU @ 3.50GHz
    Memory: 21.19 GB / 31.20 GB
    Container: Yes
    Shell: 5.2.21 - /bin/bash
  npmPackages:
    @fluentui/react-components: catalog: => 9.60.0 
    @fluentui/react-icons: catalog: => 2.0.279 
    @fluentui/react-theme: catalog: => 9.1.24 
    @types/react: catalog: => 18.3.20 
    @types/react-dom: catalog: => 18.3.6 
    react: catalog: => 18.3.1 
    react-dom: catalog: => 18.3.1

Current Behavior

Accordion component does not set aria-controls on the button or a matching id on the panel.

Expected Behavior

According to the ARIA Authoring Practices Guide (APG), accordion pattern requires aria-controls on the expand button to point to the accordion panel: https://www.w3.org/WAI/ARIA/apg/patterns/accordion/

Reproduction

https://react.fluentui.dev/?path=/docs/components-accordion--docs

Steps to reproduce

1. Open https://react.fluentui.dev/?path=/docs/components-accordion--docs
2. Inspect accordion button and accordion panel

Expected: button has aria-controls point to ID in panel
Actual: No aria-controls on button or id on panel

Are you reporting an Accessibility issue?

yes

Suggested severity

Medium - Has workaround

Products/sites affected

No response

Are you willing to submit a PR to fix?

yes

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.