fix(diagnostics): deep-review round 3 — a keyboard owner that is not a Tab trap
Round 2 made the step prompt a blocking layer so that `j` and the `g` chords would not reach the page behind it. The dialog it sits in gave up its Tab trap because of that, while the prompt's own replacement trap covered only its own two controls — so Tab from anywhere else in the dialog (the bar's Screenshot or Stop, the dialog's own buttons) walked out behind the scrim. `layerStack` now separates the two questions it had folded into one flag: a layer can own the keyboard and still leave the Tab trap to the dialog below it. The mirror case, a dialog opening over the prompt, falls out of the same split. A send's claim is now a lease with an owner. Every progress report re-stamps it, so a send slower than the lease cannot lose it while it is still running, and only the send that took a claim can give it back. The issue_create audit row is staged inside the send and rides the same checkpoint as `issue_url`, so the trail cannot be missing for an issue that exists. The attachment-name prefix has one definition, shared by the producer and both readers. A running send is reported to the UI. A reload or a second tab used to render it exactly like a send that STOPPED, and offered a retry the server was certain to refuse; the composer now says the report is being sent, holds the draft, and puts both the retry and Create issue out. The past-sessions list says the same for the same reason — it is the list a user opens to check on a send, and both "draft" and "half sent" describe one that died. `/preview` and the retry path got a pace of their own, and the per-user byte cap took the user-scoped lock that makes it a cap instead of a guess. Verified in a real browser on localdev: Tab cycles the whole dialog with the prompt open, the prompt still swallows the page's keys, and the issue link is focusable where the composer puts it. All 24 regression tests mutation-checked.
This commit is contained in:
@@ -20,17 +20,25 @@ let nextId = 1;
|
||||
// stack for Escape ordering like any other layer, but `anyBlockingLayer` looks past them — otherwise
|
||||
// a tooltip that happens to be open under a resting mouse pointer would silence the page's `j`/`k`.
|
||||
const passive = new Set<number>();
|
||||
// Layers that DO own the keyboard but leave the Tab trap to the dialog below: a small inline prompt
|
||||
// inside one (the recorder's step field). It must silence the page's keys — an autofocused field
|
||||
// does — yet it is not a dialog of its own, so claiming the trap left the dialog around it with
|
||||
// none, and Tab from anything outside the prompt walked into the page behind the scrim. The two
|
||||
// questions are separate; a layer answers each for itself (deep-review round 3).
|
||||
const defers = new Set<number>();
|
||||
|
||||
export function pushLayer(opts?: { passive?: boolean }): number {
|
||||
export function pushLayer(opts?: { passive?: boolean; trapsTab?: boolean }): number {
|
||||
const id = nextId++;
|
||||
stack.push(id);
|
||||
if (opts?.passive) passive.add(id);
|
||||
if (opts?.trapsTab === false) defers.add(id);
|
||||
return id;
|
||||
}
|
||||
|
||||
export function removeLayer(id: number): void {
|
||||
stack = stack.filter((x) => x !== id);
|
||||
passive.delete(id);
|
||||
defers.delete(id);
|
||||
}
|
||||
|
||||
/** True while a layer that owns the keyboard is open — a modal, a player, a click-opened menu. The
|
||||
@@ -51,12 +59,13 @@ export function anyLayerAbove(id: number): boolean {
|
||||
return i !== -1 && i < stack.length - 1;
|
||||
}
|
||||
|
||||
/** True when a layer that owns the keyboard sits above `id` — the predicate for a dialog's Tab trap.
|
||||
* A tooltip or hover card open under a resting pointer takes Escape first, but not the Tab: deferring
|
||||
* the trap to it let Shift+Tab walk out of the dialog into the page behind its scrim. */
|
||||
/** True when a layer that TRAPS THE TAB sits above `id` — the predicate for a dialog's Tab trap. A
|
||||
* tooltip open under a resting pointer (passive) and an inline prompt inside the dialog itself
|
||||
* (`trapsTab: false`) both take Escape first but neither takes the Tab: deferring the trap to one
|
||||
* of those left Shift+Tab walking out of the dialog into the page behind its scrim. */
|
||||
export function anyBlockingLayerAbove(id: number): boolean {
|
||||
const i = stack.indexOf(id);
|
||||
return i !== -1 && stack.slice(i + 1).some((x) => !passive.has(x));
|
||||
return i !== -1 && stack.slice(i + 1).some((x) => !passive.has(x) && !defers.has(x));
|
||||
}
|
||||
|
||||
// UX-8 — a layer that ACTS on an Escape stamps the event here; a lower layer with its own key handler
|
||||
@@ -83,17 +92,20 @@ export function escapeHandled(e: KeyboardEvent): boolean {
|
||||
export function useLayer(
|
||||
active: boolean,
|
||||
onEscape?: () => void,
|
||||
opts?: { passive?: boolean },
|
||||
opts?: { passive?: boolean; trapsTab?: boolean },
|
||||
): { isTopmost: () => boolean; anyAbove: () => boolean; blockingAbove: () => boolean } {
|
||||
const idRef = useRef<number | null>(null);
|
||||
const escRef = useRef(onEscape);
|
||||
escRef.current = onEscape;
|
||||
const passiveRef = useRef(!!opts?.passive);
|
||||
passiveRef.current = !!opts?.passive;
|
||||
const optsRef = useRef(opts);
|
||||
optsRef.current = opts;
|
||||
|
||||
useEffect(() => {
|
||||
if (!active) return;
|
||||
const id = pushLayer({ passive: passiveRef.current });
|
||||
const id = pushLayer({
|
||||
passive: !!optsRef.current?.passive,
|
||||
trapsTab: optsRef.current?.trapsTab,
|
||||
});
|
||||
idRef.current = id;
|
||||
let onKey: ((e: KeyboardEvent) => void) | undefined;
|
||||
if (escRef.current) {
|
||||
|
||||
Reference in New Issue
Block a user