feat(autocapture): exclude amp-block class from autocapture

packages/plugin-autocapture-browser/README.md

@@ -87,3 +87,25 @@ amplitude.add(plugin);
 ```typescript
 amplitude.init('API_KEY');
 ```
+
+## Privacy and Exclusions
+
+The autocapture plugin automatically excludes certain elements to respect user privacy and session replay configurations:
+
+### Automatic Exclusions
+
+- **Elements with `amp-block` class**: Elements marked with the `amp-block` CSS class are automatically excluded from autocapture tracking. This class is used by Amplitude's session replay functionality to block elements for privacy reasons.
+
+```html
+<!-- This button will NOT be tracked by autocapture -->
+<button class="amp-block">Sensitive Action</button>
+
+<!-- This button will be tracked (if other conditions are met) -->
+<button>Regular Action</button>
+```
+
+- **Hidden and password inputs**: Elements with `type="hidden"` or `type="password"` are automatically excluded.
+
+### Note
+
+The `amp-block` exclusion takes precedence over all other configurations, including custom `shouldTrackEventResolver` functions, to ensure privacy controls are respected.

packages/plugin-autocapture-browser/src/helpers.ts

@@ -29,6 +29,12 @@ export const createShouldTrackEvent = (
       return false;
     }
 
+    // Exclude elements with amp-block class (used by session replay for privacy)
+    // This check takes precedence over custom resolvers for privacy/security reasons
+    if (element.classList.contains('amp-block')) {
+      return false;
+    }
+
     if (shouldTrackEventResolver) {
       return shouldTrackEventResolver(actionType, element);
     }

packages/plugin-autocapture-browser/test/helpers.test.ts

@@ -711,5 +711,50 @@ describe('autocapture-plugin helpers', () => {
 
       expect(shouldTrackEvent('click', element)).toEqual(true);
     });
+
+    test('should exclude elements with amp-block class', () => {
+      const element = document.createElement('button');
+      element.textContent = 'Click me';
+      element.classList.add('amp-block');
+
+      const shouldTrackEvent = createShouldTrackEvent(
+        {
+          // No URL restrictions for this test
+        },
+        ['button'],
+      );
+
+      expect(shouldTrackEvent('click', element)).toEqual(false);
+    });
+
+    test('should allow tracking elements without amp-block class', () => {
+      const element = document.createElement('button');
+      element.textContent = 'Click me';
+      element.classList.add('other-class');
+
+      const shouldTrackEvent = createShouldTrackEvent(
+        {
+          // No URL restrictions for this test
+        },
+        ['button'],
+      );
+
+      expect(shouldTrackEvent('click', element)).toEqual(true);
+    });
+
+    test('should exclude elements with amp-block class even when custom shouldTrackEventResolver would allow it', () => {
+      const element = document.createElement('button');
+      element.textContent = 'Click me';
+      element.classList.add('amp-block');
+
+      const shouldTrackEvent = createShouldTrackEvent(
+        {
+          shouldTrackEventResolver: () => true, // Custom resolver that would allow tracking
+        },
+        ['button'],
+      );
+
+      expect(shouldTrackEvent('click', element)).toEqual(false);
+    });
   });
 });