tests/e2e: remove invalid characters from snapshot filenames

Added additional characters to replacement regex for generating
snapshot filenames and updated the existing snapshots.

Fixes golang/go#48544

Change-Id: I416ea1df3db2cb66cfd6cf1db2238ee42d90577c
Reviewed-on: https://go-review.googlesource.com/c/pkgsite/+/351275
Trust: Jamal Carvalho <[email protected]>
Run-TryBot: Jamal Carvalho <[email protected]>
TryBot-Result: kokoro <[email protected]>
Reviewed-by: Jonathan Amsterdam <[email protected]>

tests/e2e/helpers/unit.page.ts

@@ -26,3 +26,14 @@ export async function prepare(page: Page): Promise<void> {
   ]);
   await page.evaluate(() => new Promise(r => setTimeout(r, 500)));
 }
+
+/**
+ * snapshotId generates a snapshot identifier replacing characters that are not
+ * allowed in filenames within go modules.
+ * @param env 'desktop' or 'mobile'
+ * @param path a pkg.go.dev url path
+ * @returns a snapshot idenifier
+ */
+export function snapshotId(env: 'desktop' | 'mobile', path: string): string {
+  return `unit-${env}-${path.replace(/[*<>?`'|/\\:]/g, '-')}`;
+}

tests/e2e/unit.desktop.test.ts

@@ -29,7 +29,9 @@ for (const tc of testcases) {
     await page.goto(`${tc.path}`);
     await unit.prepare(page);
     const image = await page.screenshot();
-    expect(image).toMatchImageSnapshot({ customSnapshotIdentifier: snapshotId(tc.path) });
+    expect(image).toMatchImageSnapshot({
+      customSnapshotIdentifier: unit.snapshotId('desktop', tc.path),
+    });
   });
 
   // Snapshot additional unit page sections.
@@ -39,7 +41,9 @@ for (const tc of testcases) {
       await page.goto(path);
       await unit.prepare(page);
       const image = await page.screenshot();
-      expect(image).toMatchImageSnapshot({ customSnapshotIdentifier: snapshotId(path) });
+      expect(image).toMatchImageSnapshot({
+        customSnapshotIdentifier: unit.snapshotId('desktop', path),
+      });
     });
   }
 
@@ -52,15 +56,13 @@ for (const tc of testcases) {
       await page.goto(path);
       await unit.prepare(page);
       const image = await page.screenshot();
-      expect(image).toMatchImageSnapshot({ customSnapshotIdentifier: snapshotId(path) });
+      expect(image).toMatchImageSnapshot({
+        customSnapshotIdentifier: unit.snapshotId('desktop', path),
+      });
     });
   }
 }
 
 test('no page errors', () => {
   expect(pageErrors).toHaveLength(0);
 });
-
-function snapshotId(path: string): string {
-  return 'unit-desktop-' + path.replace(/\//g, '-');
-}

tests/e2e/unit.mobile.test.ts

@@ -30,7 +30,9 @@ for (const tc of testcases) {
     await page.goto(`${tc.path}`);
     await unit.prepare(page);
     const image = await page.screenshot();
-    expect(image).toMatchImageSnapshot({ customSnapshotIdentifier: snapshotId(tc.path) });
+    expect(image).toMatchImageSnapshot({
+      customSnapshotIdentifier: unit.snapshotId('mobile', tc.path),
+    });
   });
 
   // Snapshot additional unit page sections.
@@ -40,7 +42,9 @@ for (const tc of testcases) {
       await page.goto(path);
       await unit.prepare(page);
       const image = await page.screenshot();
-      expect(image).toMatchImageSnapshot({ customSnapshotIdentifier: snapshotId(path) });
+      expect(image).toMatchImageSnapshot({
+        customSnapshotIdentifier: unit.snapshotId('mobile', path),
+      });
     });
   }
 
@@ -53,15 +57,13 @@ for (const tc of testcases) {
       await page.goto(path);
       await unit.prepare(page);
       const image = await page.screenshot();
-      expect(image).toMatchImageSnapshot({ customSnapshotIdentifier: snapshotId(path) });
+      expect(image).toMatchImageSnapshot({
+        customSnapshotIdentifier: unit.snapshotId('mobile', path),
+      });
     });
   }
 }
 
 test('no page errors', () => {
   expect(pageErrors).toHaveLength(0);
 });
-
-function snapshotId(path: string): string {
-  return 'unit-mobile-' + path.replace(/\//g, '-');
-}