✨ Add static HTML report generation for TDD run

clients/ember/src/test-support/index.js

@@ -247,6 +247,14 @@ export async function vizzlySnapshot(name, options = {}) {
 
     if (!response.ok) {
       let errorText = await response.text();
+
+      // Check if this is a "no server" error - gracefully skip instead of failing
+      // This allows tests to pass when Vizzly isn't running (like Percy behavior)
+      if (errorText.includes('No Vizzly server found')) {
+        console.warn('[vizzly] Vizzly server not running. Skipping visual snapshot.');
+        return { skipped: true, reason: 'no-server' };
+      }
+
       throw new Error(`Vizzly snapshot failed: ${errorText}`);
     }
 

package.json

@@ -58,11 +58,12 @@
   ],
   "scripts": {
     "start": "node src/index.js",
-    "build": "npm run clean && npm run compile && npm run build:reporter && npm run copy-types",
+    "build": "npm run clean && npm run compile && npm run build:reporter && npm run build:reporter-ssr && npm run copy-types",
     "clean": "rimraf dist",
     "compile": "babel src --out-dir dist --ignore '**/*.test.js'",
     "copy-types": "mkdir -p dist/types && cp src/types/*.d.ts dist/types/",
     "build:reporter": "cd src/reporter && vite build",
+    "build:reporter-ssr": "cd src/reporter && vite build --config vite.ssr.config.js",
     "dev:reporter": "cd src/reporter && vite --config vite.dev.config.js",
     "test:types": "tsd",
     "prepublishOnly": "npm run build",

src/cli.js

@@ -30,6 +30,11 @@ import { validateWhoamiOptions, whoamiCommand } from './commands/whoami.js';
 import { createPluginServices } from './plugin-api.js';
 import { loadPlugins } from './plugin-loader.js';
 import { createServices } from './services/index.js';
+import {
+  generateStaticReport,
+  getReportFileUrl,
+} from './services/static-report-generator.js';
+import { openBrowser } from './utils/browser.js';
 import { colors } from './utils/colors.js';
 import { loadConfig } from './utils/config-loader.js';
 import { getContext } from './utils/context.js';
@@ -411,6 +416,7 @@ tddCmd
     '--set-baseline',
     'Accept current screenshots as new baseline (overwrites existing)'
   )
+  .option('--no-open', 'Skip opening report in browser')
   .action(async (command, options) => {
     const globalOptions = program.opts();
 
@@ -449,23 +455,27 @@ tddCmd
     process.once('SIGINT', sigintHandler);
     process.once('SIGTERM', sigtermHandler);
 
-    // If there are comparisons, keep server running for review
+    // If there are comparisons, generate static report
     const hasComparisons = result?.comparisons?.length > 0;
     if (hasComparisons) {
-      output.print(
-        `  ${colors.brand.textTertiary('→')} Press ${colors.white('Enter')} to stop server`
-      );
-      output.blank();
-
-      // Wait for user to press Enter
-      await new Promise(resolve => {
-        process.stdin.setRawMode?.(false);
-        process.stdin.resume();
-        process.stdin.once('data', () => {
-          process.stdin.pause();
-          resolve();
-        });
-      });
+      // Note: Tests have completed at this point, so report-data.json is stable.
+      // The report reflects the final state of all comparisons.
+      const reportResult = await generateStaticReport(process.cwd());
+
+      if (reportResult.success) {
+        const reportUrl = getReportFileUrl(reportResult.reportPath);
+        output.print(
+          `  ${colors.brand.textTertiary('→')} Report: ${colors.blue(reportUrl)}`
+        );
+        output.blank();
+
+        // Open report in browser unless --no-open
+        if (options.open !== false) {
+          await openBrowser(reportUrl);
+        }
+      } else {
+        output.warn(`Failed to generate static report: ${reportResult.error}`);
+      }
     }
 
     // Remove signal handlers before normal cleanup to prevent double cleanup

src/reporter/src/api/client.js

@@ -9,14 +9,6 @@
  * - api.auth.*   - Authentication
  */
 
-/**
- * Check if we're in static mode (data embedded in HTML)
- * Static mode is used for self-contained HTML reports
- */
-export function isStaticMode() {
-  return typeof window !== 'undefined' && window.VIZZLY_STATIC_MODE === true;
-}
-
 /**
  * Make a JSON API request
  * @param {string} url - Request URL
@@ -53,10 +45,6 @@ export const tdd = {
    * @returns {Promise<Object|null>}
    */
   async getReportData() {
-    // In static mode, return embedded data directly without fetching
-    if (isStaticMode() && window.VIZZLY_REPORTER_DATA) {
-      return window.VIZZLY_REPORTER_DATA;
-    }
     return fetchJson('/api/report-data');
   },