// Production renderer integration test for the dynamic SessionDetail timeline. // Run: npm run test:electron:timeline import { app, BrowserWindow, ipcMain } from 'electron'; import { dirname, join } from 'node:path'; import { fileURLToPath } from 'node:url'; import { setTimeout as delay } from 'node:timers/promises'; import { createSessionPatch } from '../src/shared/session-patch.mjs'; import { assembleSessionMessages } from '../src/shared/session-detail-assembly.mjs'; const here = dirname(fileURLToPath(import.meta.url)); const appRoot = join(here, '..'); const sessionId = 'test-session'; const messageCount = Number(process.env.OBELISK_TIMELINE_MESSAGE_COUNT || 2000); const focusMessageIndex = Math.floor(messageCount * 0.75); const focusMessageUuid = `message-${focusMessageIndex}`; const stationaryAppendRuns = 3; const firstStationaryAppendIndex = messageCount; const scrollingAppendIndex = messageCount + stationaryAppendRuns; const tailAppendIndex = scrollingAppendIndex + 1; const channels = [ 'db:getSessions', 'db:getSessionMessages', 'db:getSessionToolCalls', 'db:getSessionToolResults', 'db:getSessionPatch', 'db:getSessionSubagents', 'db:getSessionWorkflows', 'db:getSessionSummaries', 'db:getMessageFullText', 'db:getMemories', 'db:getProjects', 'db:getStats', 'settings:get', ]; let failures = 0; let firstSessionListRead = true; const ipcReads = { messages: 0, toolCalls: 0, toolResults: 0, subagents: 0, workflows: 0, summaries: 0, patches: 0, patchMessageRows: [], }; const messages = Array.from({ length: messageCount }, (_, index) => ({ uuid: `message-${index}`, type: index % 2 === 0 ? 'user' : 'assistant', timestamp: new Date(Date.UTC(2026, 6, 14, 0, 0, index)).toISOString(), text: index === 1 ? '' : `Message ${index} ${'dynamic-height content '.repeat((index % 7) + 1)}`, content_type: index === 1 ? 'tool_use' : 'text', is_meta: 0, })); messages[focusMessageIndex].type = 'assistant'; messages[focusMessageIndex].text = `Truncated preview ${'indexed content '.repeat(700)}`; const fullTextSentinel = `FULL TEXT SENTINEL ${'complete content '.repeat(80)}`; const codexExecSource = 'const result = { ok: true };\nreturn result;'; let codexExecOutput = JSON.stringify([{ type: 'input_text', text: 'Script completed\nWall time 0.1 seconds\nOutput:\n{"ok":true}', }]); const toolCalls = [{ id: 'call-1', message_uuid: 'message-1', name: 'Bash', input_json: JSON.stringify({ command: 'printf virtualized' }), }, { id: 'call-codex-exec', message_uuid: focusMessageUuid, name: 'exec', input_json: JSON.stringify(codexExecSource), }]; const toolResults = [{ tool_use_id: 'call-1', content: `${'virtualized output\n'.repeat(80)}`, is_error: 0, }, { tool_use_id: 'call-codex-exec', content: codexExecOutput, is_error: 0, }]; function sessionSummary() { return { id: sessionId, title: 'Virtualized timeline integration', project: 'quiet-zero', project_path: '/tmp/quiet-zero', source: 'claude', started_at: '2026-07-14T00:00:00.000Z', ended_at: '2026-07-14T01:00:00.000Z', message_count: messages.length, git_branch: 'main', }; } function assert(condition, message) { if (condition) console.log(`PASS: ${message}`); else { failures++; console.error(`FAIL: ${message}`); } } async function waitFor(webContents, expression, message, timeoutMs = 8000) { const deadline = Date.now() + timeoutMs; while (Date.now() < deadline) { if (await webContents.executeJavaScript(`Boolean(${expression})`, true)) return; await delay(40); } throw new Error(`Timed out waiting for ${message}`); } async function startRendererTrace(win) { const traceEvents = []; let completeTrace; const traceComplete = new Promise(resolve => { completeTrace = resolve; }); const onMessage = (_event, method, params = {}) => { if (method === 'Tracing.dataCollected') traceEvents.push(...(params.value || [])); if (method === 'Tracing.tracingComplete') completeTrace(); }; win.webContents.debugger.attach('1.3'); win.webContents.debugger.on('message', onMessage); await win.webContents.debugger.sendCommand('Tracing.start', { categories: 'devtools.timeline,disabled-by-default-devtools.timeline,blink.user_timing,toplevel', options: 'record-as-much-as-possible', transferMode: 'ReportEvents', }); return async () => { await win.webContents.debugger.sendCommand('Tracing.end'); await traceComplete; win.webContents.debugger.removeListener('message', onMessage); win.webContents.debugger.detach(); return traceEvents; }; } function rendererTaskMetrics(traceEvents, startMark, endMark) { const start = traceEvents.find(event => event.name === startMark); const end = [...traceEvents].reverse().find(event => event.name === endMark); if (!start || !end) throw new Error(`Missing renderer trace marks: ${startMark}, ${endMark}`); const tasks = traceEvents .filter(event => ( /RunTask$/.test(event.name || '') && event.ph === 'X' && event.pid === start.pid && event.tid === start.tid && event.ts >= start.ts && event.ts <= end.ts )); const taskDurations = tasks.map(event => event.dur / 1000); if (taskDurations.length === 0) throw new Error('Renderer trace contained no RunTask events'); const slowest = tasks.reduce((best, task) => !best || task.dur > best.dur ? task : best, null); const slowestChildren = slowest ? traceEvents .filter(event => ( event.ph === 'X' && event.pid === slowest.pid && event.tid === slowest.tid && event !== slowest && event.ts >= slowest.ts && event.ts + (event.dur || 0) <= slowest.ts + slowest.dur )) .sort((a, b) => (b.dur || 0) - (a.dur || 0)) .slice(0, 8) .map(event => ({ name: event.name, durationMs: (event.dur || 0) / 1000 })) : []; return { tasks: taskDurations.length, maxTaskMs: Math.max(0, ...taskDurations), slowestChildren, }; } async function traceStationaryAppend(win, index, expectedTotal, runIndex) { const startMark = `obelisk-live-commit-${runIndex}-start`; const endMark = `obelisk-live-commit-${runIndex}-end`; const stopRendererTrace = await startRendererTrace(win); await win.webContents.executeJavaScript(`(() => { const expected = ${JSON.stringify(String(expectedTotal))}; const counter = document.querySelector('.flap-number'); performance.mark(${JSON.stringify(startMark)}); window.__obeliskLiveCommitObserved = new Promise(resolve => { const finish = () => requestAnimationFrame(() => { performance.mark(${JSON.stringify(endMark)}); resolve(true); }); if (counter?.getAttribute('aria-label') === expected) { finish(); return; } const observer = new MutationObserver(() => { if (counter?.getAttribute('aria-label') !== expected) return; observer.disconnect(); finish(); }); observer.observe(counter, { attributes: true, attributeFilter: ['aria-label'] }); }); return true; })()`, true); appendMessage(win, index); await win.webContents.executeJavaScript('window.__obeliskLiveCommitObserved', true); await win.webContents.executeJavaScript('delete window.__obeliskLiveCommitObserved', true); return rendererTaskMetrics(await stopRendererTrace(), startMark, endMark); } function registerHandlers() { ipcMain.handle('db:getSessions', async () => { if (firstSessionListRead) { firstSessionListRead = false; await delay(120); } return [sessionSummary()]; }); ipcMain.handle('db:getSessionMessages', () => { ipcReads.messages++; return messages; }); ipcMain.handle('db:getSessionToolCalls', () => { ipcReads.toolCalls++; return toolCalls; }); ipcMain.handle('db:getSessionToolResults', () => { ipcReads.toolResults++; return toolResults; }); ipcMain.handle('db:getSessionPatch', (_event, _sessionId, cursor) => { ipcReads.patches++; const patch = createSessionPatch({ messages: assembleSessionMessages({ messages, toolCalls, toolResults, subagents: [], workflows: [] }), workflows: [], }, cursor); ipcReads.patchMessageRows.push(patch.changes.messages.length); return patch; }); ipcMain.handle('db:getSessionSubagents', () => { ipcReads.subagents++; return []; }); ipcMain.handle('db:getSessionWorkflows', () => { ipcReads.workflows++; return []; }); ipcMain.handle('db:getSessionSummaries', () => { ipcReads.summaries++; return []; }); ipcMain.handle('db:getMessageFullText', (_event, uuid) => uuid === focusMessageUuid ? fullTextSentinel : null); ipcMain.handle('db:getMemories', () => []); ipcMain.handle('db:getProjects', () => [{ project: 'quiet-zero', count: 1 }]); ipcMain.handle('db:getStats', () => ({})); ipcMain.handle('settings:get', () => ({})); } function appendMessage(win, index) { messages.push({ uuid: `message-${index}`, type: index % 2 === 0 ? 'user' : 'assistant', timestamp: new Date().toISOString(), text: `Live message ${index}`, content_type: 'text', is_meta: 0, }); win.webContents.send('obelisk:session-updated', { sessionId }); } function replaceMessageText(win, uuid, text) { const index = messages.findIndex(message => message.uuid === uuid); if (index < 0) throw new Error(`Cannot update missing message ${uuid}`); messages[index] = { ...messages[index], text }; win.webContents.send('obelisk:session-updated', { sessionId }); } function replaceToolResult(win, toolUseId, content) { const index = toolResults.findIndex(result => result.tool_use_id === toolUseId); if (index < 0) throw new Error(`Cannot update missing tool result ${toolUseId}`); toolResults[index] = { ...toolResults[index], content }; win.webContents.send('obelisk:session-updated', { sessionId }); } async function run() { registerHandlers(); const win = new BrowserWindow({ show: false, width: 1200, height: 800, webPreferences: { preload: join(appRoot, 'out', 'preload', 'index.js'), contextIsolation: true, nodeIntegration: false, }, }); await win.loadFile(join(appRoot, 'out', 'renderer', 'index.html'), { hash: `/sessions/${sessionId}`, }); await waitFor( win.webContents, `document.querySelector('.flap-number')?.getAttribute('aria-label') === '${messageCount}'`, 'the cold-start session snapshot', ); const initial = await win.webContents.executeJavaScript(`(() => ({ current: Number(document.querySelector('.msg-nav-current')?.textContent), total: Number(document.querySelector('.flap-number')?.getAttribute('aria-label')), rows: document.querySelectorAll('.virtual-timeline-row').length, roots: document.querySelectorAll('.msg[data-uuid], .wf-card[data-uuid], .skill-card[data-uuid]').length, scrollTop: document.querySelector('.detail-wrap')?.scrollTop, scrollHeight: document.querySelector('.detail-wrap')?.scrollHeight, }))()`, true); assert(initial.scrollTop < 2 && initial.current < 100, `cold start stays at the beginning (scrollTop ${initial.scrollTop}, item ${initial.current})`); assert(initial.total === messageCount, `timeline exposes all ${messageCount} items (got ${initial.total})`); assert(initial.rows < 60 && initial.roots === initial.rows, `only ${initial.rows} virtual rows are mounted`); const disclosure = await win.webContents.executeJavaScript(`(async () => { const toggle = document.querySelector('.toolcall-toggle'); const row = toggle?.closest('.virtual-timeline-row'); const before = row?.getBoundingClientRect().height || 0; toggle?.click(); await new Promise(resolve => requestAnimationFrame(() => requestAnimationFrame(resolve))); const after = row?.getBoundingClientRect().height || 0; const wrap = document.querySelector('.detail-wrap'); wrap.scrollTop = wrap.scrollHeight * 0.55; await new Promise(resolve => setTimeout(resolve, 250)); const unmounted = !document.querySelector('[data-view-key="tool:call-1"]'); document.querySelector('button[title="First"]')?.click(); await new Promise(resolve => setTimeout(resolve, 350)); return { before, after, unmounted, restored: Boolean(document.querySelector('[data-view-key="tool:call-1"].open')), }; })()`, true); assert(disclosure.after > disclosure.before, `expanded tool row remeasures from ${disclosure.before}px to ${disclosure.after}px`); assert(disclosure.unmounted, 'the expanded tool row unmounts outside overscan'); assert(disclosure.restored, 'disclosure state survives unmount and remount'); await win.webContents.executeJavaScript(`window.location.hash = '#/sessions'`, true); await waitFor(win.webContents, `!document.querySelector('.virtual-timeline')`, 'session detail deactivation'); await win.webContents.executeJavaScript(`(async () => { const search = document.querySelector('#search'); search.value = 'SENTINEL'; search.dispatchEvent(new Event('input', { bubbles: true })); await new Promise(resolve => setTimeout(resolve, 300)); })()`, true); await win.webContents.executeJavaScript( `window.location.hash = '#/sessions/${sessionId}?focus=${focusMessageUuid}'`, true, ); await waitFor( win.webContents, `document.querySelector('[data-uuid="${focusMessageUuid}"].is-focused')`, 'offscreen UUID focus', ); const focusState = await win.webContents.executeJavaScript(`(() => { const target = document.querySelector('[data-uuid="${focusMessageUuid}"].is-focused'); const wrap = document.querySelector('.detail-wrap'); const targetRect = target.getBoundingClientRect(); const wrapRect = wrap.getBoundingClientRect(); return { current: Number(document.querySelector('.msg-nav-current')?.textContent), visible: targetRect.bottom > wrapRect.top && targetRect.top < wrapRect.bottom, }; })()`, true); assert(focusState.visible, `UUID navigation mounts and reveals ${focusMessageUuid} (viewport ends at item ${focusState.current})`); const codexDisplayState = await win.webContents.executeJavaScript(`(async () => { const tool = document.querySelector('[data-view-key="tool:call-codex-exec"]'); tool?.querySelector('.toolcall-toggle')?.click(); tool?.querySelector('.raw-toggle')?.click(); await new Promise(resolve => requestAnimationFrame(() => requestAnimationFrame(resolve))); return { open: tool?.classList.contains('open'), raw: tool?.querySelector('.raw-toggle')?.classList.contains('active'), }; })()`, true); assert(codexDisplayState.open && codexDisplayState.raw, 'Codex exec disclosure and Raw state update without rebuilding its presentation'); codexExecOutput = JSON.stringify([{ type: 'input_text', text: 'Script completed\nWall time 0.1 seconds\nOutput:\n{"ok":true,"revision":2}', }]); replaceToolResult(win, 'call-codex-exec', codexExecOutput); await waitFor( win.webContents, `document.querySelector('[data-view-key="tool:call-codex-exec"] .toolcall-raw')?.textContent.includes('revision')`, 'updated Codex exec result', ); const updatedCodexDisplayState = await win.webContents.executeJavaScript(`(() => { const tool = document.querySelector('[data-view-key="tool:call-codex-exec"]'); return { open: tool?.classList.contains('open'), raw: tool?.querySelector('.raw-toggle')?.classList.contains('active'), }; })()`, true); assert(updatedCodexDisplayState.open && updatedCodexDisplayState.raw, 'Codex exec disclosure and Raw state survive a result update'); await win.webContents.executeJavaScript( `document.querySelector('[data-uuid="${focusMessageUuid}"] .truncated-btn')?.click()`, true, ); await waitFor( win.webContents, `document.querySelector('[data-uuid="${focusMessageUuid}"]')?.textContent.includes('FULL TEXT SENTINEL')`, 'expanded full message text', ); const fullTextSearchState = await win.webContents.executeJavaScript(`(() => { const target = document.querySelector('[data-uuid="${focusMessageUuid}"]'); return { highlighted: [...target.querySelectorAll('mark')].some(mark => mark.textContent === 'SENTINEL'), truncatedButtonRemoved: !target.querySelector('.truncated-btn'), }; })()`, true); assert( fullTextSearchState.highlighted && fullTextSearchState.truncatedButtonRemoved, 'full-text expansion re-renders the row and preserves search highlighting', ); await delay(250); await win.webContents.executeJavaScript(`(() => { const original = window.marked.parse; const originalJsonParse = JSON.parse; const codexExecOutput = ${JSON.stringify(codexExecOutput)}; const trackedPrefixes = [...document.querySelectorAll('.virtual-timeline-row [data-uuid]')] .map(element => element.getAttribute('data-uuid')) .filter(uuid => /^message-\d+$/.test(uuid)) .map(uuid => 'Message ' + uuid.slice('message-'.length) + ' '); let calls = 0; let codexExecCalls = 0; window.marked.parse = function timelineMarkdownProbe(...args) { const text = String(args[0] || ''); if (trackedPrefixes.some(prefix => text.startsWith(prefix))) calls++; return original.apply(this, args); }; JSON.parse = function timelineJsonProbe(value, ...args) { if (value === codexExecOutput) codexExecCalls++; return originalJsonParse.call(this, value, ...args); }; window.__timelineMarkdownProbe = { calls: () => calls, codexExecCalls: () => codexExecCalls, restore: () => { window.marked.parse = original; JSON.parse = originalJsonParse; }, }; })()`, true); const stationaryAnchorBefore = await win.webContents.executeJavaScript(`(() => { const wrap = document.querySelector('.detail-wrap'); const wrapRect = wrap.getBoundingClientRect(); const anchorRow = [...document.querySelectorAll('.virtual-timeline-row')] .find(row => { const rect = row.getBoundingClientRect(); return rect.bottom > wrapRect.top && rect.top < wrapRect.bottom; }); const anchorElement = anchorRow?.querySelector('[data-uuid]'); return anchorElement && { uuid: anchorElement.getAttribute('data-uuid'), offset: anchorRow.getBoundingClientRect().top - wrapRect.top, }; })()`, true); const stationaryTraces = []; for (let runIndex = 0; runIndex < stationaryAppendRuns; runIndex++) { stationaryTraces.push(await traceStationaryAppend( win, firstStationaryAppendIndex + runIndex, messageCount + runIndex + 1, runIndex, )); await delay(250); } const stationaryAnchorSelector = `[data-uuid="${stationaryAnchorBefore?.uuid}"]`; const stationaryAnchorAfter = await win.webContents.executeJavaScript(`(() => { const wrap = document.querySelector('.detail-wrap'); const target = document.querySelector(${JSON.stringify(stationaryAnchorSelector)}); const row = target?.closest('.virtual-timeline-row'); return target && { uuid: target.getAttribute('data-uuid'), offset: row.getBoundingClientRect().top - wrap.getBoundingClientRect().top, }; })()`, true); const unchangedRowRenderCalls = await win.webContents.executeJavaScript(`(() => { const calls = { markdown: window.__timelineMarkdownProbe.calls(), codexExec: window.__timelineMarkdownProbe.codexExecCalls(), }; window.__timelineMarkdownProbe.restore(); delete window.__timelineMarkdownProbe; return calls; })()`, true); assert(unchangedRowRenderCalls.markdown === 0, `three tail appends perform zero Markdown formatting calls for unchanged mounted rows (got ${unchangedRowRenderCalls.markdown})`); assert(unchangedRowRenderCalls.codexExec === 0, `three tail appends perform zero Codex exec JSON decodes for an unchanged mounted row (got ${unchangedRowRenderCalls.codexExec})`); assert( stationaryAnchorBefore?.uuid === stationaryAnchorAfter?.uuid && Math.abs(stationaryAnchorBefore.offset - stationaryAnchorAfter.offset) < 2, `stationary live commits preserve reader anchor ${stationaryAnchorBefore?.uuid}`, ); for (const [runIndex, trace] of stationaryTraces.entries()) { if (trace.maxTaskMs >= 8.33) console.log(`SLOWEST RENDERER TASK ${runIndex + 1}: ${JSON.stringify(trace.slowestChildren)}`); assert(trace.maxTaskMs < 8.33, `stationary live commit ${runIndex + 1} stays inside a 120Hz renderer task budget (${trace.maxTaskMs.toFixed(2)}ms across ${trace.tasks} tasks)`); } setTimeout(() => appendMessage(win, scrollingAppendIndex), 250); const scrollProbe = await win.webContents.executeJavaScript(`new Promise(resolve => { const wrap = document.querySelector('.detail-wrap'); const gaps = []; const startedAt = performance.now(); let previous = startedAt; function frame(now) { gaps.push(now - previous); previous = now; wrap.scrollTop += 70; if (now - startedAt < 1200) requestAnimationFrame(frame); else { const wrapRect = wrap.getBoundingClientRect(); const anchorRow = [...document.querySelectorAll('.virtual-timeline-row')] .find(row => { const rect = row.getBoundingClientRect(); return rect.bottom > wrapRect.top && rect.top < wrapRect.bottom; }); const anchorElement = anchorRow?.querySelector('[data-uuid]'); resolve({ maxFrameGap: Math.max(...gaps), frames: gaps.length, rows: document.querySelectorAll('.virtual-timeline-row').length, distanceFromTail: wrap.scrollHeight - wrap.clientHeight - wrap.scrollTop, anchor: anchorElement && { uuid: anchorElement.getAttribute('data-uuid'), offset: anchorRow.getBoundingClientRect().top - wrapRect.top, }, }); } } requestAnimationFrame(frame); })`, true); await waitFor( win.webContents, `document.querySelector('.flap-number')?.getAttribute('aria-label') === '${messageCount + stationaryAppendRuns + 1}'`, 'reader-position live update', ); const readerState = await win.webContents.executeJavaScript(`(() => { const wrap = document.querySelector('.detail-wrap'); const anchorElement = document.querySelector( ${JSON.stringify(`[data-uuid="${scrollProbe.anchor?.uuid}"]`)}, ); const anchorRow = anchorElement?.closest('.virtual-timeline-row'); return { current: Number(document.querySelector('.msg-nav-current')?.textContent), anchor: anchorElement && { uuid: anchorElement.getAttribute('data-uuid'), offset: anchorRow.getBoundingClientRect().top - wrap.getBoundingClientRect().top, }, }; })()`, true); assert(scrollProbe.rows < 60, `live scrolling keeps mounted rows bounded (${scrollProbe.rows})`); assert(scrollProbe.anchor, 'reader anchor is captured before the deferred live commit'); assert( scrollProbe.distanceFromTail > 1000 && readerState.current < messageCount + stationaryAppendRuns + 1 && readerState.anchor?.uuid === scrollProbe.anchor?.uuid && Math.abs(readerState.anchor.offset - scrollProbe.anchor.offset) < 2, `live append preserves reader anchor ${scrollProbe.anchor?.uuid} (${scrollProbe.anchor?.offset}px -> ${readerState.anchor?.offset}px)`, ); assert(scrollProbe.maxFrameGap < 250, `live scroll has no catastrophic long frame (${scrollProbe.maxFrameGap.toFixed(1)}ms)`); const updatedReaderText = `Updated ${scrollProbe.anchor.uuid} ${'content identity '.repeat(20)}`; await win.webContents.executeJavaScript(`(() => { const original = window.marked.parse; const targetUuid = ${JSON.stringify(scrollProbe.anchor.uuid)}; const targetText = ${JSON.stringify(updatedReaderText)}; const unchangedPrefixes = [...document.querySelectorAll('.virtual-timeline-row [data-uuid]')] .map(element => element.getAttribute('data-uuid')) .filter(uuid => uuid !== targetUuid && /^message-\d+$/.test(uuid)) .map(uuid => 'Message ' + uuid.slice('message-'.length) + ' '); let targetCalls = 0; let unchangedCalls = 0; window.marked.parse = function timelineContentIdentityProbe(value, ...args) { const text = String(value || ''); if (text === targetText) targetCalls++; if (unchangedPrefixes.some(prefix => text.startsWith(prefix))) unchangedCalls++; return original.call(this, value, ...args); }; window.__timelineContentIdentityProbe = { calls: () => ({ target: targetCalls, unchanged: unchangedCalls }), restore: () => { window.marked.parse = original; }, }; })()`, true); replaceMessageText(win, scrollProbe.anchor.uuid, updatedReaderText); await waitFor( win.webContents, `document.querySelector('[data-uuid=${JSON.stringify(scrollProbe.anchor.uuid)}]')?.textContent.includes(${JSON.stringify(updatedReaderText.slice(0, 40))})`, 'visible message content update', ); const contentIdentityCalls = await win.webContents.executeJavaScript(`(() => { const calls = window.__timelineContentIdentityProbe.calls(); window.__timelineContentIdentityProbe.restore(); delete window.__timelineContentIdentityProbe; return calls; })()`, true); assert(contentIdentityCalls.target === 1, `updated mounted row recomputes its Markdown once (got ${contentIdentityCalls.target})`); assert(contentIdentityCalls.unchanged === 0, `updated mounted row leaves other mounted Markdown cached (got ${contentIdentityCalls.unchanged})`); assert( ipcReads.messages === 1 && ipcReads.toolCalls === 1 && ipcReads.toolResults === 1 && ipcReads.subagents === 1 && ipcReads.workflows === 1 && ipcReads.summaries === 1 && ipcReads.patches === 6 && ipcReads.patchMessageRows.every(count => count === 1), `live updates use six single-message patches after one full snapshot (${JSON.stringify(ipcReads)})`, ); await win.webContents.executeJavaScript(`document.querySelector('button[title="Last"]')?.click()`, true); await waitFor( win.webContents, `document.querySelector('.msg-nav-current')?.textContent === '${messageCount + stationaryAppendRuns + 1}'`, 'last-item navigation', ); await waitFor( win.webContents, `(() => { const wrap = document.querySelector('.detail-wrap'); return wrap.scrollHeight - wrap.clientHeight - wrap.scrollTop < 2; })()`, 'last-item scroll settlement', ); appendMessage(win, tailAppendIndex); await waitFor( win.webContents, `document.querySelector('.flap-number')?.getAttribute('aria-label') === '${messageCount + stationaryAppendRuns + 2}'`, 'tail-follow total update', ); await delay(1000); const tailState = await win.webContents.executeJavaScript(`(() => { const wrap = document.querySelector('.detail-wrap'); return { current: Number(document.querySelector('.msg-nav-current')?.textContent), total: Number(document.querySelector('.flap-number')?.getAttribute('aria-label')), scrollTop: wrap.scrollTop, maxScrollTop: wrap.scrollHeight - wrap.clientHeight, distanceFromTail: wrap.scrollHeight - wrap.clientHeight - wrap.scrollTop, }; })()`, true); assert( tailState.current === messageCount + stationaryAppendRuns + 2 && tailState.distanceFromTail < 2, `tail follow reaches item ${messageCount + stationaryAppendRuns + 2} (${JSON.stringify(tailState)})`, ); const reduction = (1 - initial.rows / initial.total) * 100; console.log(`PERF: ${initial.total} timeline items -> ${initial.rows} mounted rows (${reduction.toFixed(2)}% fewer roots)`); console.log(`PERF: ${scrollProbe.frames} frames, max frame gap ${scrollProbe.maxFrameGap.toFixed(1)}ms during live scroll`); win.destroy(); } app.whenReady() .then(run) .catch(error => { failures++; console.error(error.stack || error); }) .finally(() => { for (const channel of channels) ipcMain.removeHandler(channel); app.exit(failures ? 1 : 0); });