[combobox][autocomplete] Remove aria-readonly prop from Clear and Popup components when readOnly

[markocupic024]

Closes #3906

readOnly has no effect these buttons

[pkg-pr-new]

• base-ui-tanstack-start

• vite-css-base-ui-example

  pnpm add https://pkg.pr.new/mui/base-ui/@base-ui/react@3907
  

  pnpm add https://pkg.pr.new/mui/base-ui/@base-ui/utils@3907
  

commit: aff0bb1

[mui-bot]

Bundle size report

Bundle	Parsed size	Gzip size
@base-ui/react	▼-78B(-0.02%)	▼-19B(-0.01%)

Details of bundle changes

---

Check out the code infra dashboard for more information about this PR.

[netlify]

✅ Deploy Preview for base-ui ready!

Name	Link
🔨 Latest commit	aff0bb1
🔍 Latest deploy log	https://app.netlify.com/projects/base-ui/deploys/697fe974ae7e540008ebf148
😎 Deploy Preview	https://deploy-preview-3907--base-ui.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify project configuration.

[greptile-apps]

Greptile Overview

Greptile Summary

Removed aria-readonly attribute from ComboboxClear and ComboboxTrigger button components. According to ARIA specifications, the aria-readonly attribute is only valid for input-type roles (like textbox, checkbox, radio), not for button elements. Since these components render as buttons and already prevent interactions through their onClick handlers when readOnly is true, the aria-readonly attribute has no semantic effect and should be removed.

Key changes:

• Removed aria-readonly from ComboboxClear component
• Removed aria-readonly from ComboboxTrigger component
• Updated all related tests to reflect these changes
• Behavior remains unchanged - buttons still correctly ignore clicks when readOnly is true

Note: The ComboboxChipRemove component (also a button) still has aria-readonly and should be updated for consistency in a follow-up.

Confidence Score: 5/5

• This PR is safe to merge with minimal risk
• The changes correctly remove an invalid ARIA attribute from button elements. The actual readonly behavior is preserved through event handler checks, and all tests have been properly updated. No functional changes to the component behavior.
• No files require special attention

Important Files Changed

Filename	Overview
packages/react/src/combobox/clear/ComboboxClear.tsx	Removed aria-readonly attribute from the Clear button component
packages/react/src/combobox/trigger/ComboboxTrigger.tsx	Removed aria-readonly attribute from the Trigger button component

[greptile-apps]

_{2 files reviewed, 1 comment}

_{Edit Code Review Agent Settings | Greptile}

[greptile-apps]

For consistency with this change, consider also removing aria-readonly from ComboboxChipRemove component (line 57 in packages/react/src/combobox/chip-remove/ComboboxChipRemove.tsx) and updating its tests. The ComboboxChipRemove component is also a button that should not have aria-readonly for the same reasons as Clear and Trigger buttons.

Prompt To Fix With AI

This is a comment left during a code review.
Path: packages/react/src/combobox/clear/ComboboxClear.tsx
Line: 92:92

Comment:
For consistency with this change, consider also removing `aria-readonly` from `ComboboxChipRemove` component (line 57 in `packages/react/src/combobox/chip-remove/ComboboxChipRemove.tsx`) and updating its tests. The `ComboboxChipRemove` component is also a button that should not have `aria-readonly` for the same reasons as Clear and Trigger buttons.

How can I resolve this? If you propose a fix, please make it concise.

[atomiks]

Failing test:

FAIL @base-ui/react src/combobox/root/ComboboxRoot.test.tsx > <Combobox.Root /> > selection behavior > multiple > should handle readOnly state with chips

[atomiks]

Thanks for the fix @markocupic024!