tracker

5.5 KB

1. // tests/realdata-066.mjs — tracker#19 (mission 066), NOT the gate: on a COPY of live storage/ after the collection seed ran
2. // (STATUS.md ticket #19 has the procedure). At 390 + 1280: full loads (×3) of /franchises, the timelines whose name matches
3. // REAL_MATCH (default "Star Wars|Alien"), a movie page of each (the widget: prev / name / next read from the page), the release
4. // toggle on the timeline page; signed in as the creator (cookie from .scratch/real-sid, if there) /franchises shows "Edit" and
5. // /franchises/edit its forms. Screenshots → $REAL_OUT. Env: REAL_PORT (8738), REAL_CHROME (8739), REAL_OUT (/tmp/w066/real).
6. import { writeFileSync, readFileSync, mkdirSync, existsSync } from 'node:fs';
7. import { launchBrowser } from './cdp.mjs';
8. process.env.HL_CHROME ||= '/opt/google/chrome/chrome';
9. const BASE = `http://127.0.0.1:${process.env.REAL_PORT || 8738}`, OUT = process.env.REAL_OUT || '/tmp/w066/real';
10. const MATCH = new RegExp(process.env.REAL_MATCH || 'Star Wars|Alien');
11. mkdirSync(OUT, { recursive: true });
12. const browser = await launchBrowser({ debugPortRange: [Number(process.env.REAL_CHROME || 8739), Number(process.env.REAL_CHROME || 8739)] });
13. const page = await browser.newPage();
14. const ev = (e) => page.evaluate(e);
15. const hydrated = () => page.waitFor('!!window.__hl && window.__hl.socket && window.__hl.socket.readyState === 1 && document.readyState === "complete"', { timeout: 60000, label: 'hydrated' });
16. const shot = async (n) => writeFileSync(`${OUT}/${n}.png`, Buffer.from((await page.send('Page.captureScreenshot', { format: 'png' })).data, 'base64'));
17. const load = async (path) => { const t = Date.now(); await page.goto(BASE + path, { timeout: 60000 }); await hydrated(); return Date.now() - t; };
18. const out = [];
19. await load('/franchises');
20. const timelines = JSON.parse(await ev(`JSON.stringify(Array.from(document.querySelectorAll('#timeline-list a.timeline-link')).map(a => ({ name: a.querySelector('timeline-link-name').textContent, href: a.getAttribute('href'), n: a.querySelector('timeline-link-count').textContent })))`));
21. out.push(`/franchises: ${timelines.length} timelines listed, ${await ev(`document.querySelectorAll('#franchise-list a').length`)} franchises; html ${(await (await fetch(BASE + '/franchises')).text()).length} bytes`);
22. const picked = timelines.filter(t => MATCH.test(t.name));
23. out.push('matching: ' + picked.map(t => `${t.name} (${t.n})`).join(', '));
24. for (const [w, h, mobile] of [[390, 844, true], [1280, 900, false]]) {
25. await page.send('Emulation.setDeviceMetricsOverride', { width: w, height: h, deviceScaleFactor: mobile ? 2 : 1, mobile });
26. const times = [await load('/franchises'), await load('/franchises'), await load('/franchises')];
27. out.push(`${w} /franchises full loads ms: ${times.join(' / ')}; scrollWidth ${await ev('document.documentElement.scrollWidth')}`);
28. await shot(`franchises-${w}`);
29. for (const t of picked) {
30. const tt = [await load(t.href), await load(t.href)];
31. const items = await ev(`Array.from(document.querySelectorAll('a.timeline-item')).map(a => a.querySelector('film-title').textContent + ' ' + a.querySelector('.timeline-date').textContent).join(' | ')`);
32. out.push(`${w} ${t.href} (${tt.join(' / ')} ms): ${items}`);
33. await shot(`timeline-${t.href.split('/').pop()}-${w}`);
34. await ev(`document.querySelector('timeline-head button[value="release"]').click()`);
35. await new Promise(r => setTimeout(r, 300));
36. out.push(`${w} release order: ` + await ev(`Array.from(document.querySelectorAll('a.timeline-item')).map(a => a.querySelector('film-title').textContent).join(' | ')`));
37. // the 2nd title's page (it has both a prequel and, if there are ≥ 3, a sequel)
38. await load(t.href);
39. const target = await ev(`(document.querySelectorAll('a.timeline-item')[1] || document.querySelector('a.timeline-item')).getAttribute('href')`);
40. const mt = [await load(target), await load(target)];
41. const wd = await ev(`JSON.stringify(Array.from(document.querySelectorAll('franchise-widget')).map(w => [w.querySelector('.fw-prev').textContent.trim().replace(/\\s+/g, ' '), w.querySelector('a.fw-timeline').textContent, w.querySelector('.fw-next').textContent.trim().replace(/\\s+/g, ' ')].join(' | ')))`);
42. out.push(`${w} ${target} (${mt.join(' / ')} ms) widget: ${wd}; scrollWidth ${await ev('document.documentElement.scrollWidth')}`);
43. await ev(`document.querySelector('franchise-widget') && document.querySelector('franchise-widget').scrollIntoView({ block: 'center' })`);
44. await shot(`widget-${target.split('/').pop()}-${w}`);
45. }
46. }
47. if (existsSync('.scratch/real-sid')) {
48. await page.send('Network.setCookie', { name: 'trackersid', value: readFileSync('.scratch/real-sid', 'utf8').trim(), url: BASE });
49. for (const [w, h, mobile] of [[390, 844, true], [1280, 900, false]]) {
50. await page.send('Emulation.setDeviceMetricsOverride', { width: w, height: h, deviceScaleFactor: mobile ? 2 : 1, mobile });
51. const t1 = await load('/franchises');
52. const edit = await ev(`!!document.querySelector('#franchises-edit')`);
53. const t2 = await load('/franchises/edit');
54. out.push(`${w} creator: /franchises ${t1} ms, Edit link ${edit}; /franchises/edit ${t2} ms, forms ${await ev(`!!document.querySelector('#fe-name')`)}`);
55. await shot(`franchise-edit-creator-${w}`);
56. if (picked[0]) { await load(picked[0].href + '/edit'); out.push(`${w} creator: ${picked[0].href}/edit rows ${await ev(`document.querySelectorAll('#edit-rows edit-row').length`)}`); await shot(`timeline-edit-creator-${w}`); }
57. }
58. }
59. console.log(out.join('\n'));
60. console.log('problems', JSON.stringify(page.problems ? page.problems() : []));
61. await browser.close();