Configure DOM capture and replay for native applications

Overview

You configure DOM capture for a Native iOS and Android applications by modifying the UIC defaultconfiguration.js file.

📘

Tip:

You can find an example of configuring the Dom Capture in the following samples:

• Sample iOS Application

Before you begin

Install the UIC library in your native application.

Set the DOM Capture options

Modify the defaultconfiguration.js file and set the DOM Capture options that you want to use.

📘

Note:

Enabling DOM Capture has significant implications on data transmission and infrastructure. If enabled, further configuration is required to perform the DOM Capture only based on specific events and elements.

replay: {
    // DOM Capture configuration
    domCapture: {
        enabled: true,
        triggers: [{
            event: "load"
        }]
    }
}

📘

Note:

In Web SDK version 5.0.0 and later, DOM diff is automatically enabled when DOM Capture is enabled. DOM diff is supported only on Tealeaf SaaS. On Tealeaf On-premises, DOM diff is supported for web-only and not supported for replaying Hybrid Mobile apps.

Indicate pages that use WebView in the config file

Modify TealeafLayoutConfig.json to indicate you have a page that uses WebView.
The following example indicates that there are two pages - WebViewActivity and DoubleWebPageViewActivity - that use webviews.

{
    "AutoLayout": {
        "IBMGlobalScreenSettings":{
            "ScreenChange": true,
            "DisplayName": "",
            "CaptureLayoutDelay": 500,
            "ScreenShot": false,
            "NumberOfWebViews": 0,
            "CaptureUserEvents": true,
            "CaptureScreenVisits": false,
            "CaptureLayoutOn": 2,
            "CaptureScreenshotOn": 0
        },
        "StartViewController":{
            "DisplayName": "Start",
            "CaptureLayoutDelay": 0
        },
        "WebViewActivity": {
            "DisplayName": "WebView",
            "NumberOfWebViews": 1
        },
        "DoubleWebPageViewActivity": {
            "DisplayName": "Multi WebView",
            "NumberOfWebViews": 2
        }
    },
    "AppendMapIds": {
        "[w,9290],[v,0]": {
            "mid": "ASimpleUIView"
        },
        "tag2999999": {
            "mid": "giveAdditionalId1"
        },
        "idxPathValue": {
            "mid": "giveAdditionalId2"
        }
    }
}

Where the following syntax:

• "WebViewActivity" - is the classname of the page with webview.
• "DisplayName": "WebView" - is the display name used for replay. Give a user-friendly name for replay rather than using a classname.
• "NumberOfWebViews": 1 - is the number of webviews on the page. The library will wait until all webviews load before capturing the page.