Using browser scripts

Browser testing simulates the paths that users might take through web applications by playing back Node.js based test scripts through browsers to monitor and measure the performance of users' websites.

Instana Synthetic browser testing supports Selenium-based APIs and expands browser testing functions with more than 30 browser testing APIs.

In addition, Instana Synthetic introduces a set of global variables and APIs to make browser testing easier, maintainable, and secure.

By using this feature, scripts developers can mainly focus on their test logic, instead of installing browsers and drivers, opening and closing browsers, and releasing resources.

Prerequisites
Supported runtimes and capabilities
Browser script test types
- Browser scripts
  - Browser scripts: Single browser testing script
  - Browser scripts: Bundled browser testing scripts
- Selenium IDE Scripts
Browser script examples
Browser script testing and debugging

Prerequisites

Instana browser testing is supported for Synthetic PoP Helm chart 1.0.15 or later.

A new playback engine is used to run these tests. You must upgrade your Synthetic PoP version to 1.0.15 or later to enable the browser playback engine.

To check the version of the Synthetic PoP Helm chart, run the following command:

helm list -n <namespace>

To check whether the new playback engine for browser testing is enabled, run the following command:

kubectl get pod -n <namespace> | grep browserscript
synthetic-pop-browserscript-playback-engine-8589bb6cbf-dh7sb   1/1     Running   0          13m

Supported runtimes and capabilities

Instana Synthetic browser testing supports Chromium, Mozilla Firefox, and Node.js runtime.
- Mozilla Firefox 115.4.0esr
- Chromium 102.0.5005.0
- Node.js v18
- selenium-webdriver 4.20.0
Instana Synthetic browser testing supports Selenium-based APIs and over 30 browser test APIs.
Instana Synthetic browser testing supports to analyze and collect metrics like response time and response size.
Instana Synthetic browser testing supports recordings, screenshots, browser logs, console logs, and HTTP Archive format (HAR) in the test result.

Browser script test types

With Instana Synthetic, you can create the following browser script tests:

Browser scripts

Browser scripts are Node.js based and include both single and bundled scripts.

Browser scripts: Single browser testing script

You can write everything in a single script. Usually, this way can meet most users' needs. See the following example:

(async function () {
  console.log("Access IBM website");
  await $browser.get("https://www.ibm.com/us-en");

  console.log("Accept all cookies");
  const cookies = await $browser.waitForAndFindElement(
    $driver.By.id(`truste-consent-button`),
    30000
  );
  await cookies.click();
})();

Browser scripts: Bundled browser testing scripts

If the business logic is complex, do not contain everything in a single script. Use multiple script files for better maintenance, code reuse, and version control in GitHub.

You can use bundled scripts in a compressed file.

Write multiple scripts with shared libraries. See the following example:

// bundled/mytest.js
const assert = require("assert").strict;
let { testIBM } = require("./lib/myscript.js");
console.log("Start to test");
testIBM();

// bundled/lib/myscript.js
async function testIBM() {
  console.log("Access IBM website");
  await $browser.get("https://www.ibm.com/us-en");

  console.log("Accept all cookies");
  const cookies = await $browser.waitForAndFindElement($driver.By.id(`truste-consent-button`), 30000);
  await cookies.click();
};
module.exports = {
  testIBM
};

Package multiple scripts into a .zip file. See the following example:

Compress scripts into .zip file with the top folder bundled and the main file bundled/mytest.js.
```
zip -r bundledtest.zip bundled
```
Or package all scripts into .zip file with the main file mytest.js.
```
zip -r bundledtest.zip *
```

Selenium IDE Scripts

Selenium IDE scripts are Selenium IDE recorded scripts.

Browser script examples

Instana Synthetic provides many examples, which help you to get started quickly or write your own browser tests quickly.

To get started, see the following examples:

Browser script testing and debugging

Instana Synthetic provides a Node.js command-line application, synthetic-browser-script, to help users develop, test, or debug your browser testing scripts locally.

The synthetic-browser-script application is now available in GitHub and the npmjs site.

It is a local runner for Instana Synthetic to help you with your Synthetic browser testing.
It comes with many examples, which helps you to write your own browser tests quickly. More examples will be added.

You can use the synthetic-browser-script local runner in the following cases:

You need a local runner to test and debug your browser scripts with the CLI.
You need an npm package that provides all the Instana Synthetic browser testing APIs.
You need the "code completion" or "code hinting" in VS Code for all the browser testing APIs.
You need an open full browser to complete your test actions and prove the quality of your scripts.
You need to reproduce your test failures locally to help debug the root cause.
You need to learn from examples of browser testing APIs and then write your own browser tests based on these examples.