Fix github-comment tests to use actual code and document diff truncation

- Export buildCommentBody from github-comment.ts so tests can import it
  directly instead of reimplementing the function
- Rewrite github-comment.test.ts to import and test the real function
- Add "Diff truncation" section to README documenting the 8k/10k char
  limits in the change summarizer and script generator stages

https://claude.ai/code/session_01PAVFqsnf36BamyXEiwS8DU

Author: claude

README.md

@@ -527,6 +527,19 @@ See [CLAUDE.md](CLAUDE.md) for repo structure and contributor notes.
 
 ---
 
+## Diff truncation
+
+Large diffs are automatically truncated before being sent to the LLM to stay within reasonable token budgets:
+
+| Stage | Character limit | Purpose |
+|---|---|---|
+| Change summarizer | 8 000 chars | Analyzing what changed and suggesting a demo flow |
+| Script generator | 10 000 chars | Generating the Playwright interaction script |
+
+When a diff exceeds the limit, it is cut at the threshold and a `... (diff truncated)` marker is appended so the LLM knows the input is incomplete. In practice this means very large PRs may produce less accurate scripts — consider using `routeMap` or `app.hint` to give the LLM additional context when working with big diffs.
+
+---
+
 ## Known limitations
 
 - **Single entry point** — only one preview URL or start command per run is supported; multiple entry points are planned.

packages/core/src/publisher/github-comment.ts

@@ -103,7 +103,7 @@ async function findExistingComment(
   return existing ? { id: existing.id } : null;
 }
 
-function buildCommentBody(options: CommentOptions): string {
+export function buildCommentBody(options: CommentOptions): string {
   const { analysis, recordingUrl, screenshots, script, rerunUrl } = options;
 
   const changedFilesList = analysis.changedFiles

tests/unit/github-comment.test.ts

@@ -1,99 +1,17 @@
-import { describe, it, expect, vi, beforeEach } from 'vitest';
+import { describe, it, expect } from 'vitest';
+import { buildCommentBody } from '../../packages/core/src/publisher/github-comment.js';
 import type { ChangeAnalysis } from '../../packages/core/src/analyzer/change-summarizer.js';
 
-const mockCreateComment = vi.fn();
-const mockUpdateComment = vi.fn();
-const mockListComments = vi.fn();
-
-// Mock the entire github-comment module's Octokit dependency
-// by mocking the source module itself and re-implementing with our stubs
-vi.mock('../../packages/core/src/publisher/github-comment.js', async (importOriginal) => {
-  // We need to intercept the Octokit constructor that the original module uses.
-  // Replace @octokit/rest in the module resolution before the original loads.
-  vi.stubGlobal('__mockOctokit', {
-    rest: {
-      issues: {
-        createComment: mockCreateComment,
-        updateComment: mockUpdateComment,
-        listComments: mockListComments,
-      },
-    },
-  });
-
-  // Instead, let's manually implement the functions to test the comment body logic
-  return importOriginal();
-});
-
-// Since we can't easily mock nested deps, let's test comment body construction
-// by calling the exported functions with a properly mocked Octokit.
-// The real issue is @octokit/rest module resolution path — let's work around it.
-
-describe('postPRComment comment body construction', () => {
-  // Since mocking Octokit across pnpm workspace boundaries is unreliable,
-  // we test the comment body logic by examining the function contract.
-  // We replicate the internal buildCommentBody logic to verify its behavior.
-
+describe('buildCommentBody', () => {
   const ANALYSIS: ChangeAnalysis = {
     changedFiles: ['app/routes/home.tsx', 'src/components/Button.tsx'],
     affectedRoutes: [{ file: 'app/routes/home.tsx', route: '/', changeType: 'modified' }],
     changeDescription: 'Added a virtual try-on button',
     suggestedDemoFlow: '1. Navigate to home page\n2. Click try-on button',
   };
 
-  // Replicate buildCommentBody logic for direct testing
-  function buildCommentBody(options: {
-    analysis: ChangeAnalysis;
-    recordingUrl?: string;
-    screenshots?: string[];
-    script: string;
-    rerunUrl?: string;
-  }): string {
-    const COMMENT_MARKER = '<!-- git-glimpse-demo -->';
-    const { analysis, recordingUrl, screenshots, script, rerunUrl } = options;
-
-    const changedFilesList = analysis.changedFiles
-      .slice(0, 5)
-      .map((f) => `\`${f}\``)
-      .join(', ');
-    const moreFiles = analysis.changedFiles.length > 5
-      ? ` (+${analysis.changedFiles.length - 5} more)`
-      : '';
-
-    const mediaSection = recordingUrl
-      ? `![Demo](${recordingUrl})\n\n[📱 Can't see the preview? Open it directly](${recordingUrl})`
-      : screenshots && screenshots.length > 0
-      ? screenshots
-          .map((s, i) => `![Screenshot ${i + 1}](${s})\n\n[📱 Can't see screenshot ${i + 1}? Open it directly](${s})`)
-          .join('\n\n')
-      : '_No recording available._';
-
-    const rerunSection = rerunUrl ? `\n\n[↺ Re-run demo](${rerunUrl})` : '';
-
-    return `${COMMENT_MARKER}
-## 🧐 UI Demo Preview
-
-**Changes detected in**: ${changedFilesList}${moreFiles}
-
-**What changed**: ${analysis.changeDescription}
-
-${mediaSection}
-
-<details>
-<summary>Demo script (auto-generated)</summary>
-
-\`\`\`typescript
-${script}
-\`\`\`
-</details>
-
----
-*Generated by [git-glimpse](https://github.com/DeDuckProject/git-glimpse)${rerunSection}*
-
-<img src="https://raw.githubusercontent.com/DeDuckProject/git-glimpse/main/assets/logo_square_small.png" width="90" height="90" alt="git-glimpse logo" />`;
-  }
-
   it('includes comment marker for idempotent updates', () => {
-    const body = buildCommentBody({ analysis: ANALYSIS, script: 'demo()' });
+    const body = buildCommentBody({ analysis: ANALYSIS, script: 'demo()', owner: 'o', repo: 'r', pullNumber: 1 });
     expect(body).toContain('<!-- git-glimpse-demo -->');
   });
 
@@ -102,6 +20,7 @@ ${script}
       analysis: ANALYSIS,
       recordingUrl: 'https://example.com/demo.gif',
       script: 'demo()',
+      owner: 'o', repo: 'r', pullNumber: 1,
     });
     expect(body).toContain('![Demo](https://example.com/demo.gif)');
     expect(body).toContain('Open it directly');
@@ -112,14 +31,15 @@ ${script}
       analysis: ANALYSIS,
       screenshots: ['https://example.com/s1.png', 'https://example.com/s2.png'],
       script: 'demo()',
+      owner: 'o', repo: 'r', pullNumber: 1,
     });
     expect(body).toContain('Screenshot 1');
     expect(body).toContain('Screenshot 2');
     expect(body).not.toContain('No recording available');
   });
 
   it('shows fallback when neither recording nor screenshots are present', () => {
-    const body = buildCommentBody({ analysis: ANALYSIS, script: 'demo()' });
+    const body = buildCommentBody({ analysis: ANALYSIS, script: 'demo()', owner: 'o', repo: 'r', pullNumber: 1 });
     expect(body).toContain('No recording available');
   });
 
