Opentelemetry manual trace propagation

trace_prop.ts

import { WebTracerProvider } from "@opentelemetry/web";
import { ZoneContextManager } from "@opentelemetry/context-zone";
import { CollectorExporter } from "@opentelemetry/exporter-collector";
import * as api from "@opentelemetry/api";

const provider = new WebTracerProvider({
  //plugins: [new DocumentLoad() as any, new UserInteractionPlugin()],
  plugins: [new DocumentLoad() as any],
});
provider.addSpanProcessor(
  new SimpleSpanProcessor(
    new CollectorExporter({
      serviceName: "si-web-app",
    }),
  ),
);
provider.addSpanProcessor(new SimpleSpanProcessor(new ConsoleSpanExporter()));
provider.register({
  contextManager: new ZoneContextManager(),
});

const tracer = provider.getTracer("yourapp");

parentSpan = tracer.startSpan("I am the parent");
const span = tracer.withSpan(parentSpan, _ => {
      const span = tracer.startSpan(
        name,
        options,
        context || api.context.active(),
      );
      return span;
});

// Later, you want to generate a header for trace propagation
const headers = tracer.withSpan(span, () => {
   const headers: Record<string, unknown> = {};
    api.propagation.inject(headers, (headers, k, v) => {
      headers[k] = v;
    });
    return headers;
});
console.log("headers have the right traceparent", headers);