@nexustools/nwjstestrunner 0.0.0-stage → 1.0.0-beta.1

package/src/harness/graphical-overlay-view.ts

@@ -0,0 +1,219 @@
+import { GraphicalOverlayOptions } from '../types/test-runner-types';
+
+export class GraphicalOverlayView {
+  private readonly options: GraphicalOverlayOptions;
+  private webviewEl: any = null;
+  private titleEl: HTMLElement | null = null;
+  private statusEl: HTMLElement | null = null;
+  private metricCurrentEl: HTMLElement | null = null;
+  private metricPassedEl: HTMLElement | null = null;
+  private metricFailedEl: HTMLElement | null = null;
+  private progressFillEl: HTMLElement | null = null;
+
+  constructor(options: GraphicalOverlayOptions = {}) {
+    this.options = options;
+  }
+
+  public mount(doc: Document = document): void {
+    const title = this.options.title || '🧪 NW.js Live Webview Test Runner';
+    const enableWebview = this.options.enableWebview ?? true;
+    const partition = this.options.webviewPartition || 'trusted';
+    const allowNw = this.options.allowNwInWebview ?? true;
+
+    if (!doc.getElementById('nwjstestrunner-styles')) {
+      const styleEl = doc.createElement('style');
+      styleEl.id = 'nwjstestrunner-styles';
+      styleEl.textContent = `
+        body, html {
+          margin: 0;
+          padding: 0;
+          width: 100vw;
+          height: 100vh;
+          background: #11111b;
+          overflow: hidden;
+          font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, monospace;
+        }
+        #webview-container {
+          width: 100vw;
+          height: 100vh;
+          position: absolute;
+          top: 0;
+          left: 0;
+          z-index: 1;
+        }
+        webview {
+          width: 100%;
+          height: 100%;
+          border: none;
+          opacity: 0.95;
+        }
+        #test-runner-overlay {
+          pointer-events: none;
+          position: fixed;
+          top: 0;
+          left: 0;
+          width: 100vw;
+          height: 100vh;
+          z-index: 9999;
+          background: rgba(0, 0, 0, 0.28);
+          display: flex;
+          flex-direction: column;
+          align-items: center;
+          justify-content: center;
+          color: #cdd6f4;
+          text-align: center;
+        }
+        .overlay-card {
+          background: #1e1e2e;
+          border: 1px solid #313244;
+          padding: 30px 45px;
+          border-radius: 12px;
+          box-shadow: 0 10px 30px rgba(0, 0, 0, 0.55);
+          min-width: 440px;
+          max-width: 560px;
+        }
+        .overlay-title {
+          font-size: 22px;
+          font-weight: bold;
+          margin-bottom: 12px;
+          color: #cba6f7;
+        }
+        .overlay-status {
+          font-size: 14px;
+          margin-bottom: 14px;
+          color: #89b4fa;
+          font-family: monospace;
+          white-space: nowrap;
+          overflow: hidden;
+          text-overflow: ellipsis;
+          max-width: 460px;
+        }
+        .overlay-progress-track {
+          width: 100%;
+          height: 6px;
+          background: #313244;
+          border-radius: 3px;
+          overflow: hidden;
+          margin-bottom: 16px;
+        }
+        .overlay-progress-fill {
+          width: 0%;
+          height: 100%;
+          background: linear-gradient(90deg, #89b4fa, #cba6f7);
+          transition: width 0.12s ease-out;
+        }
+        .overlay-metric {
+          font-size: 18px;
+          margin: 8px 0;
+          font-weight: 600;
+          display: flex;
+          align-items: center;
+          justify-content: space-between;
+        }
+        .status-running { color: #89b4fa; }
+        .status-passed { color: #a6e3a1; }
+        .status-failed { color: #f38ba8; }
+      `;
+      doc.head.appendChild(styleEl);
+    }
+
+    if (enableWebview && !doc.getElementById('client-webview')) {
+      let container = doc.getElementById('webview-container');
+      if (!container) {
+        container = doc.createElement('div');
+        container.id = 'webview-container';
+        doc.body.appendChild(container);
+      }
+      const wv = doc.createElement('webview');
+      wv.id = 'client-webview';
+      if (allowNw) {
+        wv.setAttribute('allownw', '');
+      }
+      wv.setAttribute('partition', partition);
+      container.appendChild(wv);
+    }
+
+    if (!doc.getElementById('test-runner-overlay')) {
+      const overlay = doc.createElement('div');
+      overlay.id = 'test-runner-overlay';
+      overlay.innerHTML = `
+        <div class="overlay-card">
+          <div id="overlay-title" class="overlay-title"></div>
+          <div id="overlay-status" class="overlay-status">Initializing test harness...</div>
+          <div class="overlay-progress-track">
+            <div id="overlay-progress-fill" class="overlay-progress-fill"></div>
+          </div>
+          <div class="overlay-metric status-running">
+            <span>Completed:</span>
+            <span id="metric-current">0 of 0</span>
+          </div>
+          <div class="overlay-metric status-passed">
+            <span>✅ Tests Passed:</span>
+            <span id="metric-passed">0</span>
+          </div>
+          <div class="overlay-metric status-failed">
+            <span>❌ Tests Failed:</span>
+            <span id="metric-failed">0</span>
+          </div>
+        </div>
+      `;
+      doc.body.appendChild(overlay);
+    }
+
+    this.webviewEl = doc.getElementById('client-webview');
+    this.titleEl =
+      doc.getElementById('overlay-title') ||
+      (doc.querySelector('#test-runner-overlay .overlay-title') as HTMLElement | null);
+    this.statusEl = doc.getElementById('overlay-status');
+    this.metricCurrentEl = doc.getElementById('metric-current');
+    this.metricPassedEl = doc.getElementById('metric-passed');
+    this.metricFailedEl = doc.getElementById('metric-failed');
+    this.progressFillEl = doc.getElementById('overlay-progress-fill');
+
+    if (this.titleEl && this.options.title) {
+      this.titleEl.textContent = title;
+    }
+    try {
+      if (this.options.title && doc.title !== this.options.title) {
+        doc.title = this.options.title;
+      }
+    } catch (_e) {}
+  }
+
+  public getWebviewElement(): any {
+    return this.webviewEl;
+  }
+
+  public setTitle(title: string): void {
+    if (this.titleEl) {
+      this.titleEl.textContent = title;
+    }
+  }
+
+  public setStatus(statusText: string): void {
+    if (this.statusEl) {
+      this.statusEl.textContent = statusText;
+    }
+  }
+
+  public updateMetrics(completed: number, total: number, passed: number, failed: number): void {
+    if (this.metricCurrentEl) {
+      this.metricCurrentEl.textContent = `${completed} of ${total}`;
+    }
+    if (this.metricPassedEl) {
+      this.metricPassedEl.textContent = `${passed}`;
+    }
+    if (this.metricFailedEl) {
+      this.metricFailedEl.textContent = `${failed}`;
+    }
+    if (this.progressFillEl) {
+      const pct = total > 0 ? Math.min(100, Math.round((completed / total) * 100)) : 0;
+      this.progressFillEl.style.width = `${pct}%`;
+      if (failed > 0) {
+        this.progressFillEl.style.background = 'linear-gradient(90deg, #f38ba8, #eba0ac)';
+      } else if (completed >= total && total > 0) {
+        this.progressFillEl.style.background = 'linear-gradient(90deg, #a6e3a1, #94e2d5)';
+      }
+    }
+  }
+}

