0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 1 | import assert from 'node:assert/strict'; |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 2 | import { test } from 'node:test'; |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 3 | import { BackStack, type HistoryLike } from '../src/lib/back-stack.ts'; |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 4 | |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 5 | class FakeHistory implements HistoryLike { |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 6 | entries: unknown[] = [{ roomId: 'a' }]; |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 7 | index = 0; |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 8 | onPop: (state: unknown) => void = () => undefined; |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 9 | get state(): unknown { |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 10 | return this.entries[this.index]; |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 11 | } |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 12 | pushState(state: unknown): void { |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 13 | this.entries.splice(this.index + 1, Infinity, state); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 14 | this.index++; |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 15 | } |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 16 | replaceState(state: unknown): void { |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 17 | this.entries[this.index] = state; |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 18 | } |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 19 | back(): void { |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 20 | if (this.index === 0) return; |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 21 | this.index--; |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 22 | queueMicrotask(() => this.onPop(this.state)); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 23 | } |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 24 | } |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 25 | |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 26 | function setup() { |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 27 | const history = new FakeHistory(); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 28 | const stack = new BackStack(history); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 29 | const routed: unknown[] = []; |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 30 | history.onPop = (state) => { |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 31 | if (!stack.pop(state)) routed.push(state); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 32 | }; |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 33 | return { history, stack, routed }; |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 34 | } |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 35 | |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 36 | const tick = () => new Promise((resolve) => setTimeout(resolve, 0)); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 37 | |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 38 | test('opening a layer adds one entry and back closes it', async () => { |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 39 | const { history, stack, routed } = setup(); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 40 | let open = true; |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 41 | stack.sync('card', true, () => (open = false)); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 42 | assert.equal(history.entries.length, 2); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 43 | history.back(); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 44 | await tick(); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 45 | assert.equal(open, false); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 46 | assert.equal(history.index, 0); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 47 | assert.deepEqual(routed, []); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 48 | }); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 49 | |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 50 | test('closing through the UI pops its entry and swallows the popstate', async () => { |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 51 | const { history, stack, routed } = setup(); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 52 | stack.sync('card', true, () => undefined); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 53 | stack.sync('card', false, () => undefined); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 54 | await tick(); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 55 | assert.equal(history.index, 0); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 56 | assert.deepEqual(routed, []); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 57 | assert.equal(stack.depth, 0); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 58 | }); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 59 | |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 60 | test('back closes only the topmost of several layers', async () => { |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 61 | const { history, stack } = setup(); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 62 | const closed: string[] = []; |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 63 | stack.sync('drawer', true, () => closed.push('drawer')); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 64 | stack.sync('card', true, () => closed.push('card')); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 65 | history.back(); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 66 | await tick(); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 67 | assert.deepEqual(closed, ['card']); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 68 | assert.equal(stack.depth, 1); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 69 | }); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 70 | |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 71 | test('a route recorded under an open layer replaces its entry', async () => { |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 72 | const { history, stack, routed } = setup(); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 73 | stack.sync('drawer', true, () => undefined); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 74 | stack.route({ roomId: 'b' }, '/?room=b'); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 75 | stack.sync('drawer', false, () => undefined); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 76 | await tick(); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 77 | assert.deepEqual(history.entries, [{ roomId: 'a' }, { roomId: 'b' }]); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 78 | history.back(); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 79 | await tick(); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 80 | assert.deepEqual(routed, [{ roomId: 'a' }]); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 81 | }); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 82 | |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 83 | test('closing a layer then pressing back does not skip a room', async () => { |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 84 | const { history, stack, routed } = setup(); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 85 | stack.route({ roomId: 'b' }, '/?room=b'); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 86 | stack.sync('card', true, () => undefined); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 87 | stack.sync('card', false, () => undefined); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 88 | await tick(); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 89 | assert.deepEqual(history.state, { roomId: 'b' }); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 90 | history.back(); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 91 | await tick(); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 92 | assert.deepEqual(routed, [{ roomId: 'a' }]); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 93 | }); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 94 | |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 95 | test('a route recorded right after a UI close waits for the pop', async () => { |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 96 | const { history, stack } = setup(); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 97 | stack.sync('menu', true, () => undefined); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 98 | stack.sync('menu', false, () => undefined); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 99 | stack.route({ roomId: 'b' }, '/?room=b'); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 100 | await tick(); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 101 | assert.deepEqual(history.entries, [{ roomId: 'a' }, { roomId: 'b' }]); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 102 | }); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 103 | |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 104 | test('a layer closed under another leaves a stale entry that back skips', async () => { |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 105 | const { history, stack, routed } = setup(); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 106 | let dialog = true; |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 107 | stack.sync('menu', true, () => undefined); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 108 | stack.sync('dialog', true, () => (dialog = false)); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 109 | stack.sync('menu', false, () => undefined); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 110 | history.back(); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 111 | await tick(); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 112 | assert.equal(dialog, false); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 113 | assert.equal(history.index, 0); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 114 | assert.equal(routed.length, 0); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 115 | }); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 116 | |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 117 | test('init strips a layer marker left behind by a reload', () => { |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 118 | const { history, stack } = setup(); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 119 | history.entries = [{ roomId: 'a' }, { roomId: 'a', backLayer: 'card' }]; |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 120 | history.index = 1; |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 121 | stack.init(); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 122 | assert.deepEqual(history.state, { roomId: 'a' }); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 123 | }); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 124 | |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 125 | test('a settle timeout releases a pop whose popstate never arrives', async () => { |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 126 | const { history, stack } = setup(); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 127 | stack.sync('x', true, () => undefined); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 128 | history.back = () => undefined; |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 129 | stack.sync('x', false, () => undefined); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 130 | stack.route({ roomId: 'b' }, '/?room=b'); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 131 | await new Promise((resolve) => setTimeout(resolve, 500)); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 132 | assert.deepEqual(history.state, { roomId: 'b' }); |
0e50e0d137af | atagen | 2026-10-26 05:50 UTC | 133 | }); |