Coordinate DOM updates and focus

Opening the editor inserts or reveals it, then focus moves to the title through a named ref. This is a small part of an accessible issue board that filters, edits, persists, and progressively enhances server-rendered HTML, but the boundary it creates affects everything that follows.

State can change before the corresponding element exists or becomes visible; nextTick schedules work after the update. The useful target is not encyclopedic coverage. Make one deliberate choice, observe its consequences, and know which requirement would make you revise it.

Watch for one shortcut in particular: trying to use arbitrary timers to guess when rendering has finished. It makes later failures harder to locate. Instead, change state, wait for Alpine’s DOM update, and focus the intended stable reference. Prefer an implementation you can explain from the outside before optimizing it.

Keep the wider goal in view: Render dynamic issue rows without losing identity, focus, or respect for reduced-motion preferences. A short observation with concrete evidence is more useful than a confident sentence with no reproduction path.

Open and close the editor rapidly and prove focus lands correctly without time-based sleeps. Hand the result to someone else and see whether the behavior is clear without an oral explanation.