chore: disable navigating off trace snapshot on hrefs (#21005)

microsoft · Feb 18, 2023 · a22eaf8 · a22eaf8
1 parent 55694a7
commit a22eaf8
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 1 deletion.
diff --git a/packages/trace-viewer/src/snapshotRenderer.ts b/packages/trace-viewer/src/snapshotRenderer.ts
@@ -67,9 +67,16 @@ export class SnapshotRenderer {
           builder.push('<', n[0]);
           // Never set relative URLs as <iframe src> - they start fetching frames immediately.
           const isFrame = n[0] === 'IFRAME' || n[0] === 'FRAME';
+          const isAnchor = n[0] === 'A';
           for (const [attr, value] of Object.entries(n[1] || {})) {
             const attrName = isFrame && attr.toLowerCase() === 'src' ? '__playwright_src__' : attr;
-            const attrValue = attr.toLowerCase() === 'href' || attr.toLowerCase() === 'src' ? rewriteURLForCustomProtocol(value) : value;
+            let attrValue = value;
+            if (attr.toLowerCase() === 'href' || attr.toLowerCase() === 'src') {
+              if (isAnchor)
+                attrValue = 'link://' + value;
+              else
+                attrValue = rewriteURLForCustomProtocol(value);
+            }
             builder.push(' ', attrName, '="', escapeAttribute(attrValue as string), '"');
           }
           builder.push('>');

diff --git a/tests/library/snapshotter.spec.ts b/tests/library/snapshotter.spec.ts
@@ -244,6 +244,12 @@ it.describe('snapshots', () => {
     // Second snapshot should be just a copy of the first one.
     expect(snapshot2.html).toEqual([[1, 13]]);
   });
+
+  it('should not navigate on anchor clicks', async ({ page, toImpl, snapshotter }) => {
+    await page.setContent('<a href="https://example.com">example.com</a>');
+    const snapshot = await snapshotter.captureSnapshot(toImpl(page), 'snapshot');
+    expect(distillSnapshot(snapshot)).toBe('<A href="link://https://example.com">example.com</A>');
+  });
 });
 
 function distillSnapshot(snapshot, distillTarget = true) {