Episode 12 game · Vishwa · Earth

Vishwa’s Dialog Gate

Kai’s “Leave the dojo?” box is a div with a huge z-index. It looks like a gate, but Tab walks straight through it and Escape does nothing. Feel the Hollow Wall leak, build a real <dialog> opened with showModal(), then prove focus goes in, Escape closes it and focus comes home.

VishwaA builder tests a gate by walking up to it, Kai. Open your modal and try to get past it with the keyboard.
12Seal 12
kai.app/dojo

Built with <div class="modal">

HomeScrollsTraining log
Leave the dojo
browser toolbar
Keyboard log where focus is, and what a screen reader says

    🔊 —

    1 · Walk up to the painted door

    Open Kai’s modal, then use the keyboard keys below. Watch where focus goes, and whether Escape closes the box.

    A div is just a box

    No role, no focus move, no Escape: Tab walks out to the page behind it.

    showModal() builds the gate

    Top layer, inert page, focus moves in, Esc closes, and it is announced as a modal dialog.

    Close with a value

    A method="dialog" form closes it and sets returnValue. Focus returns to the opener.