[Checkbox] a11y issue Safari VoiceOver

Hey, Safari reads the Checkbox label in a weird way by appending “and one more item” to the checkbox label.

For example, if a label is “Gilad Gray”, Safari will read it “Gilad Grayand one more item” which sounds really weird to a user.

• The issue is present in the latest release.
• I have searched the issues of this repository and believe that this is not a duplicate.

Current Behavior 😯

Provided in the summary.

Expected Behavior 🤔

The label of the checkbox is read as it is without any additional text.

Please compare the first checkbox and others in the example below.

Steps to Reproduce 🕹

https://codesandbox.io/s/mui-checkbox-a11y-zq7u9

Steps:

1. Open Safari
2. Cmd + Fn + F5
3. Tab through checkboxes
4. Listen/Read the VO announcements

Context 🔦

Were able to fix it by applying aria-disabled={undefined}. Maybe the issue is here: https://github.com/mui-org/material-ui/blob/0c7d8cea71d5e3f34f63f997ea329edba80e47ca/packages/material-ui/src/ButtonBase/ButtonBase.js#L276

I don’t think aria-disabled should be applicable to any component except button

Your Environment 🌎

All packages versions are in the sandbox MUI v5 Safari 14.0 (15610.1.28.1.9, 15610)

[oliviertassinari]

@Gautam-Arora24 Yes

[eps1lon]

I think aria-disabled is never a required attribute so fixing it in ButtonBase seems like the better solution.

The diff alone for SwitchBase looks weird though. How woul aria-disabled be applied?