Add new react native tracing options based on JS sdk

CHANGELOG.md

@@ -1,5 +1,11 @@
 # Changelog
 
+## Unreleased
+
+### Breaking changes
+
+- New ReactNativeTracingOptions idleTimeoutMs and finalTimeoutMs replacing idleTimeout and maxTransactionDuration respectively ([#2481](https://github.com/getsentry/sentry-react-native/pull/2481))
+
 ## 5.0.0-alpha.3
 
 - Latest changes from 4.3.x

src/js/tracing/reactnativetracing.ts

@@ -30,23 +30,34 @@ import {
 
 export interface ReactNativeTracingOptions
   extends RequestInstrumentationOptions {
+  /**
+   * @deprecated Replaced by idleTimeoutMs
+   */
+  idleTimeout: number;
+
+  /**
+   * @deprecated Replaced by maxTransactionDurationMs
+   */
+  maxTransactionDuration: number;
+
   /**
    * The time to wait in ms until the transaction will be finished. The transaction will use the end timestamp of
    * the last finished span as the endtime for the transaction.
    * Time is in ms.
    *
    * Default: 1000
    */
-  idleTimeout: number;
+  idleTimeoutMs: number;
 
   /**
-   * The maximum duration of a transaction before it will be marked as "deadline_exceeded".
+   * The maximum duration (transaction duration + idle timeout) of a transaction
+   * before it will be marked as "deadline_exceeded".
    * If you never want to mark a transaction set it to 0.
-   * Time is in seconds.
+   * Time is in ms.
    *
-   * Default: 600
+   * Default: 600000
    */
-  maxTransactionDuration: number;
+  finalTimeoutMs: number;
 
   /**
    * The routing instrumentation to be used with the tracing integration.
@@ -95,6 +106,8 @@ const defaultReactNativeTracingOptions: ReactNativeTracingOptions = {
   ...defaultRequestInstrumentationOptions,
   idleTimeout: 1000,
   maxTransactionDuration: 600,
+  idleTimeoutMs: 1000,
+  finalTimeoutMs: 600000,
   ignoreEmptyBackNavigationTransactions: true,
   beforeNavigate: (context) => context,
   enableAppStartTracking: true,
@@ -132,6 +145,17 @@ export class ReactNativeTracing implements Integration {
     this.options = {
       ...defaultReactNativeTracingOptions,
       ...options,
+      finalTimeoutMs: options.finalTimeoutMs
+        // eslint-disable-next-line deprecation/deprecation
+        ?? (typeof options.maxTransactionDuration === 'number'
+              // eslint-disable-next-line deprecation/deprecation
+              ? options.maxTransactionDuration * 1000
+              : undefined)
+        ?? defaultReactNativeTracingOptions.finalTimeoutMs,
+      idleTimeoutMs: options.idleTimeoutMs
+        // eslint-disable-next-line deprecation/deprecation
+        ?? options.idleTimeout
+        ?? defaultReactNativeTracingOptions.idleTimeoutMs,
     };
   }
 
@@ -349,7 +373,7 @@ export class ReactNativeTracing implements Integration {
     }
 
     // eslint-disable-next-line @typescript-eslint/unbound-method
-    const { idleTimeout, maxTransactionDuration } = this.options;
+    const { idleTimeoutMs, finalTimeoutMs } = this.options;
 
     const expandedContext = {
       ...context,
@@ -360,8 +384,8 @@ export class ReactNativeTracing implements Integration {
     const idleTransaction = startIdleTransaction(
       hub as Hub,
       expandedContext,
-      idleTimeout,
-      maxTransactionDuration,
+      idleTimeoutMs,
+      finalTimeoutMs,
       true
     );
 
@@ -392,7 +416,7 @@ export class ReactNativeTracing implements Integration {
     idleTransaction.registerBeforeFinishCallback(
       (transaction, endTimestamp) => {
         adjustTransactionDuration(
-          maxTransactionDuration,
+          finalTimeoutMs,
           transaction,
           endTimestamp
         );

src/js/tracing/utils.ts

@@ -29,25 +29,17 @@ export const MARGIN_OF_ERROR_SECONDS = 0.05;
 
 const timeOriginMilliseconds = Date.now();
 
-/**
- * Converts from seconds to milliseconds
- * @param time time in seconds
- */
-function secToMs(time: number): number {
-  return time * 1000;
-}
-
 /**
  *
  */
 export function adjustTransactionDuration(
-  maxDuration: number, // in seconds
+  maxDurationMs: number,
   transaction: IdleTransaction,
   endTimestamp: number
 ): void {
   const diff = endTimestamp - transaction.startTimestamp;
   const isOutdatedTransaction =
-    endTimestamp && (diff > secToMs(maxDuration) || diff < 0);
+    endTimestamp && (diff > maxDurationMs || diff < 0);
   if (isOutdatedTransaction) {
     transaction.setStatus('deadline_exceeded');
     transaction.setTag('maxTransactionDurationExceeded', 'true');

test/tracing/reactnativetracing.test.ts

@@ -597,4 +597,52 @@ describe('ReactNativeTracing', () => {
       });
     });
   });
+  describe('Handling deprecated options', () => {
+    test('finalTimeoutMs overrides maxTransactionDuration', () => {
+      const tracing = new ReactNativeTracing({
+        finalTimeoutMs: 123000,
+        maxTransactionDuration: 456,
+      });
+      expect(tracing.options.finalTimeoutMs).toBe(123000);
+      // eslint-disable-next-line deprecation/deprecation
+      expect(tracing.options.maxTransactionDuration).toBe(456);
+    });
+    test('maxTransactionDuration translates to finalTimeoutMs', () => {
+      const tracing = new ReactNativeTracing({
+        maxTransactionDuration: 123,
+      });
+      expect(tracing.options.finalTimeoutMs).toBe(123000);
+      // eslint-disable-next-line deprecation/deprecation
+      expect(tracing.options.maxTransactionDuration).toBe(123);
+    });
+    test('if none maxTransactionDuration and finalTimeoutMs is specified use default', () => {
+      const tracing = new ReactNativeTracing({});
+      expect(tracing.options.finalTimeoutMs).toBe(600000);
+      // eslint-disable-next-line deprecation/deprecation
+      expect(tracing.options.maxTransactionDuration).toBe(600);
+    });
+    test('idleTimeoutMs overrides idleTimeout', () => {
+      const tracing = new ReactNativeTracing({
+        idleTimeoutMs: 123,
+        idleTimeout: 456,
+      });
+      expect(tracing.options.idleTimeoutMs).toBe(123);
+      // eslint-disable-next-line deprecation/deprecation
+      expect(tracing.options.idleTimeout).toBe(456);
+    });
+    test('idleTimeout translates to idleTimeoutMs', () => {
+      const tracing = new ReactNativeTracing({
+        idleTimeout: 123,
+      });
+      expect(tracing.options.idleTimeoutMs).toBe(123);
+      // eslint-disable-next-line deprecation/deprecation
+      expect(tracing.options.idleTimeout).toBe(123);
+    });
+    test('if none idleTimeout and idleTimeoutMs is specified use default', () => {
+      const tracing = new ReactNativeTracing({});
+      expect(tracing.options.idleTimeoutMs).toBe(1000);
+      // eslint-disable-next-line deprecation/deprecation
+      expect(tracing.options.idleTimeout).toBe(1000);
+    });
+  });
 });