@dynatrace/react-native-plugin 2.331.1 → 2.335.1

package/README.md

@@ -13,6 +13,8 @@ If you want to start using this plugin and are not a Dynatrace customer yet, hea
   * User actions for onPress and onLongPress (Touchables, Buttons, Pickers, RefreshControl, Pressable)
   * User actions for class and functional components (lifecycle events such as render(), didMount() and didUpdate())
   * Reporting React Native errors
+  * Tracking navigation via `react.navigation.enabled`
+  * UI Interaction feature toggle via `react.userInteraction` (enable/disable user interaction capturing at runtime)
 * Manual instrumentation
   * Typescript bindings to add manual instrumentation
 * New React-Native architecture
@@ -26,23 +28,23 @@ If you want to start using this plugin and are not a Dynatrace customer yet, hea
   * Android Gradle plugin version 7.0+
   * Java 11
   * Kotlin 2.0.21 - see [Kotlin Compatibility Note](#kotlin-compatibility-note)
-  * Jetpack Compose 1.4 - 1.9 - see [Compose Compatibility Note](#compose-compatibility-note)
+  * Jetpack Compose 1.4 - 1.10 - see [Compose Compatibility Note](#compose-compatibility-note)
 * For iOS users: Minimum iOS 12
 * NodeJS 16.0.0+ since our dependencies require NodeJS 16.0.0
 
 ## Agent Versions
-This agent versions are configured in this plugin:
+These agent versions are configured in this plugin:
 
-* Android Agent: 8.331.1.1004
-* iOS Agent: 8.331.1.1008
+* Android Agent: 8.335.1.1001
+* iOS Agent: 8.335.1.1009
 
 ## Quick Setup
 
 1. [Install plugin](#1-install-the-plugin)
-2. [Register Dynatrace transformer and reporter](#2-register-the-dynatrace-transformer-and-reporter)
-3. [Setup configuration](#3-setup-dynatraceconfigjs)
-4. [Update Babel Configuration](#4-update-babel-configuration)
-5. [Build and run your app](#4-build-and-run-your-app)
+2. [Setup configuration](#2-setup-dynatraceconfigjs)
+3. [Register babel plugin](#3-register-our-babel-plugin-in-babelconfigjs)
+4. [Register jsx-runtime](#4-register-our-jsx-runtime-in-babelconfigjs)
+5. [Build and run your app](#5-build-and-run-your-app)
 
 ## Advanced topics
 * [Manual OneAgent Startup](#manual-oneagent-startup)
@@ -64,12 +66,14 @@ This agent versions are configured in this plugin:
   * [Set beacon headers](#setting-beacon-headers)
   * [Exclude Individual JSX Elements](#exclude-individual-jsx-elements)
 * [New RUM experience](#new-rum-experience)
+  * [User Interaction](#user-interaction)
   * [Send Event](#send-event)
   * [Send Session Property Event](#send-session-property-event)
   * [Event Modifier](#event-modifier)
   * [Send Exception Event](#send-exception-event)
   * [Send HTTP Request Event](#send-http-request-event)
   * [View Monitoring](#view-monitoring)
+  * [User Interaction](#user-interaction-1)
   * [React Native Symbolication](#react-native-symbolication)
 * [NPX Commands](#npx-commands)
   * [npx instrumentDynatrace](#npx-instrumentdynatrace)
@@ -89,6 +93,9 @@ This agent versions are configured in this plugin:
     * [Bundle Name and Version](#bundle-name-and-version)
     * [Navigation](#navigation)
     * [Source Map](#source-map)
+    * [User Interaction](#user-interaction-1)
+    * [Debugging our auto-instrumentation](#debugging-our-auto-instrumentation)
+    * [Using our legacy jscodeshift auto-instrumentation](#using-our-legacy-jscodeshift-auto-instrumentation)
   * [Android block](#android-block)
   * [iOS block](#ios-block)
   * [Lifecycle modes](#lifecycle)
@@ -121,9 +128,7 @@ This agent versions are configured in this plugin:
 > **Note**: If you are upgrading to React Native v0.70 (or newer) or using the @react-native-community/cli 9.x+ version, be aware that our automated script running before every start/run-android/run-ios command is no longer working. When your *dynatrace.config.js* changed be sure to execute `npx instrumentDynatrace` beforehand. 
 
 ## 1. Install the plugin
-1. Install the plugin by calling:
-    -  React Native v0.60 or newer : `npm install @dynatrace/react-native-plugin` 
-    -  React Native v0.59.x : `react-native install @dynatrace/react-native-plugin`. 
+1. Install the plugin by calling `npm install @dynatrace/react-native-plugin` 
 2. **iOS only :** If you use pods, you need to go into your `ios` directory and execute `pod install` to install the new Dynatrace dependency to your xCode project. 
   
 ### Troubleshooting
@@ -131,81 +136,34 @@ This agent versions are configured in this plugin:
 - Standalone Project: If you are using React Native standalone and embed it in your native project have a look [here](#configuration-of-standalone-react-native-project).
 - If for some reason (e.g. seperate native projects) `react-native link` doesn't work as expected, [manually add the iOS agent to your project](#manually-adding-ios-oneagent-to-a-project).
 
-## 2. Register the Dynatrace transformer and reporter
+## 2. Setup dynatrace.config.js
 
-The transformer will add modifications to your code during build. The reporter will notify us if you clear the cache of the metro bundler.
-
-Depending on your React Native version, you will need to use a different way to register the transformer. If you don't know the version, enter `react-native --version` in your terminal.
-
-The following configuration must be added. If you already have a babel transformer (babelTransformerPath) in place, you need to [use the upstreamTransformer property in dynatrace.config.js](#using-a-second-transformer-besides-the-dynatrace-transformer) to use a transformer besides our dynatrace transformer. 
-
-In your project's root directory, create or extend `metro.config.js` so that it contains the following configuration properties `transformer.babelTransformerPath` and `reporter`:
-
-#### For React Native v0.72.1 or newer
-
-```js
-const {getDefaultConfig, mergeConfig} = require('@react-native/metro-config');
-const defaultConfig = getDefaultConfig(__dirname);
-
-/**
- * Metro configuration
- * https://facebook.github.io/metro/docs/configuration
- *
- * @type {import('metro-config').MetroConfig}
- */
-const config = {
-  transformer: {
-    babelTransformerPath: require.resolve(
-      '@dynatrace/react-native-plugin/lib/dynatrace-transformer',
-    ),
-  },
-  reporter: require('@dynatrace/react-native-plugin/lib/dynatrace-reporter'),
-};
-
-module.exports = mergeConfig(defaultConfig, config);
-```
-
-#### For Expo
+> **Note**: If you are upgrading from a previous version of this plugin, you'll notice that the file format has changed. Your old configuration is still available in `dynatrace.config` and you have to copy your values to the new `dynatrace.config.js`.
 
-```js
-const {getDefaultConfig} = require('expo/metro-config');
-const config = getDefaultConfig(__dirname);
+Define a mobile app in Dynatrace and open the Mobile app instrumentation settings. In the settings you will see a `dynatrace.config.js` file which can be downloaded for React Native. Download and copy this file into the root folder of your application. If you are not sure you can always use `npx configDynatrace` to create a default configuration file. 
 
-config.transformer.babelTransformerPath = require.resolve(
-  '@dynatrace/react-native-plugin/lib/dynatrace-transformer',
-);
+> **Note**: Define the components that you want to see lifecycle instrumented ([example](#lifecycle)). This is important as you will only see Application startup and Touches out of the box.
 
-config.reporter = require('@dynatrace/react-native-plugin/lib/dynatrace-reporter');
+For more details about the configuration, see [Advanced topics](#structure-of-the-dynatracejs-file).
 
-module.exports = config;
-```
+## 3. Register our babel plugin in babel.config.js
 
-#### For React Native v0.59 or newer
+Add the Dynatrace babel plugin to your `babel.config.js`:
 
 ```js
 module.exports = {
-    transformer: {
-      babelTransformerPath: require.resolve(
-        '@dynatrace/react-native-plugin/lib/dynatrace-transformer'
-      )
-    },
-    reporter: require('@dynatrace/react-native-plugin/lib/dynatrace-reporter'),
+  ...
+  plugins: [..., '@dynatrace/react-native-plugin/instrumentation/BabelPluginDynatrace'],
 };
 ```
 
-## 3. Setup dynatrace.config.js
-
-> **Note**: If you are upgrading from a previous version of this plugin, you'll notice that the file format has changed. Your old configuration is still available in `dynatrace.config` and you have to copy your values to the new `dynatrace.config.js`.
-
-Define a mobile app in Dynatrace and open the Mobile app instrumentation settings. In the settings you will see a `dynatrace.config.js` file which can be downloaded for React Native. Download and copy this file into the root folder of your application. If you are not sure you can always use `npx configDynatrace` to create a default configuration file. 
+This plugin handles the auto-instrumentation of your React Native code at build time.
 
-> **Note**: Define the components that you want to see lifecycle instrumented ([example](#lifecycle)). This is important as you will only see Application startup and Touches out of the box.
-
-For more details about the configuration, see [Advanced topics](#structure-of-the-dynatracejs-file).
+> **Note**: We recently moved our auto-instrumentation from a custom metro transformer to a babel plugin. The code shown above is the new and recommended way to add our auto-instrumentation to your project by adding the babel plugin directly. However, our plugin is backwards compatible in a sense that we keep supporting auto-instrumentation via the Dynatrace transformer and reporter. In short, no configuration change is needed. If you continue using the Dynatrace transformer and reporter, we reroute the instrumentation logic to the babel plugin internally. 
 
-## 4. Update Babel Configuration
+## 4. Register our jsx-runtime in babel.config.js
 
-Depending on your version of Metro or Expo (if used), your babel configuration `babel.config.js` will need to be updated.
+Depending on your version of Metro or Expo (if used), you additionally need to add our jsx-runtime to your babel configuration `babel.config.js`.
 
 The changes have to be done in the following cases:
 
@@ -427,7 +385,7 @@ import { Dynatrace, DynatraceWebRequestTiming } from '@dynatrace/react-native-pl
 const action = Dynatrace.enterManualAction('API Data Fetch');
 const url = 'https://api.example.com/data';
 const tag = await action.getRequestTag(url);
-const timing = new DynatraceWebRequestTiming(url, tag);
+const timing = new DynatraceWebRequestTiming(tag, url);
 
 try {
   timing.startWebRequestTiming();
@@ -457,7 +415,7 @@ import { Dynatrace, DynatraceWebRequestTiming } from '@dynatrace/react-native-pl
 const action = Dynatrace.enterManualAction('API Data Upload');
 const url = 'https://api.example.com/upload';
 const tag = await action.getRequestTag(url);
-const timing = new DynatraceWebRequestTiming(url, tag);
+const timing = new DynatraceWebRequestTiming(tag, url);
 const requestData = JSON.stringify({ key: 'value' });
 
 try {
@@ -1012,6 +970,42 @@ Dynatrace.sendEvent(new EventData()
 Dynatrace.startView("UserProfileDetailed");
 ```
 
+### User Interaction
+
+User Interaction is an automatic instrumentation feature that captures touch and press events in your React Native application without requiring any manual API calls. When enabled, the plugin instruments your UI components at build time and sends structured interaction events to Dynatrace at runtime.
+
+To enable this feature, see the [User Interaction configuration](#user-interaction-1) section.
+
+#### Produced data
+
+Each captured interaction produces an event describing what the user touched and where. The event includes:
+
+- **Element name** — the resolved label of the touched element, derived from its visible text, accessibility label, component name, or test ID.
+- **Component type** — the type of the UI component that was touched (e.g. `Pressable`).
+- **Element path** — a stable path through the component tree that uniquely identifies the element (e.g. `App/View[1]/Pressable[1]`).
+- **Interaction type** — how the user interacted (e.g. `touch`).
+- **Position** — the screen coordinates where the touch occurred.
+
+In some cases, a **responder** is also included. The responder is the component that ultimately handled the user's touch — for example, a `Pressable` that received the press event. It carries the same name, component type, and path information as the touched element, and can differ when a touch is visually on a child element but handled by a parent.
+
+#### Example event
+
+```json
+{
+  "characteristics.has_user_interaction": true,
+  "ui_element.detected_name": "LoginButton",
+  "ui_element.components": ["Pressable"],
+  "ui_element.id": "App/View[1]/Pressable[1]",
+  "ui_element.name_origin": "component",
+  "interaction.type": "touch",
+  "positions": [{ "x": 120, "y": 460 }],
+  "ui_element.responder.detected_name": "Pressable",
+  "ui_element.responder.components": ["Pressable"],
+  "ui_element.responder.id": "App/View[1]/Pressable[1]",
+  "ui_element.responder.name_origin": "component"
+}
+```
+
 ### React Native Symbolication
 
 Dynatrace can automatically symbolicate JavaScript stack traces captured by the plugin using sourcemaps. This allows you to view human-readable file names, line numbers, and column information in your crash reports.
@@ -1031,13 +1025,6 @@ To generate a sourcemap:
 * Then run `npx react-native run-ios --mode Release`, or
 * Build for release in Xcode
 
-#### Accounting for Auto-Instrumentation
-
-Since the plugin auto-instruments your code, sourcemap line numbers may be slightly offset. To ensure accurate symbolication:
-
-* **Android**: Automatic patching is **enabled by default** and patches sourcemaps automatically at the end of every release build (see [Source Map](#source-map) configuration)
-* **iOS**: There is currently **no automation** available. You **must** execute [`npx lineOffsetDynatrace`](#npx-lineoffsetdynatrace) to patch your sourcemap files before uploading them to Dynatrace. Without this step, line numbers will be slightly off depending on instrumentation in iOS
-
 #### Uploading Sourcemaps
 
 Once generated and patched, upload your sourcemaps to Dynatrace. For detailed instructions, see the [symbol file management documentation](https://docs.dynatrace.com/docs/observe/digital-experience/mobile-applications/analyze-and-use/upload-and-manage-symbol-files).
@@ -1068,20 +1055,6 @@ npx configDynatrace [optional: config=...]
 
 * `config=C:\SpecialFolderForDynatrace\dynatrace.config.js`: If you have not got your config file in the root folder of the React Native project but somewhere else.
 
-## npx lineOffsetDynatrace
-
-Our auto-instrumentation modifies your source code during the build process, which causes line numbers in your sourcemaps to become slightly offset from the original source. This can result in incorrect line numbers when viewing crash reports or stack traces in Dynatrace.
-
-The `npx lineOffsetDynatrace` command patches your sourcemap file with offset information, allowing Dynatrace to accurately map instrumented line numbers back to the original source code. The patching process adds Dynatrace-specific metadata alongside the original sourcemap content without modifying any existing fields, ensuring your sourcemap continues to work as expected with all standard tooling.
-
-**Usage:**
-
-```
-npx lineOffsetDynatrace sourcemapPath=/path/to/your/sourcemap.map
-```
-
-* `sourcemapPath=/path/to/your/sourcemap.map`: **(Required)** The path to the sourcemap file that should be patched.
-
 ## Customizing paths for configuration
 
 > **Note:** This feature works directly on run-android, run-ios or start command only for React Native v0.60.1 or newer until v0.69.x.
@@ -1269,6 +1242,47 @@ react: {
 
 This activates the debug mode. You will get more console output during instrumentation and at runtime.
 
+
+#### User Interaction
+
+```js
+react: {
+  userInteraction: true // set it to true here if you want to enable UI interaction, default value is false
+}
+```
+
+Enables or disables the UI interaction (user interaction) feature.
+Set to false to disable capturing of user interactions (e.g., touch/click actions) produced by the React Native UI interaction instrumentation.
+
+##### What customers will observe after enabling UI Interaction
+
+After setting `react.userInteraction: true` and rebuilding with instrumentation, the expected flow is:
+
+1. Build-time instrumentation wraps supported UI elements and app root entrypoints.
+2. At runtime, touch/press interactions are captured and converted into UI interaction events.
+3. Events are processed by the plugin event pipeline and sent to Dynatrace.
+4. In Dynatrace, customers can analyze captured user interactions (for example, touch-driven behavior and related UI element context).
+
+Notes:
+
+- No extra UI needs to be added in customer screens for standard automatic capture.
+- If `react.debug` is enabled, additional debug output can appear during instrumentation/runtime.
+
+##### Runtime switching (config + remote configuration observer)
+
+UI Interaction can be controlled by two layers:
+
+1. **Build/config layer (`dynatrace.config.js`)**
+  - `react.userInteraction: true|false` controls whether the UI Interaction instrumentation feature is applied.
+
+2. **Runtime remote layer (`RuntimeConfigurationObserver`)**
+  - Runtime emission checks the remote flag `touch_interaction_enabled`.
+  - If remote flag is present, it is used as the source of truth.
+  - If remote flag is temporarily unavailable, the plugin falls back to the last known good remote value.
+  - If no remote value was received yet, runtime defaults to enabled behavior.
+
+In short: local config enables the feature path, while remote configuration can dynamically allow/deny event emission at runtime.
+
 #### Error Handler
 
 ```js
@@ -1338,33 +1352,32 @@ react: {
 }
 ```
 
-#### Source Map
+#### Debugging our auto-instrumentation
 
-This feature is enabled by default and patches sourcemap files so that any modifications made through Dynatrace will result in correct line numbers. If this feature is not enabled, line numbers of symbolicated stacktraces in Dynatrace might not match with your original source.
-
-The following is an example of how this feature can be configured in your `dynatrace.config.js` file:
+You can see the changes our auto-instrumentation is making to your code with this flag:
 
 ```js
 react: {
-  sourceMap: { 
-    enabled: true
-  }
+  debugBabelPlugin: true
 }
 ```
 
-> **Note:** This automatic patching only works for Android. For iOS, you need to manually call [lineOffsetDynatrace](#npx-lineoffsetdynatrace) after the creation of the sourcemap is finished or before uploading it to Dynatrace.
+The changes our auto-instrumentation is making now get dumped into the `node_modules/@dynatrace/react-native-plugin/build` folder when building the Javascript bundle. The `*.dtx` files show what your code looks like after only our auto-instrumentation was applied to your code. The `*.dtx.downstream` files show what your code looks like after both our auto-instrumentation and all other babel plugins were applied to your code.
 
-The automatic patching for Android can be customized using the `androidSourcemapLocation` property to specify a custom path to your sourcemap file, resolving from the `android/` directory since that is where the automation gets executed:
+> **Note:** This feature increases the time it takes to build the Javascript bundle. Only use it for debugging purposes. Deactivate it otherwise, especially when fast build times are important.
+
+#### Using our legacy jscodeshift auto-instrumentation
+
+We recently moved our auto-instrumentation to a babel plugin. In case you need to, you can still switch to the old jscodeshift auto-instrumentation with this flag:
 
 ```js
 react: {
-  sourceMap: { 
-    enabled: true,
-    androidSourcemapLocation: 'sourcemap.map'
-  }
+  useLegacyJscodeshift: true
 }
 ```
 
+> **Note:** When we moved our auto-instrumentation to a babel plugin, we removed documentation that was only relevant for the jscodeshift auto-instrumentation. Most notably, we removed documentation concerning registering a custom metro transformer and patching sourcemaps. If you use the `useLegacyJscodeshift` flag, please refer to the [legacy documentation (v2.333.1)](https://www.npmjs.com/package/@dynatrace/react-native-plugin/v/2.333.1) for details on custom metro transformers and sourcemap patching.
+
 ### Android block
 
 The Android block is a wrapper for the Android configuration you find in the WebUI (in the Mobile Application Settings). Copy the content into the following block:
@@ -1663,75 +1676,6 @@ module.exports = {
 };
 ```
 
-## Using a second transformer besides the dynatrace transformer
-
-If you want to register the Dynatrace transformer in your configuration and you already have a transformer in place, change the upstreaming transformer for the Dynatrace transformer.
-
-This can be done via a configuration value in the `dynatrace.config.js`. The following example shows how the configuration might look like for the popular `react-native-svg-transformer`. Be aware that the following example is targeting *React Native v0.72.1* or newer. Be aware if you are using a different second transformer, you need to change `react-native-svg-transformer/react-native` accordingly.
-
-#### dynatrace.config.js
-
-```js
-// The `...` only indicates that there are other values as well, but we've omitted them in this example.
-module.exports = {
-    react : {
-        upstreamTransformer: require.resolve('react-native-svg-transformer/react-native'),
-        // ...
-    },
-    // ...       
-};
-```
-
-#### metro.config.js for React Native v0.72.1 or newer
-```js
-const {getDefaultConfig, mergeConfig} = require('@react-native/metro-config');
-const defaultConfig = getDefaultConfig(__dirname);
-const {assetExts, sourceExts} = defaultConfig.resolver;
-
-/**
- * Metro configuration
- * https://facebook.github.io/metro/docs/configuration
- *
- * @type {import('metro-config').MetroConfig}
- */
-const config = {
-  transformer: {
-    babelTransformerPath: require.resolve(
-      '@dynatrace/react-native-plugin/lib/dynatrace-transformer',
-    ),
-  },
-  reporter: require('@dynatrace/react-native-plugin/lib/dynatrace-reporter'),
-  resolver: {
-    assetExts: assetExts.filter((ext) => ext !== 'svg'),
-    sourceExts: [...sourceExts, 'cjs', 'svg'],
-  },
-};
-
-module.exports = mergeConfig(defaultConfig, config);
-```
-
-#### metro.config.js for React Native v0.59 or newer
-
-```js
-const { getDefaultConfig } = require("metro-config");
-
-module.exports = (async () => {
-  const {
-    resolver: { sourceExts, assetExts }
-  } = await getDefaultConfig();
-  return {
-    transformer: {
-      babelTransformerPath: require.resolve('@dynatrace/react-native-plugin/lib/dynatrace-transformer')
-    },
-    reporter: require('@dynatrace/react-native-plugin/lib/dynatrace-reporter'),
-    resolver: {
-      assetExts: assetExts.filter((ext) => ext !== "svg"),
-      sourceExts: [...sourceExts, "cjs", "svg"]
-    }
-  };
-})();
-```
-
 ## Maven Central in top-level gradle file
 
 Because the Dynatrace Android agent now requires the MavenCentral repository, if either `jcenter()` or `mavenCentral()` is not added inside of **ALL** the repositories blocks via the [top-level build.gradle](https://dt-url.net/jm610pso), the build will fail. 
@@ -1825,7 +1769,7 @@ In summary, ensure your build fulfills our Kotlin 2.0.21 requirement while simul
 
 ## Compose Compatibility Note
 
-Our Android Agent currently supports **Jetpack Compose 1.4 - 1.9**. If you are using an incompatible version of Jetpack Compose, you may encounter the following error message during build:
+Our Android Agent currently supports **Jetpack Compose 1.4 - 1.10**. If you are using an incompatible version of Jetpack Compose, you may encounter the following error message during build:
 
 ```
 Could not resolve all dependencies for configuration ':app:debugCompileClasspath'.
@@ -1972,6 +1916,21 @@ If you are struggling with a problem, submit a support ticket to Dynatrace (supp
 <br/><br/>
 ## Changelog
 
+2.335.1
+* Updated Android (8.335.1.1001) & iOS Agent (8.335.1.1009)
+* Dynatrace Android configuration (`dynatrace.gradle`) is now written directly next to the `build.gradle` file instead of inside `node_modules`. Existing projects with the old path are migrated automatically.
+* Updated Android Gradle plugin configuration for Gradle 9 compatibility in `plugin-runtime.gradle`.
+* Moved auto-instrumentation from jscodeshift to a Babel plugin, improvements include:
+  * Significantly faster JS bundle builds
+  * Sourcemaps now natively account for our auto-instrumentation - no patching needed
+* Added instrumentation for `BorderlessButton` and `BaseButton` from `react-native-gesture-handler`.
+
+2.333.1
+* Jetpack Compose support range extended to 1.4 - 1.10 see [Compose Compatibility Note](#compose-compatibility-note)
+* Updated Android (8.333.1.1006) & iOS Agent (8.333.1.1005)
+* Added Configuration flag to enable/disable the [User Interaction feature](#user-interaction-1).
+* Added [User Interaction feature](#user-interaction) to collect UI interaction data such as touches, providing insights into user behavior
+
 2.331.1
 * Updated Android (8.331.1.1004) & iOS Agent (8.331.1.1008)
 

package/android/build.gradle

@@ -72,7 +72,7 @@ repositories {
 }
 
 dependencies {
-	implementation 'com.dynatrace.agent:agent-android:8.331.1.1004'
+	implementation 'com.dynatrace.agent:agent-android:8.335.1.1001'
     implementation "com.facebook.react:react-native:${safeExtGet('reactNative', '+')}"
 }
   

package/android/src/main/java/com/dynatrace/android/agent/DynatraceRNBridgeImpl.kt

@@ -75,6 +75,7 @@ class DynatraceRNBridgeImpl(
             }
 
             Dynatrace.startup(reactApplicationContext, builder.buildConfiguration())
+
             promise.resolve(true)
         }
     }
@@ -383,6 +384,9 @@ class DynatraceRNBridgeImpl(
                     )!!
                 )
             )
+            if (userPrivacyOptions.hasKey("_screenRecordOptedIn")) {
+                optionsBuilder.withScreenRecordOptedIn(userPrivacyOptions.getBoolean("_screenRecordOptedIn"))
+            }
             Dynatrace.applyUserPrivacyOptions(
                 optionsBuilder
                     .build()
@@ -396,6 +400,7 @@ class DynatraceRNBridgeImpl(
             val privacyMap = Arguments.createMap()
             privacyMap.putString("dataCollectionLevel", options.dataCollectionLevel.name)
             privacyMap.putBoolean("crashReportingOptedIn", options.isCrashReportingOptedIn)
+            privacyMap.putBoolean("screenRecordOptedIn", options.isScreenRecordOptedIn)
             promise.resolve(privacyMap)
         }
     }
@@ -446,4 +451,5 @@ class DynatraceRNBridgeImpl(
     private fun shouldWorkOnAndroid(platform: String?): Boolean {
         return platform == null || platform == PLATFORM_ANDROID || platform == ""
     }
-}
+
+}

package/android/src/main/java/com/dynatrace/android/agent/DynatraceUtils.kt

@@ -8,6 +8,7 @@ import com.facebook.react.bridge.ReadableType
 /**
  * @author matthias.hochrieser
  */
+ 
 internal object DynatraceUtils {
 
     private const val TAG = "DynatraceUtils"

package/android/src/new/java/com/dynatrace/android/agent/DynatraceRNBridge.kt

@@ -238,4 +238,5 @@ class DynatraceRNBridge(
     override fun stopViewInternal() {
         impl.stopViewInternal()
     }
+
 }

package/android/src/old/java/com/dynatrace/android/agent/DynatraceRNBridge.kt

@@ -271,4 +271,5 @@ class DynatraceRNBridge(
     fun stopViewInternal() {
         impl.stopViewInternal()
     }
-}
+
+}

package/files/plugin-runtime.gradle

@@ -1,19 +1,33 @@
-import org.gradle.nativeplatform.platform.internal.DefaultNativePlatform
+import org.gradle.process.ExecOperations
+import javax.inject.Inject
+
+abstract class RunLineOffsetTask extends DefaultTask {
+    @Internal
+    abstract DirectoryProperty getWorkingDirectory()
+
+    @Inject
+    abstract ExecOperations getExecOperations()
+
+    @TaskAction
+    void run() {
+        execOperations.exec {
+            workingDir workingDirectory.get().asFile
+            if (System.getProperty('os.name').toLowerCase().contains('windows')) {
+                commandLine 'cmd', '/c', 'npx', 'lineOffsetDynatrace'
+            } else {
+                commandLine 'npx', 'lineOffsetDynatrace'
+            }
+        }
+    }
+}
 
 android.applicationVariants.all { variant ->
     if (variant.buildType.name == "release") {
+        def lineOffsetTask = tasks.register("runLineOffset${variant.name.capitalize()}", RunLineOffsetTask) {
+            workingDirectory = layout.projectDirectory
+        }
         variant.mergeAssetsProvider.configure { task ->
-            task.doLast {
-                exec {
-                    workingDir rootDir
-                    if (DefaultNativePlatform.currentOperatingSystem.isWindows()) {
-                        // On windows, npx.cmd may not be a true binary executable and may need to be interpreted by a shell instead of executed direclty
-                        commandLine 'cmd', '/c', 'npx', 'lineOffsetDynatrace'
-                    } else {
-                        commandLine 'npx', 'lineOffsetDynatrace'
-                    }
-                }
-            }
+            task.dependsOn(lineOffsetTask)
         }
     }
-}
+}

package/files/plugin.gradle

@@ -1,4 +1,4 @@
 // TEMPLATE: plugin-gradle.template
 dependencies {
-	classpath 'com.dynatrace.tools.android:gradle-plugin:8.331.1.1004'
+	classpath 'com.dynatrace.tools.android:gradle-plugin:8.335.1.1001'
 }

package/instrumentation/BabelPluginDynatrace.js

@@ -0,0 +1 @@
+var _templateObject,_templateObject2,_templateObject3,_templateObject4,_templateObject5,_templateObject6,_interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault"),_taggedTemplateLiteral2=_interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));function _createForOfIteratorHelper(e,t){var n,r,a,i,o="undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(o)return a=!(r=!0),{s:function(){o=o.call(e)},n:function(){var e=o.next();return r=e.done,e},e:function(e){a=!0,n=e},f:function(){try{r||null==o.return||o.return()}finally{if(a)throw n}}};if(Array.isArray(e)||(o=_unsupportedIterableToArray(e))||t&&e&&"number"==typeof e.length)return o&&(e=o),i=0,{s:t=function(){},n:function(){return i>=e.length?{done:!0}:{done:!1,value:e[i++]}},e:function(e){throw e},f:t};throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function _unsupportedIterableToArray(e,t){var n;if(e)return"string"==typeof e?_arrayLikeToArray(e,t):"Map"===(n="Object"===(n={}.toString.call(e).slice(8,-1))&&e.constructor?e.constructor.name:n)||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?_arrayLikeToArray(e,t):void 0}function _arrayLikeToArray(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=Array(t);n<t;n++)r[n]=e[n];return r}Object.defineProperty(exports,"__esModule",{value:!0});var reactOptions,fspath=require("path"),fs=require("fs"),core_1=require("@babel/core"),generator_1=require("@babel/generator"),PathsConstants_1=require("../scripts/PathsConstants"),Config_1=require("../scripts/Config"),GetValuesFromPackage_1=require("../lib/core/util/GetValuesFromPackage"),Types_1=require("./model/Types"),INSTRUMENTATION_LIBS="@dynatrace/react-native-plugin/instrumentation/libs",hasJSX=function(e){var t=!1;return e.traverse({"JSXElement|JSXFragment":function(){t=!0}}),t},instrumentUserInteraction=function(e){e.traverse({"FunctionDeclaration|ObjectMethod":function(e){var e=e.node,t=core_1.types.isFunctionDeclaration(e)?e.id:e.key;core_1.types.isIdentifier(t,{name:"registerComponent"})&&(t="".concat(INSTRUMENTATION_LIBS,"/UserInteraction"),e.body.body.unshift(core_1.template.statement('componentProvider = require("'.concat(t,'").wrapProvider(componentProvider);'))()))}})},instrumentAppRegistry=function(e){e.traverse({"FunctionDeclaration|ObjectMethod":function(e){var e=e.node,t=core_1.types.isFunctionDeclaration(e)?e.id:e.key;core_1.types.isIdentifier(t,{name:"runApplication"})&&e.body.body.unshift(core_1.template.statement(_templateObject=_templateObject||(0,_taggedTemplateLiteral2.default)(['require("@dynatrace/react-native-plugin").ApplicationHandler.startup();']))())}})},instrumentExceptionsManager=function(e){var t,n=null!=(t=null==(t=null==reactOptions?void 0:reactOptions.errorHandler)?void 0:t.reportFatalErrorAsCrash)&&t,r=(null==reactOptions?void 0:reactOptions.autoStart)&&(null==(t=null==reactOptions?void 0:reactOptions.errorHandler)?void 0:t.enabled);e.traverse({FunctionDeclaration:function(e){var t;core_1.types.isIdentifier(e.node.id,{name:"handleException"})&&(t=core_1.template.statement(_templateObject2=_templateObject2||(0,_taggedTemplateLiteral2.default)(['\n                setTimeout(() => BODY, require("@dynatrace/react-native-plugin/lib/core/ErrorHandler")\n                    .reportErrorToDynatrace(e, isFatal, CRASH, AUTO));\n            ']))({BODY:core_1.types.cloneNode(e.node.body),CRASH:core_1.types.booleanLiteral(n),AUTO:core_1.types.booleanLiteral(!!r)}),e.node.body.body=[t])}})},instrumentCssInterop=function(e){e.traverse({CallExpression:function(e){core_1.types.isIdentifier(e.node.callee,{name:"require"})&&(e=e.node.arguments[0],core_1.types.isStringLiteral(e))&&("react/jsx-runtime"===e.value?e.value="@dynatrace/react-native-plugin/jsx-runtime":"react/jsx-dev-runtime"===e.value&&(e.value="@dynatrace/react-native-plugin/jsx-dev-runtime"))}})},instrumentNavigation=function(e){e.traverse({VariableDeclarator:function(e){var t;core_1.types.isIdentifier(e.node.id,{name:"getRootState"})&&(t=core_1.template.statement(_templateObject3=_templateObject3||(0,_taggedTemplateLiteral2.default)(["\n                require(PATH).monitorNavigation(getRootState);\n            "]))({PATH:core_1.types.stringLiteral("".concat(INSTRUMENTATION_LIBS,"/react-navigation/ReactNavigation"))}),e.parentPath.insertAfter(t))}})},instrumentReactCreateElement=function(e){var t=core_1.template.statement(_templateObject4=_templateObject4||(0,_taggedTemplateLiteral2.default)(["\n        require(PATH).instrumentCreateElement(module.exports);\n    "]))({PATH:core_1.types.stringLiteral("@dynatrace/react-native-plugin/instrumentation/jsx/ElementHelper")});e.pushContainer("body",t)},instrumentComponents=function(e,n){e.traverse({FunctionDeclaration:function(e){var t;hasJSX(e)&&(t=e.node,core_1.types.isIdentifier(t.id))&&null!=(e=e.getStatementParent())&&e.insertAfter(n(t.id.name,Types_1.Types.FunctionalComponent))},ClassDeclaration:function(e){var t;hasJSX(e)&&(t=e.node,core_1.types.isIdentifier(t.id))&&null!=(e=e.getStatementParent())&&e.insertAfter(n(t.id.name,Types_1.Types.ClassComponent))},"FunctionExpression|ArrowFunctionExpression":function(e){var t;hasJSX(e)&&(t=e.parent,void 0!==(t=core_1.types.isVariableDeclarator(t)&&core_1.types.isIdentifier(t.id)?t.id.name:core_1.types.isAssignmentExpression(t)&&core_1.types.isIdentifier(t.left)?t.left.name:void 0))&&null!=(e=e.getStatementParent())&&e.insertAfter(n(t,Types_1.Types.FunctionalComponent))}})},instrumentLifecycle=function(e){instrumentComponents(e,function(e,t){return core_1.template.statement(_templateObject5=_templateObject5||(0,_taggedTemplateLiteral2.default)(["NAME._dtInfo = { type: TYPE, name: 'NAME_STR' }"]))({NAME:core_1.types.identifier(e),TYPE:core_1.types.numericLiteral(t),NAME_STR:core_1.types.stringLiteral(e)})})},instrumentComponentNames=function(e){instrumentComponents(e,function(e){return core_1.template.statement(_templateObject6=_templateObject6||(0,_taggedTemplateLiteral2.default)(["NAME.dtName = 'NAME_STR'"]))({NAME:core_1.types.identifier(e),NAME_STR:core_1.types.stringLiteral(e)})})},instrumentInput=function(e){var l=new Map([["react-native",{proxy:"".concat(INSTRUMENTATION_LIBS,"/react-native/"),components:new Set(["TouchableHighlight","TouchableNativeFeedback","TouchableOpacity","TouchableWithoutFeedback","Button","RefreshControl","Text","Pressable","Switch"])}],["react-native-gesture-handler",{proxy:"".concat(INSTRUMENTATION_LIBS,"/community/gesture-handler/"),components:new Set(["TouchableHighlight","TouchableNativeFeedback","TouchableOpacity","TouchableWithoutFeedback","RectButton","BorderlessButton","BaseButton"])}],["@react-native-picker/picker",{proxy:"".concat(INSTRUMENTATION_LIBS,"/community/Picker"),components:new Set(["Picker","PickerIOS"])}]]);e.traverse({ImportDeclaration:function(e){if(void 0===e.node.processed){var t=e.node.source;if(l.has(t.value)){var r=l.get(t.value),n=e.node.specifiers,a=[],i=[];if(n.forEach(function(e,t){var n;core_1.types.isImportSpecifier(e)&&(n=core_1.types.isIdentifier(e.imported)?e.imported.name:e.imported.value,r.components.has(n)||(a.push(e),i.push(t)))}),a.length!==n.length){var o,s=_createForOfIteratorHelper(i.reverse());try{for(s.s();!(o=s.n()).done;){var c=o.value;n.splice(c,1)}}catch(e){s.e(e)}finally{s.f()}0<a.length&&((t=core_1.types.importDeclaration(a,core_1.types.stringLiteral(t.value))).processed=!0,e.insertBefore(t)),e.node.source=core_1.types.stringLiteral(r.proxy),e.scope.crawl()}}}},CallExpression:function(e){core_1.types.isIdentifier(e.node.callee,{name:"require"})&&(e=e.node.arguments[0],core_1.types.isStringLiteral(e))&&l.has(e.value)&&(e.value=l.get(e.value).proxy)}})},instrumentJsxNames=function(e){e.traverse({JSXOpeningElement:function(e){var t=e.node.name,t=core_1.types.isJSXIdentifier(t)?t.name:core_1.types.isJSXMemberExpression(t)?(0,generator_1.default)(t).code:void 0;t&&e.node.attributes.push(core_1.types.jsxAttribute(core_1.types.jsxIdentifier("dtName"),core_1.types.stringLiteral(t)))}})},instrumentConfigurationPreset=function(e){var t,n=(0,GetValuesFromPackage_1.getHostAppBundleInfo)(PathsConstants_1.default.getPackageJsonFile()),r={getLifecycleUpdate:reactOptions.lifecycle.includeUpdate,getLogLevel:reactOptions.debug?0:1,getBundleName:null!=(t=reactOptions.bundleName)?t:null==n?void 0:n.name,getBundleVersion:null!=(t=reactOptions.bundleVersion)?t:null==n?void 0:n.version,getActionNamePrivacy:reactOptions.input.actionNamePrivacy,isErrorHandlerEnabled:reactOptions.errorHandler.enabled,isReportFatalErrorAsCrash:reactOptions.errorHandler.reportFatalErrorAsCrash,isAutoStartupEnabled:reactOptions.autoStart};e.traverse({ClassMethod:function(e){var t;core_1.types.isIdentifier(e.node.key)&&void 0!==(t=r[e.node.key.name])&&(e=e.node.body.body[0],core_1.types.isReturnStatement(e))&&(e.argument=core_1.types.valueToNode(t))}})};exports.default=function(){return{visitor:{Program:function(e,t){reactOptions=(0,Config_1.readConfigDefault)().react;var n,r,a,i,o,s,c=t.filename;void 0!==c&&(a=function(){for(var e=arguments.length,t=new Array(e),n=0;n<e;n++)t[n]=arguments[n];return t.some(function(e){return c.includes(fspath.join("node_modules",e)+fspath.sep)})},s=function(){for(var e=arguments.length,t=new Array(e),n=0;n<e;n++)t[n]=arguments[n];return t.some(function(e){return c.endsWith(e)})},!(i="")===reactOptions.debugBabelPlugin&&(i=(0,generator_1.default)(e.node).code),a("@dynatrace")&&s("ConfigurationPreset.js")&&instrumentConfigurationPreset(e),a("react-native")&&s("AppRegistry.js","AppRegistryImpl.js")&&(reactOptions.autoStart&&instrumentAppRegistry(e),reactOptions.userInteraction)&&instrumentUserInteraction(e),a("react-native")&&s("ExceptionsManager.js")&&instrumentExceptionsManager(e),a("react-native-css-interop")&&s("jsx-runtime.js","jsx-dev-runtime.js")&&instrumentCssInterop(e),reactOptions.navigation.enabled&&a("@react-navigation")&&s("BaseNavigationContainer.js","BaseNavigationContainer.tsx")&&instrumentNavigation(e),a("react")&&s("index.js")&&instrumentReactCreateElement(e),null!=(n=null==(r=reactOptions.lifecycle)?void 0:r.instrument)&&n.call(r,c)&&(!c.includes("node_modules")||a("react-native")&&s("renderApplication.js"))&&hasJSX(e)&&instrumentLifecycle(e),null==(r=null==(n=reactOptions.input)?void 0:n.instrument)||!r.call(n,c)||c.includes("node_modules")&&!a("@react-navigation","react-native-drawer-layout")||instrumentInput(e),reactOptions.userInteraction&&!c.includes("node_modules")&&(instrumentJsxNames(e),instrumentComponentNames(e)),!0===reactOptions.debugBabelPlugin)&&(o=(0,generator_1.default)(e.node).code)!==i&&(s=fspath.join(PathsConstants_1.default.getBuildPath(),fspath.relative(PathsConstants_1.default.getApplicationPath(),c)+".dtx"),fs.mkdirSync(fspath.dirname(s),{recursive:!0}),fs.writeFileSync(s,o),t.set("fileDidChange",!0))}},post:function(e){var t;!0===reactOptions.debugBabelPlugin&&!0===this.get("fileDidChange")&&(t=(0,generator_1.default)(e.ast).code,e=fspath.join(PathsConstants_1.default.getBuildPath(),fspath.relative(PathsConstants_1.default.getApplicationPath(),e.opts.filename)+".dtx.downstream"),fs.mkdirSync(fspath.dirname(e),{recursive:!0}),fs.writeFileSync(e,t))}}};