Record a browser clickpath

Your web application provides certain key functionality to your customers that is critical to the success of your business. Monitoring your application via browser clickpaths ensures that this functionality is available to your customers 24/7.

With our easy-to-use Dynatrace Synthetic Recorder (a Google Chrome browser extension), you can gain visibility into the availability and performance of your application's most important functionality involving all the elements of your IT infrastructure with just a few clicks.

Use the Dynatrace Synthetic Recorder to record the exact sequences of interaction that you want your simulated user visits to follow. The recorder captures events (such as button clicks, page scrolls, or user input) and converts them into a script that is played back each time you run the clickpath.

Each monitor run begins in a clean state, that is, with a clean browser cache and empty local storage.

Install the Dynatrace Synthetic Recorder extension

You need to install Dynatrace Synthetic Recorder to begin. After installation, the recorder is automatically updated whenever new features become available.

  1. Go to Synthetic in the Dynatrace menu.
  2. Select Create a synthetic monitor > Create a browser monitor.
  3. First-time users are asked to install the Chrome extension: select Install Dynatrace Synthetic Recorder at the bottom of the page.
  4. On the extension page, select Add to Chrome > Add Extension.

Allow extension in incognito

After installing the Dynatrace Synthetic Recorder extension, you need to enable the Allow in incognito permission. This is necessary to have a clean browser state for recording and local playback in Chrome incognito mode.

  1. Paste chrome://extensions/ into your Chrome address bar and press Enter.
  2. On the Dynatrace Synthetic Recorder tile, select Details.
  3. Turn on Allow in incognito.

Record a browser clickpath

  1. Go to Synthetic in the Dynatrace menu.

  2. Select Create a synthetic monitor > Create a browser monitor.

  3. Enter a valid URL and check the default Name for your clickpath on the Create synthetic monitor page.

    To enhance synthetic monitor security, Dynatrace blocks monitors from sending requests to a local host (for example, localhost or 127.0.0.1).

  4. Select Add tag to apply manually created tags to the monitor. You can choose from auto-complete suggestions as you type or create your own. (After the monitor has been created, you can manage tags from the Synthetic details page.

  5. Continue on to configure the monitor—device profile and additional options such as cookies and automated login.
    Configure a browser monitor

  6. Record or define clickpath events.

    • You can Manually add clickpath events.

      • For manual clickpath creation, you can edit in Visual mode by adding events to your script. You also need to configure monitor options. You can also Play back clickpath, Record again, or Cancel clickpath creation—see Local playback. Note that any JavaScript events that precede an initial Navigate event will be erased when you re-record your clickpath—see Browser clickpath events.
        Manual clickpath creation by UI
      • For manual clickpath creation in Script mode, all events and options such as cookies and automated login are defined in JSON. Manual clickpath script creation
    • To use the recorder, select Record clickpath.

      Browser clickpaths are hard-coded to time out after 5 minutes. When recording a clickpath, ensure that the clickpath does not exceed this time limit.

      1. In the recorder browser instance that pops up, click through your application to simulate a key use case (for example, logging in, searching for a product, or placing an order). As you interact with your application, each event is recorded for future playback.

      2. When done, select the Dynatrace extension icon on your browser's menu bar to see a list of recorded events and Finish recording. Finish recording a clickpath

      3. Events in your recorded clickpath are displayed. You can edit each event, for example, to add content validation or adjust wait time where needed. You can also Cancel, Play back clickpath, or Record again—see Local playback. Note that any JavaScript events that precede an initial Navigate event will be erased when you re-record your clickpath—see Browser clickpath events.

        When your recorded clickpath captures a credential such as a password, you are notified and given the option to save it to the credential vault. The image below shows a recorded clickpath with a captured password. Read more about credentials in the Navigate event and Keystroke event.

        Captured credential

  7. When recording is finished, choose Select frequency and locations to continue configuration.

    Note
    If you select this button without recording a clickpath or manually defining events, you will create a single-URL browser monitor for the URL specified.

  8. Choose monitor frequency. Scroll down to select locations. Your selections are displayed on the map. Continue to View monitor summary.
    Clickpath frequency and locations

  9. On the Summary page, you can review and change your configuration (Change URL or name; Change configuration) or edit your clickpath events (Edit clickpath). Clickpath summary

    Notes

  10. Click Create browser monitor. Within a few minutes, you'll receive monitoring data for your new browser clickpath.

Local playback

You can play back a clickpath locally after you record or manually define clickpath events.

If your browser monitor has any associated credentials, whether public or owner only, users need to enter the credentials in order to play back the monitor locally. However, if you Enable local playback of Synthetic browser monitors without entering credentials in the credential vault, users need not enter the credentials that they have access to in order to play back the browser monitor.

You can opt to keep the playback window open after playing back a clickpath (Keep window open after playback), say, to debug a failed execution or add a JavaScript event.

Note

Local playback in Dynatrace is in emulation mode, based on the device profile and user agent you select during monitor configuration. That is, playback emulates your chosen device. If you navigate to the same URL or perform the same transaction outside Dynatrace, your experience might vary.

View the analytics of a browser clickpath

  1. Go to Synthetic in the Dynatrace menu.
  2. optional Filter by Browser clickpath in the left menu.
  3. From the list of monitors, select the browser clickpath you want to examine. You're directed to the Synthetic details page for the clickpath.

Disable or delete a browser clickpath

Monitors are enabled by default when you create them.

Disabling a synthetic monitor suspends further executions but retains the monitor and its measurement data. Any open performance and availability problems time out when a monitor is disabled (see Synthetic calculations for details). Deletion removes a monitor and its associated measurement data; this is irreversible. Before deleting a monitor, we recommend that you disable it first and ensure that you no longer require its measurement data.

To disable or delete a monitor

  1. Go to Synthetic in the Dynatrace menu.
  2. Opt to view the Synthetic page in list format.
  3. Select the check box for the monitor you want to delete or disable.
  4. Select Delete or Disable in the lower-left corner.
    Delete a clickpath

You can also disable or delete a monitor from the details page.

  1. Go to Synthetic in the Dynatrace menu.
  2. Select the monitor you're interested in.
  3. Select the Browse button () and select either Disable or Delete.