Crosslinking Synthetics with APM

Provide visibility into how the synthetic journeys are executed and what actions are happening inside every step.

Linking via trace headers (traceparent)

The previous proposal of linking between the Synthetics/Heartbeat is to generate a unique Traceid for each run and propagate the trace context details to the other APM agents which could pick up the id and generate the transactions/spans respectively.

How this would work from the Synthetics agent,

journey('Synthetics + APM', ({ page }) => {
  step('propagate traceparent ', async () => {
    await page.route('**', (route, request) => {
      if (request.isNavigationRequest()) {
       // add trace headers for all requests.
        const headers = {
          traceparent:
            '00-dc739d61ca520efa486e48aae80a66c7-4de1afd949fe4b1d-01',
          ...request.headers(),
        };
        route.continue({ headers });
      }
      route.continue();
    });
    await page.goto('http://localhost:8080/index');
  });
});

Note: Backend server running on port 8080 is running Node.js agent and injects RUM agent for the index page.

The above code propagates the trace headers traceparent to all the backend servers which would help identify the overall trace from serving the index page to what requests went inside that page since we use RUM and also Node.js agent.

Synthetics as an APM agent

Instead of injecting the trace details for every run, Synthetics could work as an APM agent and start creating transactions for both journeys and steps which could be propagated to the other APM agents including Node.js and RUM. This would let the user visualize the overall picture from how the browser got launched to how each actions in journey and step impacted the whole test.

I have patched both Synthetic and RUM agent to make it work locally, See an example of how this would look like

Think about how we could leverage the Network details in Synthetics with APM and RUM.

Both approaches will result in browser ignoring the DISK/HTTP cache as they modify the headers before the request is being made to the server. We might need to dig more and figure out how to do this without affecting cache. However as its a test mode, it might not be a big of a deal.

Would like to thank @spalger from Kibana Operations team for brainstorming.

/cc @graphaelli @andrewvc @paulb-elastic