[data grid] Master detail toggle button missing `aria-expanded` attribute

[icf-mrankin]

Steps to reproduce

Steps:

1. any of the examples on the docs page -> https://mui.com/x/react-data-grid/master-detail/
2. inspect the expand/collapse button in devtools
3. note the absence of the aria-expanded attribute

Current behavior

While the buttons have an appropriate label, shouldn't they also have the aria-expanded attribute like the accordion and tree view?

Expected behavior

No response

Context

No response

Your environment

npx @mui/envinfo

  Browsers used: Chrome, Brave, Safari, Firefox
  Output from `npx @mui/envinfo` goes here.

Search keywords: data grid aria-expanded master detail accessibility

[michelengelen]

I guess it should have that, according to the accordion spec, which comes the closest for this feature.

It is a fairly straight forward fix, so I'll open it up for the community to grab! 👍🏼

--- a/packages/x-data-grid-pro/src/components/GridDetailPanelToggleCell.tsx
+++ b/packages/x-data-grid-pro/src/components/GridDetailPanelToggleCell.tsx
@@ -59,6 +59,7 @@ function GridDetailPanelToggleCell(props: GridRenderCellParams) {
       tabIndex={-1}
       disabled={!hasContent}
       className={classes.root}
+      aria-expanded={isExpanded}
       aria-label={
         isExpanded
           ? apiRef.current.getLocaleText('collapseDetailPanel')

[whereisrmsqhs]

Hi, can i try this? It's my first PR so it might take some time :)

[michelengelen]

Hi, can i try this? It's my first PR so it might take some time :)

Absolutely ... if you need assistance please do not hesitate to reach out. Have fun! 💪🏻