tracker

8.5 KB

1. // tests/pager.mjs — THE GATE of tracker.worldapi.org#38 (mission 033): the pagination goes exactly to the page clicked, every
2. // time, also after several clicks and after the browser's Back/Forward — on EVERY paginated list (/movies, /series, /shows,
3. // /genres/<g>, /people/<letter>; they all use components/tilelist.hl), at 390 px (phone) and 1280 px. Its own server on its
4. // own storage (.scratch/pager-store, tests/seed-pager.hl: 250 titles per list = 11 pages, so "…" shows and the pager's list
5. // changes length between clicks), no ident (signed out), no TMDB. A real headless Chrome and REAL clicks (Input domain).
6. // Then once more at 1280 with a script's `el.click()` instead (the pagination's own handler then runs AFTER tilelist's, the
7. // order the old browser.mjs checks used — the fix must hold for both). After every step: the address, the 24 (or 10) tiles of exactly that page (first + last title), the pager's current page,
8. // still the same document (client-side), and the address still the same 600 ms later (no late second navigation).
9. // The bug it guards: the pagination's own click handler rebuilt its buttons before tilelist read the clicked one's text —
10. // "2" on page 1 did nothing, "Next" on page 3 went to the last page.
11. //
12. // TRACKER_GATE_PORT=8732 TRACKER_GATE_CHROME=8736-8739 node tests/pager.mjs
13. import { spawn, execFileSync } from 'node:child_process';
14. import { existsSync, mkdirSync, rmSync } from 'node:fs';
15. import { dirname, join, resolve } from 'node:path';
16. import { fileURLToPath } from 'node:url';
17. import { launchBrowser } from './cdp.mjs';
19. if (!process.env.HL_CHROME && existsSync('/opt/google/chrome/chrome')) process.env.HL_CHROME = '/opt/google/chrome/chrome';
20. const HERE = dirname(fileURLToPath(import.meta.url));
21. const APP = resolve(HERE, '..');
22. const PORT = Number(process.env.TRACKER_GATE_PORT || 8700);
23. const [CH_FROM, CH_TO] = (process.env.TRACKER_GATE_CHROME || '8702-8709').split('-').map(Number);
24. const BASE = `http://127.0.0.1:${PORT}`;
25. const STORE = join(APP, '.scratch', 'pager-store');
26. rmSync(STORE, { recursive: true, force: true });
27. mkdirSync(join(STORE, 'mpackdb'), { recursive: true });
28. mkdirSync(join(STORE, 'sessions'), { recursive: true });
30. let failures = 0, passes = 0;
31. function check(label, ok, detail = '') {
32. console.log(`${ok ? 'ok ' : 'FAIL'} ${label}${ok ? '' : ' — ' + detail}`);
33. if (ok) passes++; else failures++;
34. }
35. const sleep = (ms) => new Promise(r => setTimeout(r, ms));
36. const n3 = (i) => String(i).padStart(3, '0');
38. // the lists: the expected first/last title and tile count of page p (11 pages; 250 = 10 × 24 + 10)
39. const newestFirst = (word) => (p) => { const a = 250 - 24 * (p - 1), b = Math.max(1, a - 23); return { first: `${word} ${n3(a)}`, last: `${word} ${n3(b)}`, count: a - b + 1 }; };
40. const LISTS = [
41. { path: '/movies', page: newestFirst('Pg Movie') },
42. { path: '/series', page: newestFirst('Pg Series') },
43. { path: '/shows', page: newestFirst('Pg Show') },
44. { path: '/genres/Pagerg', page: newestFirst('Pg Movie') },
45. { path: '/people/p', page: (p) => { const a = 24 * (p - 1) + 1, b = Math.min(250, a + 23); return { first: `Pgperson ${n3(a)}`, last: `Pgperson ${n3(b)}`, count: b - a + 1 }; } },
46. ];
47. // the ticket's sequence (2, 3, Next, Previous, 10, back, forward), extended so "10" is a button (from the last page) and
48. // both ends are crossed: [what to do, the page it must show]
49. const STEPS = [['2', 2], ['3', 3], ['Next', 4], ['Previous', 3], ['11', 11], ['10', 10], ['Previous', 9], ['Next', 10], ['1', 1],
50. ['BACK', 10], ['BACK', 9], ['FORWARD', 10], ['Next', 11], ['BACK', 10]];
52. let server = null, browser = null, log = '';
53. async function stop() {
54. if (browser) { try { await browser.close(); } catch {} browser = null; }
55. if (server) {
56. const s = server;
57. try { s.kill('SIGTERM'); } catch {}
58. await new Promise(r => { if (s.exitCode !== null || s.signalCode !== null) return r(); s.once('exit', r); setTimeout(r, 3000); });
59. server = null;
60. }
61. }
63. async function main() {
64. const seedOut = execFileSync(join(APP, 'bin/hybriel'), ['tests/seed-pager.hl'], { cwd: APP, env: { ...process.env, TRACKER_STORAGE: join(STORE, 'mpackdb') } }).toString();
65. check('seed: 250 movies, series, shows and people (tests/seed-pager.hl)', seedOut.includes('seed-pager: 250 movies, 250 series, 250 shows, 250 people'), seedOut);
66. server = spawn(join(APP, 'bin/hybriel'), ['project.hl'], { cwd: APP, env: { ...process.env, TRACKER_PORT: String(PORT), TRACKER_URL: BASE,
67. TRACKER_SESSIONS: join(STORE, 'sessions') + '/', TRACKER_STORAGE: join(STORE, 'mpackdb'), TRACKER_WATCH: '0', TMDB_READ_TOKEN: '',
68. TRACKER_SYNC: '0', TRACKER_BACKFILL: '0', TRACKER_SHORTIDS: '0', TRACKER_KINDS: '0', TRACKER_REPAIR: '0', TRACKER_CREDITS: '0', TRACKER_COLLECTIONS: '0', TRACKER_MERGE: '0' },
69. stdio: ['ignore', 'pipe', 'pipe'] });
70. server.stdout.on('data', d => log += d); server.stderr.on('data', d => log += d);
71. for (let i = 0; ; i++) {
72. try { if ((await fetch(BASE + '/')).ok) break; } catch {}
73. if (i > 240) throw new Error('tracker did not come up\n' + log);
74. await sleep(250);
75. }
76. browser = await launchBrowser({ debugPortRange: [CH_FROM, CH_TO] });
78. for (const [width, how] of [[390, 'real'], [1280, 'real'], [1280, 'script']]) {
79. const page = await browser.newPage();
80. await page.send('Emulation.setDeviceMetricsOverride', width < 600 ? { width, height: 844, deviceScaleFactor: 3, mobile: true } : { width, height: 900, deviceScaleFactor: 1, mobile: false });
81. const ev = (e) => page.evaluate(e);
82. const state = async () => JSON.parse(await ev(`JSON.stringify({ path: location.pathname, doc: window.__t38 || null,
83. titles: Array.from(document.querySelectorAll('a.tile tile-title')).map(t => t.textContent.trim()),
84. current: ((document.querySelector('pagination li.current') || {}).textContent || '').trim() })`));
85. for (const list of LISTS) {
86. await page.goto(BASE + list.path);
87. await page.waitFor(`document.querySelectorAll('pagination li').length > 0 && document.querySelectorAll('a.tile').length === 24`, { timeout: 15000, label: list.path });
88. await page.waitFor('!!window.__hl && window.__hl.socket && window.__hl.socket.readyState === 1', { timeout: 15000, label: 'hydrated' });
89. await sleep(300);
90. await ev(`window.__t38 = 'same document'`);
91. let s = await state();
92. const p1 = list.page(1);
93. check(`${width}px ${how} ${list.path}: page 1 loaded (${p1.first} … ${p1.last}, 1 current)`, s.path === list.path && s.titles[0] === p1.first && s.titles.at(-1) === p1.last && s.current === '1', JSON.stringify(s));
94. for (const [what, to] of STEPS) {
95. if (what === 'BACK') await ev('history.back()');
96. else if (what === 'FORWARD') await ev('history.forward()');
97. else {
98. const found = await ev(`(() => { document.querySelectorAll('[data-t38]').forEach(e => e.removeAttribute('data-t38'));
99. const b = Array.from(document.querySelectorAll('pagination button')).find(b => b.textContent.trim() === ${JSON.stringify(what)});
100. if (!b) return false; b.setAttribute('data-t38', '1'); return true; })()`);
101. if (!found) { check(`${width}px ${how} ${list.path}: a "${what}" button`, false, JSON.stringify(await state())); continue; }
102. if (how === 'real') await page.click('[data-t38]'); else await ev(`document.querySelector('[data-t38]').click()`);
103. }
104. const want = to === 1 ? list.path : `${list.path}/page/${to}`;
105. const exp = list.page(to);
106. await page.waitFor(`location.pathname === ${JSON.stringify(want)} && (document.querySelector('a.tile tile-title') || {}).textContent === ${JSON.stringify(exp.first)}`, { timeout: 8000, label: `${list.path} ${what}` }).catch(() => {});
107. await sleep(600);
108. s = await state();
109. check(`${width}px ${how} ${list.path}: ${what.padEnd(8)} → ${want} with ${exp.count} tiles ${exp.first} … ${exp.last}, ${to} current, same document`,
110. s.path === want && s.titles.length === exp.count && s.titles[0] === exp.first && s.titles.at(-1) === exp.last && s.current === String(to) && s.doc === 'same document',
111. JSON.stringify({ ...s, titles: [s.titles.length, s.titles[0], s.titles.at(-1)] }));
112. }
113. }
114. const problems = page.problems().filter(m => !/favicon|manifest/i.test(m.text || ''));
115. check(`${width}px ${how}: no console errors/warnings`, problems.length === 0, JSON.stringify(problems.slice(0, 5)));
116. await page.close();
117. }
118. }
120. try { await main(); }
121. catch (e) { check('gate ran to the end', false, e.stack || String(e)); }
122. finally { await stop(); }
123. console.log(`\n${passes} passed, ${failures} failed`);
124. process.exit(failures ? 1 : 0);