Focus on the 'Trigger' button, press enter key, the 'close' button should be visible and focused
Switch NVDA to forms mode, press enter key again, notice the screen reader announces 'document':
This happens because the restore focus is async with a timeout. When switching the example to the react useEffect restore focus, this problem does not appear (and if setTimeout is used in react useEffect, it appears as well).
Possible solutions:
Option 1: provide the ability to synchronously focus on trigger - this was discussed in teams meeting and discarded because the trigger might not be focusable
Option 2: provide the ability to focus on dummy input with aria-hidden when focus moves back to trigger.
Problem description:
Open this example: https://stackblitz.com/edit/vitejs-vite-ytxz4e?file=package.json,src%2FApp.tsx&terminal=dev
This happens because the restore focus is async with a timeout. When switching the example to the react useEffect restore focus, this problem does not appear (and if setTimeout is used in react useEffect, it appears as well).
Possible solutions:
Option 1: provide the ability to synchronously focus on trigger - this was discussed in teams meeting and discarded because the trigger might not be focusable Option 2: provide the ability to focus on dummy input with aria-hidden when focus moves back to trigger.