@@ -128,27 +48,27 @@ ${script}
       ...ANALYSIS,
       changedFiles: ['a.tsx', 'b.tsx', 'c.tsx', 'd.tsx', 'e.tsx', 'f.tsx', 'g.tsx'],
     };
-    const body = buildCommentBody({ analysis: manyFilesAnalysis, script: 'demo()' });
+    const body = buildCommentBody({ analysis: manyFilesAnalysis, script: 'demo()', owner: 'o', repo: 'r', pullNumber: 1 });
     expect(body).toContain('`a.tsx`');
     expect(body).toContain('`e.tsx`');
     expect(body).not.toContain('`f.tsx`');
     expect(body).toContain('+2 more');
   });
 
   it('shows all files when 5 or fewer', () => {
-    const body = buildCommentBody({ analysis: ANALYSIS, script: 'demo()' });
+    const body = buildCommentBody({ analysis: ANALYSIS, script: 'demo()', owner: 'o', repo: 'r', pullNumber: 1 });
     expect(body).toContain('`app/routes/home.tsx`');
     expect(body).toContain('`src/components/Button.tsx`');
     expect(body).not.toContain('more');
   });
 
   it('includes the change description', () => {
-    const body = buildCommentBody({ analysis: ANALYSIS, script: 'demo()' });
+    const body = buildCommentBody({ analysis: ANALYSIS, script: 'demo()', owner: 'o', repo: 'r', pullNumber: 1 });
     expect(body).toContain('Added a virtual try-on button');
   });
 
   it('wraps script in collapsible details with typescript code block', () => {
-    const body = buildCommentBody({ analysis: ANALYSIS, script: 'export async function demo(page) {}' });
+    const body = buildCommentBody({ analysis: ANALYSIS, script: 'export async function demo(page) {}', owner: 'o', repo: 'r', pullNumber: 1 });
     expect(body).toContain('<details>');
     expect(body).toContain('Demo script (auto-generated)');
     expect(body).toContain('```typescript');
@@ -160,18 +80,19 @@ ${script}
       analysis: ANALYSIS,
       script: 'demo()',
       rerunUrl: 'https://github.com/owner/repo/actions/runs/123',
+      owner: 'o', repo: 'r', pullNumber: 1,
     });
     expect(body).toContain('Re-run demo');
     expect(body).toContain('https://github.com/owner/repo/actions/runs/123');
   });
 
   it('omits rerun link when not provided', () => {
-    const body = buildCommentBody({ analysis: ANALYSIS, script: 'demo()' });
+    const body = buildCommentBody({ analysis: ANALYSIS, script: 'demo()', owner: 'o', repo: 'r', pullNumber: 1 });
     expect(body).not.toContain('Re-run demo');
   });
 
   it('includes git-glimpse branding', () => {
-    const body = buildCommentBody({ analysis: ANALYSIS, script: 'demo()' });
+    const body = buildCommentBody({ analysis: ANALYSIS, script: 'demo()', owner: 'o', repo: 'r', pullNumber: 1 });
     expect(body).toContain('git-glimpse');
     expect(body).toContain('logo_square_small.png');
   });
@@ -182,6 +103,7 @@ ${script}
       recordingUrl: 'https://example.com/demo.gif',
       screenshots: ['https://example.com/s1.png'],
       script: 'demo()',
+      owner: 'o', repo: 'r', pullNumber: 1,
     });
     expect(body).toContain('![Demo]');
     expect(body).not.toContain('Screenshot 1');