Skip to content

Enrich front-end spans with context information #178

@mcollovati

Description

@mcollovati

Some of the out of the box front-end instrumentation is missing context data that may help in correctly detecting issues.
For example, the long-running task produces a span like the one below, that does help to identify the view that actually owns the task

Example Span
{
    "traceId": "1cfab03028635ed64129d8d7f9b29318",
    "spanId": "5363300a4b22ba13",
    "name": "longtask",
    "kind": 1,
    "startTimeUnixNano": 1678876048253300000,
    "endTimeUnixNano": 1678876050228300000,
    "attributes": [
        {
            "key": "component",
            "value": {
                "stringValue": "long-task"
            }
        },
        {
            "key": "longtask.name",
            "value": {
                "stringValue": "self"
            }
        },
        {
            "key": "longtask.entry_type",
            "value": {
                "stringValue": "longtask"
            }
        },
        {
            "key": "longtask.duration",
            "value": {
                "intValue": 1975
            }
        },
        {
            "key": "longtask.attribution.name",
            "value": {
                "stringValue": "unknown"
            }
        },
        {
            "key": "longtask.attribution.entry_type",
            "value": {
                "stringValue": "taskattribution"
            }
        },
        {
            "key": "longtask.attribution.start_time",
            "value": {
                "intValue": 0
            }
        },
        {
            "key": "longtask.attribution.duration",
            "value": {
                "intValue": 0
            }
        },
        {
            "key": "longtask.attribution.container_type",
            "value": {
                "stringValue": "window"
            }
        },
        {
            "key": "longtask.attribution.container_src",
            "value": {
                "stringValue": ""
            }
        },
        {
            "key": "longtask.attribution.container_id",
            "value": {
                "stringValue": ""
            }
        },
        {
            "key": "longtask.attribution.container_name",
            "value": {
                "stringValue": ""
            }
        }
    ],
    "droppedAttributesCount": 0,
    "events": [],
    "droppedEventsCount": 0,
    "status": {
        "code": 0
    },
    "links": [],
    "droppedLinksCount": 0
}

When possible, we should try to add missing context attributes to the span to best identify the originator of the issues.
For example, long task instrumentation allows providing a callback to enrich the span

longtaskInstrumentationConfig = {
  observerCallback: (span, longtaskEvent) => {
    span.setAttribute('location.pathname', window.location.pathname)
  }
}

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions