Merge branch 'main' into rz/feat/screenshot-strategy-option

Author: romtsn

CHANGELOG.md

@@ -10,6 +10,7 @@
 
 ### Features
 
+- Adds GraphQL integration ([#5299](https://github.com/getsentry/sentry-react-native/pull/5299))
 - Add new _experimental_ Canvas Capture Strategy for Session Replay ([#5301](https://github.com/getsentry/sentry-react-native/pull/5301))
   - A new screenshot capture strategy that uses Android's Canvas API for more accurate and reliable text and image masking
   - Any .drawText() or .drawBitmap() calls are replaced by rectangles, ensuring no text or images are present in the resulting output
@@ -27,7 +28,6 @@
     });
     ```
 
-
 ### Dependencies
 
 - Bump Bundler Plugins from v4.4.0 to v4.5.0 ([#5283](https://github.com/getsentry/sentry-react-native/pull/5283))

packages/core/src/js/integrations/exports.ts

@@ -25,6 +25,7 @@ export { timeToDisplayIntegration } from '../tracing/integrations/timeToDisplayI
 export { breadcrumbsIntegration } from './breadcrumbs';
 export { primitiveTagIntegration } from './primitiveTagIntegration';
 export { logEnricherIntegration } from './logEnricherIntegration';
+export { graphqlIntegration } from './graphql';
 
 export {
   browserApiErrorsIntegration,

packages/core/src/js/integrations/graphql.ts

@@ -0,0 +1,14 @@
+import { graphqlClientIntegration as browserGraphqlClientIntegration } from '@sentry/browser';
+import type { Integration } from '@sentry/core';
+
+interface GraphQLReactNativeIntegrationOptions {
+  endpoints: Array<string | RegExp>;
+}
+
+/**
+ * This integration ensures that GraphQL requests made in the React Native apps
+ * have their GraphQL-specific data captured and attached to spans and breadcrumbs.
+ */
+export function graphqlIntegration(options: GraphQLReactNativeIntegrationOptions): Integration {
+  return browserGraphqlClientIntegration({ endpoints: options.endpoints });
+}

packages/core/test/integrations/graphql.test.ts

@@ -0,0 +1,30 @@
+import { graphqlClientIntegration as browserGraphqlClientIntegration } from '@sentry/browser';
+import { graphqlIntegration } from '../../src/js';
+
+jest.mock('@sentry/browser', () => ({
+  graphqlClientIntegration: jest.fn(() => ({ name: 'GraphQL' })),
+}));
+
+describe('GraphQL Integration', () => {
+  afterEach(() => {
+    jest.resetAllMocks();
+  });
+
+  it('passes React Native options to browserGraphqlClientIntegration', () => {
+    const result = graphqlIntegration({ endpoints: ['test'] });
+
+    expect(browserGraphqlClientIntegration).toHaveBeenCalledWith({
+      endpoints: ['test'],
+    });
+    expect(result).toBeDefined();
+  });
+
+  it('handles RegExp patterns', () => {
+    const pattern = /graphql/;
+    graphqlIntegration({ endpoints: [pattern] });
+
+    expect(browserGraphqlClientIntegration).toHaveBeenCalledWith({
+      endpoints: [pattern],
+    });
+  });
+});