This documentation describes the steps you need to take to successfully use the Dynatrace RUM for Mobile plugin in your mobile application to enable native and applicational monitoring on your Dynatrace dashboard.
Table of Contents
1. Pre-requirements
1.1 To use this plugin, you must have a Dynatrace account. If you don't have one, please contact Dynatrace or sign up for a free trial (terms and conditions may apply).
1.2. Install Dynatrace RUM for Mobile plugin (this plugin) on your OutSystems environment.
2. Configure your Dynatrace Environment
This section describes the steps you need to take in the Dynatrace Portal to create a hybrid application.
Please note that the following steps are based on Dynatrace’s documentation and may not reflect the most current version. For more information and an updated version, please refer to Dynatrace’s official documentation:
2.1. In Dynatrace, go to Mobile.
2.2. Select Create mobile app.
2.3. Enter a name for your application and select Create mobile app. The application settings page opens.
2.4. From the application settings, select Instrumentation wizard > Cordova, and then click Monitor the web view to create a web application.
2.5. Click the Download dynatrace.config.js button and save the file.
2.6 Go to Web and select the web application part of your mobile application.
2.7 In the web application details screen, click Edit.
2.8. From the application settings, select Capturing > Async web requests and SPAs and enable Capture XmlHttpRequest (XHR) and Capture fetch() requests. These may already be enabled by default.
2.9. From the application settings, select Injection > Setup.
2.10. In the Manual insertion tab, select Code snippet from the drop-down box.
2.11. Click Download and save the file.
2.12. Open the file downloaded in the previous step in a text or code editor of your choice, apply the following changes, and save it as a .js file:
a) If the HTML script doesn’t include a data-dtconfig attribute, skip this step. Otherwise, add the following line to the beginning of the file:
document.currentScript.setAttribute("data-dtconfig", <value of the data-dtconfig attribute of the script tag>);
b) Remove the HTML script tags (<script …> and </script>).
3. Add Dynatrace to your OutSystems application
This section describes the steps you need to take in the OutSystems Service Studio to reference and initialize the Dynatrace RUM for Mobile plugin.
3.1. In Service Studio, open your mobile application and reference the Dynatrace_Initialize client action from the DynatracePlugin (this plugin).
3.2. In the Data tab, right-click the Resources folder and select Import Resource.
3.3. Select the dynatrace.config.js you downloaded in step 2.5.
3.4. In the resource’s properties panel, set the Deploy Action to Deploy to Target Directory and set the Target Directory to dynatraceConfig.
3.5. In the Interface tab, right-click the Scripts folder and select Import Script.
3.6. Select the file you created in step 2.12.
3.7. In the Logic tab, right-click the Client Actions folder and select Add System Event > OnApplicationReady.
3.8. Add the Dynatrace_Initialize client action to the OnApplicationReady action flow. Set the DynatraceScript input parameter to the script imported in step 3.6 (Scripts.dynatraceScript.URL).
3.9. Publish your application.
4. Test your application
This section describes the steps you need to take to smoke test the integration between your mobile application and Dynatrace monitoring.
4.1. In Service Center, go to your application’s details page. In the Distribution tab, tag and generate a new app version.
4.2. Install and open the application on your mobile device.
4.3. Navigate your application screens.
4.4. In Dynatrace Portal, go to your mobile or web application. Click Analyze user sessions. The native events should be available in the mobile application, and screen navigation should be available in the web application.
5. Public actions
The Dynatrace RUM for Mobile plugin provides client actions that correspond to methods within the DtrumApi. While the DtrumApi offers a wider range of methods, this plugin currently implements the following subset. You are encouraged to enhance the plugin by adding any additional DtrumApi methods you require.
CheckDynatrace
Checks whether Dynatrace is already initialized.
Dynatrace_Initialize
Injects and initializes Dynatrace monitoring script.
API\DT_EndSession
Sends an endSession signal to the server, which will cause the session to end without waiting for a timeout
API\DT_IdentifyUser
Identifies a user
API\DT_Now
Returns the current time in milliseconds. It automatically chooses the most accurate way to determine the current time.
API\DT_ReportCustomError
sends a custom error with key and value as metadata
API_Actions\DT_ActionName
Sets the actionName of the currently active Action
API_Actions\DT_EnterAction
Marks as having enter in an action.
API_Actions\DT_LeaveAction
Marks as having left in an action.
API_Actions\DT_ReportError
Reports an error message
API_Events\DT_AddEnterActionListener
Attach a listener that gets called while entering an action.
Remove listener if not needed.
API_Events\DT_AddLeaveActionListener
Attach a listener that gets called while leaving an action.
API_Events\DT_AddPageLeavingListener
Adds a listener that is called when the user is leaving the page, but before the monitor signal is sent
API_Events\DT_AddVisitTimeoutListener
Adds a listener to get triggered upon the creation of a new visit id
API_Events\DT_BeginUserInput
Indicates the start of a user input. User inputs must always be stopped by calling endUserInput.
if an xhr call or a page load happens it is checked if a user input is active. if yes, the user input is set to have triggered the page action.
API_Events\DT_EndUserInput
Ends a user input.
API_Events\DT_RemoveEnterActionListener
Removes the listener that gets called while entering an action.
API_Events\DT_RemoveLeaveActionListener
Removes listener that gets called while leaving an action.
API_Settings\DT_Disable
Cookie Opt-In only: Disables the JavaScript agent and removes Dynatrace cookies for Cookie Opt-In mode in case dtrum.enable() has been called earlier
API_Settings\DT_DisablePersistentValues
Removes all traces of persistent values and disables all functionality that would recreate one. Note that this has to be called on every page, since it removes persistent agent data, including the information that persistent data shouldn't be stored.
API_Settings\DT_DisableSessionReplay
Disables session replay.
API_Settings\DT_Enable
Cookie Opt-In only: Enables the JavaScript agent in case it was disabled via Cookie Opt-In setting.
API_Settings\DT_EnablePersistentValues
Enables persistent values again. Only applies if 'disablePersistentValues' has been called previously.
API_Settings\DT_EnableSessionReplay
Enables session replay
API_Settings\DT_GetAndEvaluateMetaData
Get and evaluate meta-data for the page.
API_Settings\DT_SetAutoActionDetection
Enables/disables automatic action detection.
In this document we describe how to install the Dynatrace RUM Mobile plugin in your mobile applications to integrate native and applicational monitoring on your Dynatrace dashboard.
Configure your Dynatrace Environment
Follow the next steps in the Dynatrace portal.
Create a new Mobile App at Dynatrace
In the instrumentation wizard
Select Cordova
Enable web view monitoring
Download the dynatrace.config.js
Go to the settings of the web application part of your mobile application
In Capturing > Async web requests and SPAs enable:
jQuery, Backbone.js
Capture XmlHttpRequest (XHR)
Capture fetch() requests
In Setup select Code snippet and download snippet
Remove the html script tags and save as js file
Please refer to the following public documentation for more information:
https://www.dynatrace.com/support/help/how-to-use-dynatrace/real-user-monitoring/setup-and-configuration/mobile-apps/development-frameworks/apache-cordova/
https://www.dynatrace.com/support/help/how-to-use-dynatrace/real-user-monitoring/setup-and-configuration/mobile-apps/development-frameworks/react-native/
OutSystems Application Configuration
Initializing Dynatrace
Follow these steps to configure your application to log into Dynatrace.
Go to Forge and install the Dynatrace RUM Mobile plugin on your environment
Reference the Dynatrace RUM Mobile plugin from your application
Import the code snippet from Dynatrace
Add in the resources the dynatrace.config.js
Change the deploy action to deploy to target directory
Change the target directory to dynatraceConfig
Create an OnApplicationReady action that calls Dynatrace_Initialize (DynatracePlugin action) with the Url of the script imported.
Publish your application to your environment