Make SnapshotTester work in Node

Bug: 451502260
Change-Id: I55af7429084fa7a9e772b6231b3ccfcc14c23710
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/7044330
Commit-Queue: Alex Rudenko <[email protected]>
Reviewed-by: Simon Zünd <[email protected]>

Author: OrKoN

front_end/testing/SnapshotTester.ts

@@ -28,10 +28,10 @@ function assertSnapshotContent(actual: string, expected: string): void {
  *
  * Note: karma.conf.ts implements the server logic (see snapshotTesterFactory).
  */
-export class SnapshotTester {
+class BaseSnapshotTester {
   static #updateMode: boolean|null = null;
 
-  #snapshotPath: string;
+  protected snapshotPath: string;
   #expected = new Map<string, string>();
   #actual = new Map<string, string>();
   #anyFailures = false;
@@ -41,27 +41,18 @@ export class SnapshotTester {
     // out/Default/gen/third_party/devtools-frontend/src/front_end/testing/SnapshotTester.test.js?8ee4f2b123e221040a4aa075a28d0e5b41d3d3ed
     // ->
     // front_end/testing/SnapshotTester.snapshot.txt
-    this.#snapshotPath =
+    this.snapshotPath =
         meta.url.substring(meta.url.lastIndexOf('front_end')).replace('.test.js', '.snapshot.txt').split('?')[0];
   }
 
   async load() {
-    if (SnapshotTester.#updateMode === null) {
-      SnapshotTester.#updateMode = await this.#checkIfUpdateMode();
+    if (BaseSnapshotTester.#updateMode === null) {
+      BaseSnapshotTester.#updateMode = await this.checkIfUpdateMode();
     }
-
-    const url = new URL('/snapshot', import.meta.url);
-    url.searchParams.set('snapshotPath', this.#snapshotPath);
-    const response = await fetch(url);
-    if (response.status === 404) {
-      console.warn(`Snapshot file not found: ${this.#snapshotPath}. Will create it for you.`);
-      return;
+    const content = await this.loadSnapshot(this.snapshotPath);
+    if (content) {
+      this.#parseSnapshotFileContent(content);
     }
-    if (response.status !== 200) {
-      throw new Error('failed to load snapshot');
-    }
-
-    this.#parseSnapshotFileContent(await response.text());
   }
 
   assert(context: Mocha.Context, actual: string) {
@@ -81,7 +72,7 @@ export class SnapshotTester {
     const expected = this.#expected.get(title);
     if (expected === undefined) {
       this.#newTests = true;
-      if (SnapshotTester.#updateMode) {
+      if (BaseSnapshotTester.#updateMode) {
         return;
       }
 
@@ -93,22 +84,12 @@ export class SnapshotTester {
     const isDifferent = actual !== expected;
     if (isDifferent) {
       this.#anyFailures = true;
-      if (!SnapshotTester.#updateMode) {
+      if (!BaseSnapshotTester.#updateMode) {
         assertSnapshotContent(actual, expected);
       }
     }
   }
 
-  async #postUpdate(): Promise<void> {
-    const url = new URL('/update-snapshot', import.meta.url);
-    url.searchParams.set('snapshotPath', this.#snapshotPath);
-    const content = this.#serializeSnapshotFileContent();
-    const response = await fetch(url, {method: 'POST', body: content});
-    if (response.status !== 200) {
-      throw new Error(`Unable to update snapshot ${url}`);
-    }
-  }
-
   async finish() {
     let didAnyTestNotRun = false;
     for (const title of this.#expected.keys()) {
@@ -124,8 +105,8 @@ export class SnapshotTester {
     }
 
     // If the update flag is on, post any and all changes (failures, new tests, removals).
-    if (SnapshotTester.#updateMode) {
-      await this.#postUpdate();
+    if (BaseSnapshotTester.#updateMode) {
+      await this.postUpdate();
       return;
     }
 
@@ -137,7 +118,20 @@ export class SnapshotTester {
     }
   }
 
-  #serializeSnapshotFileContent(): string {
+  #parseSnapshotFileContent(content: string): void {
+    const sections = content.split('=== end content').map(s => s.trim()).filter(Boolean);
+    for (const section of sections) {
+      const [titleField, contentField, ...contentLines] = section.split('\n');
+      const title = titleField.replace('Title:', '').trim();
+      if (contentField !== 'Content:') {
+        throw new Error('unexpected snapshot file');
+      }
+      const content = contentLines.join('\n').trim();
+      this.#expected.set(title, content);
+    }
+  }
+
+  protected serializeSnapshotFileContent(): string {
     if (!this.#actual.size) {
       return '';
     }
@@ -153,22 +147,81 @@ export class SnapshotTester {
     return lines.join('\n').trim() + '\n';
   }
 
-  #parseSnapshotFileContent(content: string): void {
-    const sections = content.split('=== end content').map(s => s.trim()).filter(Boolean);
-    for (const section of sections) {
-      const [titleField, contentField, ...contentLines] = section.split('\n');
-      const title = titleField.replace('Title:', '').trim();
-      if (contentField !== 'Content:') {
-        throw new Error('unexpected snapshot file');
-      }
-      const content = contentLines.join('\n').trim();
-      this.#expected.set(title, content);
-    }
+  protected async checkIfUpdateMode(): Promise<boolean> {
+    return false;
+  }
+
+  protected async postUpdate(): Promise<void> {
+    throw new Error(`Not implemented`);
   }
 
-  async #checkIfUpdateMode(): Promise<boolean> {
+  protected async loadSnapshot(_snapshotPath: string): Promise<string|undefined> {
+    throw new Error('not implemented');
+  }
+}
+
+class WebSnapshotTester extends BaseSnapshotTester {
+  protected override async checkIfUpdateMode(): Promise<boolean> {
     const response = await fetch('/snapshot-update-mode');
     const data = await response.json();
     return data.updateMode === true;
   }
+
+  protected override async postUpdate(): Promise<void> {
+    const url = new URL('/update-snapshot', import.meta.url);
+    url.searchParams.set('snapshotPath', this.snapshotPath);
+    const content = this.serializeSnapshotFileContent();
+    const response = await fetch(url, {method: 'POST', body: content});
+    if (response.status !== 200) {
+      throw new Error(`Unable to update snapshot ${url}`);
+    }
+  }
+
+  protected override async loadSnapshot(snapshotPath: string): Promise<string|undefined> {
+    const url = new URL('/snapshot', import.meta.url);
+    url.searchParams.set('snapshotPath', snapshotPath);
+    const response = await fetch(url);
+    if (response.status === 404) {
+      console.warn(`Snapshot file not found: ${snapshotPath}. Will create it for you.`);
+      return;
+    }
+    if (response.status !== 200) {
+      throw new Error('failed to load snapshot');
+    }
+    return await response.text();
+  }
+}
+
+class NodeSnapshotTester extends BaseSnapshotTester {
+  protected override async checkIfUpdateMode(): Promise<boolean> {
+    // cannot update in node mode yet.
+    return false;
+  }
+
+  protected override async postUpdate(): Promise<void> {
+    const content = this.serializeSnapshotFileContent();
+    // @ts-expect-error no node types here.
+    const fs = await import('node:fs/promises');
+    await fs.writeFile(await this.#getSnapshotPath(this.snapshotPath), content);
+  }
+
+  protected override async loadSnapshot(snapshotPath: string): Promise<string|undefined> {
+    // @ts-expect-error no node types here.
+    const fs = await import('node:fs/promises');
+    return await fs.readFile(await this.#getSnapshotPath(snapshotPath), 'utf-8');
+  }
+
+  async #getSnapshotPath(snapshotPath: string): Promise<string> {
+    // @ts-expect-error no node types here.
+    const path = await import('node:path');
+    // @ts-expect-error no ESM types here.
+    const SOURCE_ROOT = path.join(import.meta.dirname, '..', '..');
+    return path.join(SOURCE_ROOT, snapshotPath);
+  }
 }
+
+export type SnapshotTester = NodeSnapshotTester|WebSnapshotTester;
+
+const SnapshotTesterValue = (typeof window === 'undefined') ? NodeSnapshotTester : WebSnapshotTester;
+
+export {SnapshotTesterValue as SnapshotTester};