Custom spans

Open in ChatGPTOpen in Claude

Custom spans

Create your own custom spans to track specific operations in your application.
Each span will share the same trace ID, which will allow you to create flows in your application and see them in the Tracing view.
Labels can be added during span creation for additional context.

const customTracer = CoralogixRum.getCustomTracer();
const globalSpan = customTracer.startGlobalSpan('global-span', { page: 'posts' });

// Easily create custom spans for specific operations in your application.
globalSpan.startCustomSpan('submit-button', { action: 'click' }).endSpan();

// You can also use the with context method to modeling a specific flow in your application.
globalSpan.withContext(async () => {
  globalSpan.startCustomSpan('get-data-btn', { action: 'click' }).endSpan();
  const res = await fetch('my-api-endpoint');
  globalSpan.startCustomSpan('click-on-first-row', { action: 'click' }).endSpan();

  // ... your code
});

// note: End the global span only after the operation is complete.
globalSpan.endSpan();

Ignored instruments

After creating a global span, some of the instrumented events (network, errors, interactions) will automatically share the same trace ID, unless specifically ignored.

const customTracer = CoralogixRum.getCustomTracer({
  ignoredInstruments: [CoralogixEventType.NETWORK_REQUEST, CoralogixEventType.ERROR, CoralogixEventType.USER_INTERACTION],
});

// ... your code

When getCustomTracer returns nothing

getCustomTracer returns undefined rather than throwing, so a missing prerequisite shows up as a TypeError on the next line instead. It returns nothing when:

• the SDK has not been initialized yet
• traceParentInHeader is not enabled - custom spans need it, and only a debug-level message says so
• a custom tracer already exists, which logs Custom tracer already exists

startGlobalSpan behaves the same way: with a global span already open it warns Global span already exists and returns undefined, rather than replacing it.

A few more things worth knowing:

• Every span must be ended explicitly. endSpan ends the span and releases it, so a new global span can be started afterwards.
• Labels are applied to the span they are passed with. A child span created by startCustomSpan does not inherit the global span's labels.
• Open global spans are ended for you when the session resets, which happens after an hour of session time or 15 minutes of inactivity.