Voiceover iOS Safari - Not focusing modal

[DarudeGarystorm]

The screen reader is not focusing the modal when there is a <select> in it.
Example: https://codesandbox.io/s/pkzl2v2mkj

[diasbruno]

Hey @DarudeGarystorm, there are some updates released on 3.6.1. Can you please check if it helps?

[DarudeGarystorm]

@diasbruno bug is still present on 3.6.1

[nbozard]

I am using react-modal 3.8.1 on iOS 12.1.2 in Safari with VoiceOver. The example above does not focus correctly, but at this point in time it doesn't seem to be about the select, but about the modal containing anything other than the simplest content.

If I modify the example above and remove the h2, leaving behind just the select, it works fine. Same with a single button versus a button and other elements.

[jasonkiss]

There's a bug with Safari/iOS with VoiceOver where a modal dialog hidden with display:none will not get focus moved to it. See more at https://developer.paciellogroup.com/blog/2018/06/the-current-state-of-modal-dialog-accessibility/. Could be that a dialog that is getting entirely constructed and inserted on the fly is suffering the same effect? Does having the modal container already in the DOM and hiding/showing it with visibility:hidden|visible solve the issue?