Add real webview screenshot capture using actual compiled bundles

New script capture-real-screenshots.js renders the real extension
webview bundles (dist/webview/details.js, chart.js, usage.js,
diagnostics.js) in headless Playwright/Chromium with:
- VS Code Dark+ theme CSS variable values
- acquireVsCodeApi() mock
- Realistic sample data matching the exact window.__INITIAL_*__ shapes

This produces pixel-accurate screenshots of the actual extension UI
code -- same HTML, same CSS, same JS -- just rendered outside VS Code.

- Update CI workflow to: npm ci, npm run compile, then capture-real
- Add npm run screenshot:real script
- Add harness HTML files to .gitignore

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>

Author: rajbos

.github/workflows/screenshot-generation.yml

@@ -9,8 +9,7 @@ on:
   push:
     paths:
       - 'vscode-extension/src/**'
-      - 'scripts/generate-all-previews.js'
-      - 'scripts/capture-screenshots.js'
+      - 'scripts/capture-real-screenshots.js'
       - 'test-data/**'
       - '.github/workflows/screenshot-generation.yml'
 
@@ -28,23 +27,24 @@ jobs:
         uses: actions/setup-node@v4
         with:
           node-version: '20'
+          cache: 'npm'
+          cache-dependency-path: vscode-extension/package-lock.json
 
-      - name: Verify test data exists
-        run: |
-          echo "Checking test data..."
-          ls -la test-data/chatSessions/
-          echo "Found $(find test-data/chatSessions -name '*.json' | wc -l) test session files"
+      - name: Install extension dependencies
+        working-directory: vscode-extension
+        run: npm ci
 
-      - name: Generate HTML previews from test data
-        run: node scripts/generate-all-previews.js
+      - name: Build extension (produces webview bundles)
+        working-directory: vscode-extension
+        run: npm run compile
 
       - name: Install Playwright
         run: |
           npm install playwright
           npx playwright install chromium --with-deps
 
-      - name: Capture screenshots
-        run: node scripts/capture-screenshots.js
+      - name: Capture real screenshots
+        run: node scripts/capture-real-screenshots.js
 
       - name: List generated screenshots
         run: |

.gitignore

@@ -10,6 +10,7 @@ node_modules
 docs/images/screenshots/screenshot-instructions.html
 docs/images/screenshots/details-view-preview.html
 docs/images/screenshots/preview-*.html
+docs/images/screenshots/harness-*.html
 docs/images/screenshots/*.png
 example.json
 log-example.txt