Skip to content

Select: Safari VoiceOver does not announce selected value #3099

@jramke

Description

@jramke

🐛 Bug report

When using the Select machine (e.g docs example) the selected value is not correctly announced when using VoiceOver in Safari Tahoe (didnt test other versions).

When selecting a value and the focus moves back to the trigger the default value "select option" is announced.

During another testing i also noticed that not the default but the previous option was announced when selecting a new value. However i cant reproduce this. For the first case you can see a screen recording below.

💥 Steps to reproduce

Open the docs select example and select a value using VO.

💻 Link to reproduction

https://zagjs.com/components/select

🧐 Expected behavior

The updated value/content of the trigger should be announced.

🧭 Possible Solution

In my case i made the open state controlled and used a timeout like this. I dont know why the raf in the machine is not enough.

onOpenChange(details) {
	setTimeout(() => {
		setOpen(details.open);
	}, 0);
},

i also noticed that safari VO sometimes read the first value of the content list (although display: hidden) because of the aria-controls attiribute linking to it. This could be resolved when i removed the aria-controls attribute when the popover is not open, maybe this could also help to fix some edgecases and it would not break anything.

const triggerProps = api.getTriggerProps();
const mergedTriggerProps = mergeProps(triggerProps, {
	...(!api.open ? { 'aria-controls': null } : {}),
});

🌍 System information

Software Version(s)
Zag Version 1.40.0
Browser Safari 26.3
Operating System Tahoe 26.3

🧢 Your Company/Team

📝 Additional information

Cap.2026-04-25.at.19.50.15.mp4

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions