test(replay): Add test for ignoring file inputs for dead clicks (#14227)

getsentry · Nov 19, 2024 · 4ffc81a · 4ffc81a
1 parent 11fdb3c
commit 4ffc81a
Show file tree

Hide file tree

Showing 2 changed files with 43 additions and 1 deletion.
diff --git a/dev-packages/browser-integration-tests/suites/replay/slowClick/ignore/test.ts b/dev-packages/browser-integration-tests/suites/replay/slowClick/ignore/test.ts
@@ -86,3 +86,44 @@ sentryTest('click is ignored on div', async ({ getLocalTestUrl, page }) => {
     },
   ]);
 });
+
+sentryTest('click is ignored on input file by default', async ({ getLocalTestUrl, page }) => {
+  if (shouldSkipReplayTest()) {
+    sentryTest.skip();
+  }
+
+  const url = await getLocalTestUrl({ testDir: __dirname });
+
+  await Promise.all([waitForReplayRequest(page, 0), page.goto(url)]);
+
+  const [req1] = await Promise.all([
+    waitForReplayRequest(page, (event, res) => {
+      const { breadcrumbs } = getCustomRecordingEvents(res);
+
+      return breadcrumbs.some(breadcrumb => breadcrumb.category === 'ui.click');
+    }),
+    page.locator('#inputFile').click(),
+  ]);
+
+  const { breadcrumbs } = getCustomRecordingEvents(req1);
+
+  expect(breadcrumbs).toEqual([
+    {
+      category: 'ui.click',
+      data: {
+        node: {
+          attributes: {
+            id: 'inputFile',
+          },
+          id: expect.any(Number),
+          tagName: 'input',
+          textContent: '',
+        },
+        nodeId: expect.any(Number),
+      },
+      message: 'body > input#inputFile[type="file"]',
+      timestamp: expect.any(Number),
+      type: 'default',
+    },
+  ]);
+});
diff --git a/dev-packages/browser-integration-tests/suites/replay/slowClick/template.html b/dev-packages/browser-integration-tests/suites/replay/slowClick/template.html
@@ -1,4 +1,4 @@
-<!DOCTYPE html>
+<!doctype html>
 <html>
   <head>
     <meta charset="utf-8" />
@@ -27,6 +27,7 @@
     <input type="button" id="inputButton" value="Input button" />
     <input type="submit" id="inputSubmit" value="Input submit" />
     <input type="text" id="inputText" />
+    <input type="file" id="inputFile" />
 
     <h1 id="h1">Heading</h1>