Merge branch 'feat/add-react-native-support' of https://github.com/bi…

…tvavo/faro-web-sdk into feat/add-react-native-support # Conflicts: # packages/react-native-tracing/package.json
bitvavo · Dec 21, 2024 · b366bc4 · b366bc4
2 parents 6745ef6 + 90358b9
commit b366bc4
Show file tree

Hide file tree

Showing 20 changed files with 45 additions and 29 deletions.
diff --git a/packages/core/package.json b/packages/core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@grafana/faro-core",
-  "version": "1.12.2",
+  "version": "1.12.3",
   "description": "Core package of Faro.",
   "keywords": [
     "observability",

diff --git a/packages/core/src/transports/batchExecutor.ts b/packages/core/src/transports/batchExecutor.ts
@@ -27,11 +27,13 @@ export class BatchExecutor {
 
     // Send batched/buffered data when user navigates to new page, switches or closes the tab, minimizes or closes the browser.
     // If on mobile, it also sends data if user switches from the browser to a different app.
-    document.addEventListener('visibilitychange', () => {
-      if (document.visibilityState === 'hidden') {
-        this.flush();
-      }
-    });
+    if (!options?.ignoreBrowserApi) {
+      document?.addEventListener('visibilitychange', () => {
+        if (document.visibilityState === 'hidden') {
+          this.flush();
+        }
+      });
+    }
   }
 
   addItem(item: TransportItem): void {

diff --git a/packages/core/src/transports/initialize.ts b/packages/core/src/transports/initialize.ts
@@ -145,6 +145,7 @@ export function initializeTransports(
     batchExecutor = new BatchExecutor(batchedSend, {
       sendTimeout: config.batching.sendTimeout,
       itemLimit: config.batching.itemLimit,
+      ignoreBrowserApi: config.batching.ignoreBrowserApi,
       paused,
     });
   }

diff --git a/packages/core/src/transports/types.ts b/packages/core/src/transports/types.ts
@@ -58,4 +58,6 @@ export interface BatchExecutorOptions {
   // Buffer "sendLimit" is the number of signals before sending the payload
   readonly itemLimit?: number;
   readonly paused?: boolean;
+
+  readonly ignoreBrowserApi?: boolean;
 }
diff --git a/packages/react-native-sdk/rollup.config.js b/packages/react-native-sdk/rollup.config.js
@@ -1,3 +1,3 @@
 const { getRollupConfigBase } = require('../../rollup.config.base.js');
 
-module.exports = getRollupConfigBase('webSdk');
+module.exports = getRollupConfigBase('rnSdk');
diff --git a/packages/react-native-sdk/src/transports/fetch/transport.ts b/packages/react-native-sdk/src/transports/fetch/transport.ts
@@ -23,7 +23,7 @@ const TOO_MANY_REQUESTS = 429;
 const ACCEPTED = 202;
 
 export class FetchTransport extends BaseTransport {
-  readonly name = '@grafana/faro-web-sdk:transport-fetch';
+  readonly name = '@grafana/faro-react-native-sdk:transport-fetch';
   readonly version = VERSION;
 
   promiseBuffer: PromiseBuffer<Response | void>;

diff --git a/packages/react-native-sdk/tsconfig.cjs.json b/packages/react-native-sdk/tsconfig.cjs.json
@@ -4,7 +4,7 @@
     "declarationDir": "./dist/types",
     "outDir": "./dist/cjs",
     "rootDir": "./src",
-    "tsBuildInfoFile": "../../.cache/tsc/webSdk.cjs.tsbuildinfo"
+    "tsBuildInfoFile": "../../.cache/tsc/rnSdk.cjs.tsbuildinfo"
   },
   "include": ["./src"],
   "exclude": ["**/*.test.ts"],

diff --git a/packages/react-native-sdk/tsconfig.esm.json b/packages/react-native-sdk/tsconfig.esm.json
@@ -4,7 +4,7 @@
     "declarationDir": "./dist/types",
     "outDir": "./dist/esm",
     "rootDir": "./src",
-    "tsBuildInfoFile": "../../.cache/tsc/webSdk.esm.tsbuildinfo"
+    "tsBuildInfoFile": "../../.cache/tsc/rnSdk.esm.tsbuildinfo"
   },
   "include": ["./src"],
   "exclude": ["**/*.test.ts"],

diff --git a/packages/react-native-sdk/tsconfig.spec.json b/packages/react-native-sdk/tsconfig.spec.json
@@ -4,7 +4,7 @@
     "declarationDir": "./dist/types",
     "outDir": "./dist/spec",
     "rootDir": "..",
-    "tsBuildInfoFile": "../../.cache/tsc/webSdk.spec.tsbuildinfo"
+    "tsBuildInfoFile": "../../.cache/tsc/rnSdk.spec.tsbuildinfo"
   },
   "include": ["./src"],
   "references": [{ "path": "../core/tsconfig.spec.json" }]

