Nesting dialogs is a questionable design pattern that is not referenced anywhere in the HTML 5.2 Dialog specification. Therefore it is actively discouraged in favour of clearer interface design. That being said, it is supported by the library.
As outlined in the fixture file, it is important that the nested dialogs are actually nested in the HTML as well, otherwise this won’t work with VoiceOver on Safari. That’s because anything outside of an
aria-modal="true" container is considered “inert”, so nested dialogs need to live within one another like Russian dolls.
Pressing ESC or clicking the backdrop will only close the top-most dialog, while the other remain untouched. It essentially makes it possible to stack dialogs on top of each other, then closing them one at a time.