package/src/harness/nwjs-graphical-test-harness.ts

@@ -0,0 +1,468 @@
+import * as fs from 'fs';
+import * as os from 'os';
+import * as path from 'path';
+import { HarnessConfigLoader } from '../config/harness-config-loader';
+import { installJestGlobals, TestRunner } from '../core/test-runner';
+import { NwjsHarnessConfig, TestProgressEvent } from '../types/test-runner-types';
+import { GraphicalOverlayView } from './graphical-overlay-view';
+import { TestHttpServer } from './test-http-server';
+import { TestLogWriter } from './test-log-writer';
+import { WebviewTestController } from './webview-test-controller';
+
+export class NwjsGraphicalTestHarness {
+  private readonly config: NwjsHarnessConfig;
+  private readonly projectRootDir: string;
+  private readonly testSandboxDir: string;
+  private readonly testConfigDir: string;
+  private readonly logWriter: TestLogWriter;
+  private readonly overlayView: GraphicalOverlayView;
+  private httpServer: TestHttpServer | null = null;
+  private webviewController: WebviewTestController | null = null;
+  private initTimeoutTimer: ReturnType<typeof setTimeout> | null = null;
+  private globalTimeoutTimer: ReturnType<typeof setTimeout> | null = null;
+  private hasStartedExecution = false;
+  private hasFinished = false;
+
+  constructor(config: NwjsHarnessConfig = {}) {
+    this.config = config;
+    this.projectRootDir = HarnessConfigLoader.resolveProjectRoot(config.projectRootDir);
+
+    const sandboxPrefix = config.sandboxPrefix || 'nwjs-webview-test-';
+    this.testSandboxDir = fs.mkdtempSync(path.join(os.tmpdir(), sandboxPrefix));
+    this.testConfigDir = path.join(this.testSandboxDir, 'os-config');
+    fs.mkdirSync(this.testConfigDir, { recursive: true });
+
+    const defaultLogPath = path.join(
+      this.projectRootDir,
+      'testrunner',
+      'test-results',
+      'desktop-tests.log'
+    );
+    const winAny = typeof window !== 'undefined' ? (window as any) : undefined;
+    const resolvedLogPath =
+      config.testLogPath ||
+      (winAny && winAny.__testLogPath) ||
+      process.env.NWJS_TEST_LOG_PATH ||
+      defaultLogPath;
+
+    const headerTitle =
+      config.logHeaderTitle ||
+      (config.title ? `${config.title} Log` : 'NW.js Desktop Client Test Harness Log');
+
+    this.logWriter = new TestLogWriter(resolvedLogPath, headerTitle);
+    this.overlayView = new GraphicalOverlayView({
+      title: config.title || '🧪 NW.js Live Webview Test Runner',
+      enableWebview: this.shouldEnableWebview()
+    });
+  }
+
+  private shouldEnableWebview(): boolean {
+    if (typeof this.config.enableWebview === 'boolean') {
+      return this.config.enableWebview;
+    }
+    if (this.config.liveWebviewTests && this.config.liveWebviewTests.length > 0) {
+      return true;
+    }
+    if (this.config.webviewEntryHtml) {
+      return true;
+    }
+    return false;
+  }
+
+  public getLogWriter(): TestLogWriter {
+    return this.logWriter;
+  }
+
+  public getProjectRootDir(): string {
+    return this.projectRootDir;
+  }
+
+  public getSandboxDir(): string {
+    return this.testSandboxDir;
+  }
+
+  public getConfigDir(): string {
+    return this.testConfigDir;
+  }
+
+  public async start(): Promise<{ exitCode: number; logText: string }> {
+    this.logWriter.writeProgressSnapshot('Tests interupted (Initializing test harness...)');
+
+    if (typeof document !== 'undefined') {
+      this.overlayView.mount(document);
+    }
+
+    this.setupWindowAndProcessLifecycle();
+
+    const initTimeoutMs = this.config.initTimeoutMs ?? 8000;
+    const globalTimeoutMs = this.config.globalTimeoutMs ?? 35000;
+
+    this.initTimeoutTimer = setTimeout(() => {
+      if (!this.hasStartedExecution && !this.hasFinished) {
+        this.logWriter.recordError(
+          'InitializationTimeout',
+          `Tests interupted: Test runner failed to initialize within ${initTimeoutMs}ms.`
+        );
+        this.finishAndExit();
+      }
+    }, initTimeoutMs);
+
+    this.globalTimeoutTimer = setTimeout(() => {
+      if (!this.hasFinished) {
+        this.logWriter.recordError(
+          'GlobalHarnessTimeout',
+          `Test runner harness timed out after ${globalTimeoutMs}ms.`
+        );
+        this.finishAndExit();
+      }
+    }, globalTimeoutMs);
+
+    try {
+      await this.prepareTestSuites();
+
+      if (this.shouldEnableWebview() && typeof document !== 'undefined') {
+        const webviewEl = this.overlayView.getWebviewElement();
+        if (!webviewEl) {
+          this.logWriter.recordError(
+            'WebviewElementMissing',
+            'Expected #client-webview element in DOM when enableWebview is true'
+          );
+          return await this.finishAndExit();
+        }
+
+        this.webviewController = new WebviewTestController(webviewEl, {
+          consoleErrorLevel: this.config.webviewConsoleErrorLevel ?? 2,
+          onError: (source, err) => this.logWriter.recordError(source, err),
+          onLoadAbort: () => {
+            this.finishAndExit();
+          }
+        });
+
+        return await new Promise<{ exitCode: number; logText: string }>((resolve) => {
+          this.webviewController!.attachEventListeners(() => {
+            if (this.hasStartedExecution) return;
+            this.markExecutionStarted();
+            this.executeAllTests()
+              .then((res) => resolve(res))
+              .catch((err) => {
+                this.logWriter.recordError('TestRunnerExecution', err);
+                this.finishAndExit().then(resolve);
+              });
+          });
+
+          this.startHttpServerAndNavigateWebview().catch((err) => {
+            this.logWriter.recordError('HttpServerStartError', err);
+            this.finishAndExit().then(resolve);
+          });
+        });
+      } else {
+        this.markExecutionStarted();
+        return await this.executeAllTests();
+      }
+    } catch (err) {
+      this.logWriter.recordError('TopLevelHarnessError', err);
+      return await this.finishAndExit();
+    }
+  }
+
+  private markExecutionStarted(): void {
+    this.hasStartedExecution = true;
+    if (this.initTimeoutTimer) {
+      clearTimeout(this.initTimeoutTimer);
+      this.initTimeoutTimer = null;
+    }
+    if (typeof window !== 'undefined') {
+      const winAny = window as any;
+      winAny.__harnessInitialized = true;
+      if (winAny.__initWatchdogTimer) {
+        clearTimeout(winAny.__initWatchdogTimer);
+      }
+    }
+  }
+
+  private setupWindowAndProcessLifecycle(): void {
+    try {
+      const nwGlobal = typeof (globalThis as any).nw !== 'undefined' ? (globalThis as any).nw : undefined;
+      if (nwGlobal && nwGlobal.Window && typeof nwGlobal.Window.get === 'function') {
+        const win = nwGlobal.Window.get();
+        win.on('close', () => {
+          if (!this.hasFinished) {
+            const m = this.logWriter.getMetrics();
+            this.logWriter.writeProgressSnapshot(
+              `Tests interupted (Closed by user at ${m.passedCount + m.failedCount} of ${m.totalTests})`
+            );
+          }
+          try {
+            win.close(true);
+          } catch (_e) {}
+          process.exit(1);
+        });
+      }
+    } catch (_e) {}
+
+    if (typeof window !== 'undefined') {
+      window.onerror = (message, _source, _lineno, _colno, error) => {
+        this.logWriter.recordError('HostWindowOnError', error || message);
+        this.finishAndExit();
+      };
+
+      window.addEventListener('unhandledrejection', (e: PromiseRejectionEvent) => {
+        this.logWriter.recordError('HostUnhandledRejection', e.reason);
+        this.finishAndExit();
+      });
+    }
+  }
+
+  private async startHttpServerAndNavigateWebview(): Promise<void> {
+    const entryHtml = this.config.webviewEntryHtml || 'index.html';
+    this.httpServer = new TestHttpServer({
+      projectRootDir: this.projectRootDir,
+      defaultEntryFile: entryHtml,
+      ignore404Paths: this.config.ignore404Paths,
+      routeHandler: this.config.httpRouteHandler,
+      onHttp404: (reqPath, resolvedFilePath) => {
+        this.logWriter.recordError(
+          'Http404Error',
+          `HTTP 404 Not Found: ${reqPath} (resolved: ${resolvedFilePath})`
+        );
+      }
+    });
+
+    const port = await this.httpServer.start();
+    const queryParams = new URLSearchParams();
+    if (this.config.injectSandboxQueryParams !== false) {
+      queryParams.set('projectRoot', this.testSandboxDir);
+      queryParams.set('configDir', this.testConfigDir);
+    }
+    if (this.config.webviewQueryParams) {
+      for (const [k, v] of Object.entries(this.config.webviewQueryParams)) {
+        queryParams.set(k, v);
+      }
+    }
+
+    const cleanEntry = entryHtml.startsWith('/') ? entryHtml.slice(1) : entryHtml;
+    const qs = queryParams.toString();
+    const targetUrl = `http://127.0.0.1:${port}/${cleanEntry}${qs ? `?${qs}` : ''}`;
+    this.webviewController?.navigate(targetUrl);
+  }
+
+  private async prepareTestSuites(): Promise<void> {
+    installJestGlobals(globalThis);
+    if (typeof window !== 'undefined') {
+      installJestGlobals(window);
+    }
+
+    const runner = TestRunner.getInstance();
+    runner.reset();
+
+    const context = {
+      projectRootDir: this.projectRootDir,
+      sandboxDir: this.testSandboxDir,
+      configDir: this.testConfigDir
+    };
+
+    if (this.config.registerSuites) {
+      await this.config.registerSuites(runner, context);
+    }
+
+    const shouldLoadFiles =
+      (this.config.testFiles && this.config.testFiles.length > 0) || !this.config.registerSuites;
+
+    if (shouldLoadFiles) {
+      const files = HarnessConfigLoader.resolveTestFiles(
+        this.projectRootDir,
+        this.config.testFiles
+      );
+      for (const filePath of files) {
+        try {
+          delete require.cache[require.resolve(filePath)];
+        } catch (_e) {}
+        const mod = require(filePath);
+        if (typeof mod === 'function') {
+          await mod(runner, context);
+        } else if (mod && typeof mod === 'object') {
+          for (const [exportName, exportVal] of Object.entries(mod)) {
+            if (
+              typeof exportVal === 'function' &&
+              (exportName === 'registerSuites' ||
+                exportName === 'registerTestSuites' ||
+                (/^register.*Suites$/i.test(exportName)))
+            ) {
+              await (exportVal as any)(runner, context);
+            }
+          }
+        }
+      }
+    }
+  }
+
+  private async executeAllTests(): Promise<{ exitCode: number; logText: string }> {
+    try {
+      const runner = TestRunner.getInstance();
+      const liveTests = this.config.liveWebviewTests || [];
+      const unitCount = runner.totalCasesCount;
+      const totalTests = unitCount + liveTests.length;
+
+      this.logWriter.setTotalTests(totalTests);
+      this.overlayView.updateMetrics(0, totalTests, 0, 0);
+      this.overlayView.setStatus(`Running ${totalTests} tests...`);
+      this.logWriter.writeProgressSnapshot(
+        `Tests interupted (Running unit suites: 0 of ${totalTests})`
+      );
+
+      if (this.webviewController && this.shouldEnableWebview()) {
+        const screenLoaded = await this.webviewController.waitForScreenLoad(
+          this.config.screenLoadOptions
+        );
+        if (!screenLoaded) {
+          this.logWriter.recordError(
+            'WebviewScreenTimeout',
+            'Client screen inside webview failed readiness check within timeout.'
+          );
+        }
+      }
+
+      if (unitCount > 0) {
+        const jestSummary = await runner.runAll({
+          maxDurationMs: this.config.unitSuiteTimeoutMs ?? 15000,
+          defaultTestTimeoutMs: this.config.defaultTestTimeoutMs ?? 2000,
+          filter: this.config.testFilter,
+          onProgress: (ev: TestProgressEvent) => {
+            if (ev.type === 'test_start') {
+              this.overlayView.setStatus(`Running: ${ev.suiteName} > ${ev.testName}`);
+            } else if (ev.type === 'test_complete') {
+              this.logWriter.setCounts(ev.passedCount, ev.failedCount);
+              this.overlayView.updateMetrics(
+                ev.completedCount,
+                totalTests,
+                ev.passedCount,
+                ev.failedCount
+              );
+              this.logWriter.writeProgressSnapshot(
+                `Tests interupted (Running unit suites: ${ev.completedCount} of ${totalTests})`
+              );
+            }
+          }
+        });
+
+        this.logWriter.setCounts(jestSummary.passed, jestSummary.failed);
+        this.overlayView.updateMetrics(
+          jestSummary.passed + jestSummary.failed,
+          totalTests,
+          jestSummary.passed,
+          jestSummary.failed
+        );
+        this.logWriter.writeProgressSnapshot(
+          `Tests interupted (Completed unit suites: ${jestSummary.passed + jestSummary.failed} of ${totalTests})`
+        );
+
+        if (jestSummary.failures && jestSummary.failures.length > 0) {
+          for (const f of jestSummary.failures) {
+            this.logWriter.recordError(
+              `JestSuite[${f.suiteName}]`,
+              `${f.testName} -> ${f.error?.message || f.error}`
+            );
+          }
+        }
+      }
+
+      if (this.webviewController && liveTests.length > 0) {
+        const totalLive = liveTests.length;
+        for (let i = 0; i < totalLive; i++) {
+          const spec = liveTests[i];
+          const completedSoFar = unitCount + i + 1;
+          this.overlayView.setStatus(`Running [${i + 1}/${totalLive}]: ${spec.name}`);
+          this.logWriter.writeProgressSnapshot(
+            `Tests interupted (Running live test [${i + 1}/${totalLive}]: ${spec.id})`
+          );
+
+          const res = await this.webviewController.executeWebviewTest(
+            spec.code,
+            spec.timeoutMs ?? 4000
+          );
+          if (res.ok) {
+            this.logWriter.incrementPassed(1);
+          } else {
+            this.logWriter.incrementFailed(1);
+            const errs =
+              res.errors && res.errors.length > 0
+                ? res.errors
+                : [res.error || 'Unknown webview test error'];
+            for (const err of errs) {
+              this.logWriter.recordError(spec.id, err);
+            }
+          }
+
+          const m = this.logWriter.getMetrics();
+          this.overlayView.updateMetrics(completedSoFar, totalTests, m.passedCount, m.failedCount);
+        }
+      }
+
+      const finalMetrics = this.logWriter.getMetrics();
+      this.overlayView.setStatus('All tests completed!');
+      this.overlayView.updateMetrics(
+        totalTests,
+        totalTests,
+        finalMetrics.passedCount,
+        finalMetrics.failedCount
+      );
+    } catch (err) {
+      this.logWriter.recordError('TestRunnerExecution', err);
+    }
+
+    return await this.finishAndExit();
+  }
+
+  public async finishAndExit(): Promise<{ exitCode: number; logText: string }> {
+    if (this.hasFinished) {
+      return this.logWriter.writeFinalSummary();
+    }
+    this.hasFinished = true;
+
+    if (typeof window !== 'undefined') {
+      (window as any).__harnessCompleted = true;
+      if ((window as any).__initWatchdogTimer) {
+        clearTimeout((window as any).__initWatchdogTimer);
+      }
+    }
+
+    if (this.initTimeoutTimer) {
+      clearTimeout(this.initTimeoutTimer);
+      this.initTimeoutTimer = null;
+    }
+    if (this.globalTimeoutTimer) {
+      clearTimeout(this.globalTimeoutTimer);
+      this.globalTimeoutTimer = null;
+    }
+
+    if (this.httpServer) {
+      await this.httpServer.stop();
+      this.httpServer = null;
+    }
+
+    try {
+      if (this.testSandboxDir && fs.existsSync(this.testSandboxDir)) {
+        fs.rmSync(this.testSandboxDir, { recursive: true, force: true });
+      }
+    } catch (_e) {}
+
+    const result = this.logWriter.writeFinalSummary();
+    console.log(`Test runner finished with exit code ${result.exitCode}`);
+
+    const autoExit = this.config.autoExit ?? true;
+    const keepOpen = this.config.keepOpen ?? false;
+    if (autoExit && !keepOpen) {
+      process.exit(result.exitCode);
+    }
+
+    return result;
+  }
+}
+
+export async function runNwjsTestHarness(
+  config?: NwjsHarnessConfig
+): Promise<{ exitCode: number; logText: string }> {
+  const effectiveConfig = config || HarnessConfigLoader.loadConfig();
+  const harness = new NwjsGraphicalTestHarness(effectiveConfig);
+  return harness.start();
+}