tracker

7.0 KB

1. // tests/realdata-062.mjs — mission 062 (t26 merged: #26 + #28 + guests lazy + lean watch clicks), NOT the gate: on a COPY of live
2. // storage/ (STATUS.md has the procedure), signed in (cookie from .scratch/real-sid). Per width (390, 1280): full load of a series
3. // (REAL_SERIES) and a movie (REAL_MOVIE) + screenshots; on the series "Show all" and a click on its first GUEST (a /person/tmdb/…
4. // link) → the person page (created on that click, filled from TMDB) — time + screenshot. Then WATCH clicks (episode check, 6 ×,
5. // alternating = the state is back afterwards) and FOLLOW clicks (2 ×) on REAL_CLICK (Picard, The Simpsons): ms from the click until
6. // the answer's websocket frame arrived (page clock), and the bytes the browser received for it. Screenshots → $REAL_OUT.
7. // Env: REAL_PORT (8730), REAL_CHROME (8731), REAL_OUT (/tmp/w062/real), REAL_SERIES (Star-Trek-Picard), REAL_MOVIE (Superman),
8. // REAL_CLICK (Star-Trek-Picard,The-Simpsons).
9. import { writeFileSync, readFileSync, mkdirSync } from 'node:fs';
10. import { launchBrowser } from './cdp.mjs';
11. process.env.HL_CHROME ||= '/opt/google/chrome/chrome';
12. const BASE = `http://127.0.0.1:${process.env.REAL_PORT || 8730}`, OUT = process.env.REAL_OUT || '/tmp/w062/real';
13. const SID = readFileSync('.scratch/real-sid', 'utf8').trim();
14. const SERIES = process.env.REAL_SERIES || 'Star-Trek-Picard', MOVIE = process.env.REAL_MOVIE || 'Superman';
15. const CLICK = (process.env.REAL_CLICK || 'Star-Trek-Picard,The-Simpsons').split(',').filter(Boolean);
16. mkdirSync(OUT, { recursive: true });
17. const browser = await launchBrowser({ debugPortRange: [Number(process.env.REAL_CHROME || 8731), Number(process.env.REAL_CHROME || 8731)] });
18. const page = await browser.newPage();
19. await page.captureWs();
20. const ev = (e) => page.evaluate(e);
21. const hydrated = () => page.waitFor('!!window.__hl && window.__hl.socket && window.__hl.socket.readyState === 1 && document.readyState === "complete"', { timeout: 60000, label: 'hydrated' });
22. const imgsDone = () => page.waitFor(`Array.from(document.querySelectorAll('img')).filter(i => { const r = i.getBoundingClientRect(); return r.top < innerHeight && r.bottom > 0 }).every(i => i.complete)`, { timeout: 30000, label: 'imgs' }).catch(() => {});
23. const shot = async (n) => writeFileSync(`${OUT}/${n}.png`, Buffer.from((await page.send('Page.captureScreenshot', { format: 'png' })).data, 'base64'));
24. const load = async (path) => { const t = Date.now(); await page.goto(BASE + path, { timeout: 60000 }); await hydrated(); await imgsDone(); return Date.now() - t; };
25. const castInfo = () => ev(`JSON.stringify({ h1: (document.querySelector('show-header h1') || {}).textContent, cast: document.querySelectorAll('show-cast a.artist-link').length,
26. guests: document.querySelectorAll('show-cast a.artist-link[href^="/person/tmdb/"]').length, crew: document.querySelectorAll('show-crew a.crew-link').length,
27. shortId: (document.querySelector('#shortid') || {}).textContent || null })`).then(JSON.parse);
28. await page.send('Network.setCookie', { name: 'trackersid', value: SID, url: BASE });
29. const out = [];
30. let guestDone = false;
31. for (const [w, h, mobile] of [[390, 844, true], [1280, 900, false]]) {
32. await page.send('Emulation.setDeviceMetricsOverride', { width: w, height: h, deviceScaleFactor: mobile ? 2 : 1, mobile });
33. for (const slug of [SERIES, MOVIE]) {
34. const ms = await load('/shows/' + slug);
35. const html = (await (await fetch(BASE + '/shows/' + slug, { headers: { cookie: 'trackersid=' + SID } })).text()).length;
36. await shot(`${slug}-${w}`);
37. await ev(`(document.querySelector('show-crew') || document.querySelector('show-cast') || document.body).scrollIntoView()`);
38. await shot(`${slug}-credits-${w}`);
39. out.push(`${w} /shows/${slug}: full load ${ms} ms, HTML ${html} bytes, ${JSON.stringify(await castInfo())}`);
40. }
41. // a guest star: Show all, the first /person/tmdb/ link → the person page (created by THIS click on the first width, found after)
42. await load('/shows/' + SERIES);
43. if (await ev(`!!document.getElementById('casttoggle')`)) await ev(`document.getElementById('casttoggle').click()`);
44. const href = await ev(`(document.querySelector('show-cast a.artist-link[href^="/person/tmdb/"]') || {}).getAttribute ? document.querySelector('show-cast a.artist-link[href^="/person/tmdb/"]').getAttribute('href') : null`);
45. if (href) {
46. const name = await ev(`document.querySelector('show-cast a.artist-link[href^="/person/tmdb/"]').textContent`);
47. const t = Date.now();
48. await ev(`document.querySelector('show-cast a.artist-link[href^="/person/tmdb/"]').click()`);
49. await page.waitFor(`location.pathname.startsWith('/person/') && !location.pathname.startsWith('/person/tmdb/') && !!document.querySelector('person-meta h1') && !document.querySelector('#personloading')`, { timeout: 60000, label: 'guest page' });
50. const ms = Date.now() - t;
51. await imgsDone();
52. const p = await ev(`JSON.stringify({ path: location.pathname, h1: document.querySelector('person-meta h1').textContent, shortId: (document.querySelector('#shortid') || {}).textContent || null,
53. films: document.querySelectorAll('a.film-row').length, error: (document.querySelector('#fillerror') || {}).textContent || null })`);
54. await shot(`guest-person-${w}`);
55. out.push(`${w} guest "${name}" ${href} → ${p} in ${ms} ms (${guestDone ? 'person existed' : 'created by this click'})`);
56. guestDone = true;
57. } else out.push(`${w} no guest link on ${SERIES}`);
58. }
59. // watch + follow clicks (desktop width)
60. const clickTimes = async (sel, changed, n) => {
61. const res = [];
62. for (let i = 0; i < n; i++) {
63. const before = await ev(`document.querySelector(${JSON.stringify(sel)}).getAttribute('class') + '|' + document.querySelector(${JSON.stringify(sel)}).textContent`);
64. await page.resetWs();
65. // on the page's own clock: from the click until the answer's frame arrived (the DOM changes with it: hl:web applies the ack's
66. // value + session sync in one go) — CDP's polling is not counted
67. await ev(`window.__c0 = performance.now(); window.__hlWsAt = 0; document.querySelector(${JSON.stringify(sel)}).click()`);
68. await page.waitFor(`(document.querySelector(${JSON.stringify(sel)}).getAttribute('class') + '|' + document.querySelector(${JSON.stringify(sel)}).textContent) !== ${JSON.stringify(before)}`, { timeout: 30000, label: 'click' });
69. const ms = await ev(`Math.round(window.__hlWsAt - window.__c0)`);
70. await new Promise(r => setTimeout(r, 300));
71. const bytes = (await page.wsFrames()).reduce((a, f) => a + f.length, 0);
72. res.push(`${ms} ms/${bytes} B`);
73. }
74. return res.join(', ');
75. };
76. for (const slug of CLICK) {
77. await load('/shows/' + slug);
78. const ep = await ev(`(document.querySelector('episode-row button.checkicon') || {}).value || null`);
79. const info = await castInfo();
80. if (ep) out.push(`watch clicks /shows/${slug} (cast ${info.cast}, crew ${info.crew}) episode ${ep}: ${await clickTimes(`episode-row button.checkicon[value="${ep}"]`, null, 6)}`);
81. out.push(`follow clicks /shows/${slug}: ${await clickTimes('#follow', null, 2)}`);
82. }
83. console.log(out.join('\n'));
84. console.log('problems', JSON.stringify(page.problems ? page.problems() : []));
85. await browser.close();