Configure Synthetics projects

Synthetic tests support the configuration of dynamic parameters that can be used in projects. In addition, the Synthetics agent, which is built on top of Playwright, supports configuring browser and context options that are available in Playwright-specific methods, for example, ignoreHTTPSErrors, extraHTTPHeaders, and viewport.

Create a synthetics.config.js or synthetics.config.ts file in the root of the synthetics project and specify the options:

import { SyntheticsConfig } from '@elastic/synthetics'

const config: SyntheticsConfig = {
  params: {
    url: 'https://www.elastic.co'
  },
  playwrightOptions: {
    ignoreHTTPSErrors: true, // ignores all HTTPS errors during navigation
    extraHTTPHeaders: {
      'foo': 'bar' // additional HTTP headers to be sent with every request
    }
  },
  monitor: {
    schedule: 10,
    locations: [ 'us-east4-a' ],
  }
}

export default config;

The configuration file can either export an object, or a function that when called should return the generated configuration. To know more about configuring the tests based on environments, look at the dynamic configuration documentation.

An object that defines any variables your tests require.

For available options, see the Playwright documentation.

Users can emulate a mobile device using the configuration file. The example configuration below runs tests in "Pixel 5" emulation mode.

import { SyntheticsConfig } from "@elastic/synthetics"
import { devices } from "playwright-chromium"

const config: SyntheticsConfig = {
  playwrightOptions: {
    ...devices['Pixel 5']
  }
}

export default config;

Default values to be applied to all monitors when using the @elastic/synthetics push command.

For information on configuring monitors individually, refer to Configure individual monitors.