diff --git a/packages/react-native-tracing/package.json b/packages/react-native-tracing/package.json
@@ -68,5 +68,8 @@
   },
   "publishConfig": {
     "access": "public"
+  },
+  "peerDependencies": {
+    "@grafana/react-native-sdk": "^1.12.2"
   }
 }
diff --git a/packages/react-native-tracing/rollup.config.js b/packages/react-native-tracing/rollup.config.js
@@ -1,3 +1,3 @@
 const { getRollupConfigBase } = require('../../rollup.config.base.js');
 
-module.exports = getRollupConfigBase('webTracing');
+module.exports = getRollupConfigBase('rnTracing');
diff --git a/packages/react-native-tracing/src/faroTraceExporter.utils.ts b/packages/react-native-tracing/src/faroTraceExporter.utils.ts
@@ -2,7 +2,7 @@ import type { SpanContext } from '@opentelemetry/api';
 import { ESpanKind, IResourceSpans } from '@opentelemetry/otlp-transformer';
 
 import { faro, unknownString } from '@grafana/faro-core';
-import type { EventAttributes as FaroEventAttributes } from '@grafana/faro-web-sdk';
+import type { EventAttributes as FaroEventAttributes } from '@grafana/react-native-sdk';
 
 export function sendFaroEvents(resourceSpans: IResourceSpans[] = []) {
   for (const resourceSpan of resourceSpans) {

diff --git a/packages/react-native-tracing/src/instrumentation.ts b/packages/react-native-tracing/src/instrumentation.ts
@@ -2,11 +2,11 @@ import {context, trace} from '@opentelemetry/api';
 import {W3CTraceContextPropagator} from '@opentelemetry/core';
 import {registerInstrumentations} from '@opentelemetry/instrumentation';
 import {Resource, ResourceAttributes} from '@opentelemetry/resources';
-import {BatchSpanProcessor, StackContextManager, WebTracerProvider} from '@opentelemetry/sdk-trace-web';
+import {BatchSpanProcessor,  WebTracerProvider} from '@opentelemetry/sdk-trace-web';
 import {ATTR_SERVICE_NAME, ATTR_SERVICE_VERSION,} from '@opentelemetry/semantic-conventions';
 
 
-import {BaseInstrumentation, Transport, VERSION} from '@grafana/faro-web-sdk';
+import {BaseInstrumentation, Transport, VERSION} from '@grafana/react-native-sdk';
 
 import {FaroTraceExporter} from './faroTraceExporter';
 import {getDefaultOTELInstrumentations} from './getDefaultOTELInstrumentations';
@@ -19,7 +19,7 @@ import type {TracingInstrumentationOptions} from './types';
 // taking app name from it
 
 export class TracingInstrumentation extends BaseInstrumentation {
-  name = '@grafana/faro-web-tracing';
+  name = '@grafana/faro-react-native-tracing';
   version = VERSION;
 
   static SCHEDULED_BATCH_DELAY_MS = 1000;
@@ -69,7 +69,6 @@ export class TracingInstrumentation extends BaseInstrumentation {
 
     provider.register({
       propagator: options.propagator ?? new W3CTraceContextPropagator(),
-      contextManager: options.contextManager ?? new StackContextManager(),
     });
 
     const { propagateTraceHeaderCorsUrls, fetchInstrumentationOptions, xhrInstrumentationOptions } =

diff --git a/packages/react-native-tracing/src/sampler.ts b/packages/react-native-tracing/src/sampler.ts
@@ -1,6 +1,6 @@
 import { SamplingDecision } from '@opentelemetry/sdk-trace-web';
 
-import type { MetaSession } from '@grafana/faro-web-sdk';
+import type { MetaSession } from '@grafana/react-native-sdk';
 
 export function getSamplingDecision(sessionMeta: MetaSession = {}): SamplingDecision {
   const isSessionSampled = sessionMeta.attributes?.['isSampled'] === 'true';

diff --git a/packages/react-native-tracing/src/sessionSpanProcessor.ts b/packages/react-native-tracing/src/sessionSpanProcessor.ts
@@ -1,10 +1,7 @@
 import type { Context } from '@opentelemetry/api';
 import type { ReadableSpan, Span, SpanProcessor } from '@opentelemetry/sdk-trace-web';
-// False positive. Package can be resolved.
-// eslint-disable-next-line import/no-unresolved
-import { ATTR_SESSION_ID } from '@opentelemetry/semantic-conventions/incubating';
 
-import type { Metas } from '@grafana/faro-web-sdk';
+import type { Metas } from '@grafana/react-native-sdk';
 
 export class FaroSessionSpanProcessor implements SpanProcessor {
   constructor(
@@ -20,7 +17,7 @@ export class FaroSessionSpanProcessor implements SpanProcessor {
     const session = this.metas.value.session;
 
     if (session?.id) {
-      span.attributes[ATTR_SESSION_ID] = session.id;
+      span.attributes["session.id"] = session.id;
       /**
        * @deprecated will be removed in the future and has been replaced by ATTR_SESSION_ID (session.id)
        */

diff --git a/packages/react-native-tracing/src/types.ts b/packages/react-native-tracing/src/types.ts
@@ -6,7 +6,7 @@ import type { ResourceAttributes } from '@opentelemetry/resources';
 import type { SpanProcessor } from '@opentelemetry/sdk-trace-web';
 
 import type { Patterns } from '@grafana/faro-core';
-import type { API } from '@grafana/faro-web-sdk';
+import type { API } from '@grafana/react-native-sdk';
 
 // type got remove by with experimental/v0.52.0 and is replaced by the following type:
 // See: https://github.com/open-telemetry/opentelemetry-js/releases/tag/experimental%2Fv0.52.0

diff --git a/packages/react-native-tracing/tsconfig.cjs.json b/packages/react-native-tracing/tsconfig.cjs.json
@@ -4,9 +4,9 @@
     "declarationDir": "./dist/types",
     "outDir": "./dist/cjs",
     "rootDir": "./src",
-    "tsBuildInfoFile": "../../.cache/tsc/webTracing.cjs.tsbuildinfo"
+    "tsBuildInfoFile": "../../.cache/tsc/rnTracing.cjs.tsbuildinfo"
   },
   "include": ["./src"],
   "exclude": ["**/*.test.ts"],
-  "references": [{ "path": "../core/tsconfig.cjs.json" }, { "path": "../web-sdk/tsconfig.cjs.json" }]
+  "references": [{ "path": "../core/tsconfig.cjs.json" }, { "path": "../react-native-sdk/tsconfig.cjs.json" }]
 }
diff --git a/packages/react-native-tracing/tsconfig.esm.json b/packages/react-native-tracing/tsconfig.esm.json
@@ -4,9 +4,9 @@
     "declarationDir": "./dist/types",
     "outDir": "./dist/esm",
     "rootDir": "./src",
-    "tsBuildInfoFile": "../../.cache/tsc/webTracing.esm.tsbuildinfo"
+    "tsBuildInfoFile": "../../.cache/tsc/rnTracing.esm.tsbuildinfo"
   },
   "include": ["./src"],
   "exclude": ["**/*.test.ts"],
-  "references": [{ "path": "../core/tsconfig.esm.json" }, { "path": "../web-sdk/tsconfig.esm.json" }]
+  "references": [{ "path": "../core/tsconfig.esm.json" }, { "path": "../react-native-sdk/tsconfig.esm.json" }]
 }
diff --git a/packages/react-native-tracing/tsconfig.spec.json b/packages/react-native-tracing/tsconfig.spec.json
@@ -4,7 +4,7 @@
     "declarationDir": "./dist/types",
     "outDir": "./dist/spec",
     "rootDir": "..",
-    "tsBuildInfoFile": "../../.cache/tsc/webTracing.spec.tsbuildinfo"
+    "tsBuildInfoFile": "../../.cache/tsc/rnTracing.spec.tsbuildinfo"
   },
   "include": ["./src"],
   "references": [{ "path": "../core/tsconfig.spec.json" }]

diff --git a/rollup.config.base.js b/rollup.config.base.js
@@ -28,6 +28,18 @@ const modules = {
     globalName: 'GrafanaFaroWebTracing',
     externals: ['webSdk'],
   },
+  rnSdk: {
+    name: '@grafana/react-native-sdk',
+    bundleName: 'react-native-sdk',
+    globalName: 'GrafanaFaroReactNativeSdk',
+    externals: [],
+  },
+  rnTracing: {
+    name: '@grafana/react-native-tracing',
+    bundleName: 'react-native-tracing',
+    globalName: 'GrafanaFaroReactNativeTracing',
+    externals: ['rnSdk'],
+  },
   transportOtlpHttp: {
     name: '@grafana/faro-transport-otlp-http',
     bundleName: 'faro-transport-otlp-http',