Set the default operation name and resource name for web requests (#57)

* Set the default operation name and resource name for web requests This change sets the default 'operation.name' and 'resource.name' attributes for web requests. The 'resource.name' is set to the concatenation of the HTTP method and the HTTP route. The 'operation.name' is set to the string 'web.request' The effect is that we can view all associated web requests in the UI by filtering on the 'operation.name' attribute. * Add changeset * Remove vercel.env (#58) * missing vercel.env
vercel · Mar 21, 2024 · 84e2e04 · 84e2e04
1 parent cc4f6b0
commit 84e2e04
Show file tree

Hide file tree

Showing 10 changed files with 50 additions and 37 deletions.
diff --git a/.changeset/plenty-crabs-warn.md b/.changeset/plenty-crabs-warn.md
@@ -0,0 +1,7 @@
+---
+"@vercel/otel": minor
+---
+
+Set the default 'operation.name' attribute for web requests to 'web.request'.
+
+Update the default 'resource.name' attribute for web requests to the concatenation of the HTTP method and the HTTP route.
diff --git a/packages/otel/README.md b/packages/otel/README.md
@@ -47,7 +47,7 @@ Registers the OpenTelemetry SDK with the specified service name and the default
 Registers the OpenTelemetry SDK with the specified configuration. Configuration options include:
 
 - `serviceName`: The name of your service, used as the app name in many OpenTelemetry backends.
-- `attributes`: The resource attributes. By default, `@vercel/otel` configures relevant Vercel attributes based on [the environment](https://vercel.com/docs/projects/environment-variables/system-environment-variables), such as `vercel.env`, `vercel.runtime`, `vercel.host`, etc.
+- `attributes`: The resource attributes. By default, `@vercel/otel` configures relevant Vercel attributes based on [the environment](https://vercel.com/docs/projects/environment-variables/system-environment-variables), such as `env`, `vercel.runtime`, `vercel.host`, etc.
 - `instrumentations`: A set of instrumentations. By default, `@vercel/otel` configures "fetch" instrumentation.
 - `instrumentationConfig`: Customize configuration for predefined instrumentations:
   - `fetch`: Customize configuration of the predefined "fetch" instrumentation:

diff --git a/packages/otel/src/processor/composite-span-processor.ts b/packages/otel/src/processor/composite-span-processor.ts
@@ -153,37 +153,43 @@ function getResourceAttributes(span: ReadableSpan): Attributes | undefined {
     return undefined;
   }
 
+  const resourceNameResolved =
+    resourceName ??
+    (httpMethod &&
+    typeof httpMethod === "string" &&
+    httpRoute &&
+    typeof httpRoute === "string"
+      ? `${httpMethod} ${httpRoute}`
+      : httpRoute);
+
+  if (
+    span.kind === SpanKind.SERVER &&
+    httpMethod &&
+    httpRoute &&
+    typeof httpMethod === "string" &&
+    typeof httpRoute === "string"
+  ) {
+    return {
+      "operation.name": "web.request",
+      "resource.name": resourceNameResolved,
+    };
+  }
+
   // Per https://github.com/DataDog/datadog-agent/blob/main/pkg/config/config_template.yaml,
   // the default operation.name is "library name + span kind".
   const libraryName = span.instrumentationLibrary.name;
-
   const spanType = nextSpanType ?? spanTypeAttr;
   if (spanType && typeof spanType === "string") {
     const nextOperationName = toOperationName(libraryName, spanType);
     if (httpRoute) {
       return {
         "operation.name": nextOperationName,
-        "resource.name": resourceName ?? httpRoute,
+        "resource.name": resourceNameResolved,
       };
     }
     return { "operation.name": nextOperationName };
   }
 
-  if (
-    httpMethod &&
-    httpRoute &&
-    typeof httpMethod === "string" &&
-    typeof httpRoute === "string"
-  ) {
-    return {
-      "operation.name": toOperationName(
-        libraryName,
-        `http.${SPAN_KIND_NAME[kind] || "internal"}.${httpMethod}`
-      ),
-      "resource.name": resourceName ?? httpRoute,
-    };
-  }
-
   return {
     "operation.name": toOperationName(
       libraryName,

diff --git a/packages/otel/src/sdk.ts b/packages/otel/src/sdk.ts
@@ -103,8 +103,8 @@ export class Sdk {
 
         // Vercel.
         // https://vercel.com/docs/projects/environment-variables/system-environment-variables
-        "vercel.env":
-          process.env.VERCEL_ENV || process.env.NEXT_PUBLIC_VERCEL_ENV,
+        // Vercel Env set as top level attribute for simplicity. One of 'production', 'preview' or 'development'.
+        env: process.env.VERCEL_ENV || process.env.NEXT_PUBLIC_VERCEL_ENV,
         "vercel.region": process.env.VERCEL_REGION,
         "vercel.runtime": runtime,
         "vercel.sha":

diff --git a/packages/otel/src/types.ts b/packages/otel/src/types.ts
@@ -62,7 +62,7 @@ export interface Configuration {
    * including:
    * - `service.name` - the service name.
    * - `node.env` - the value of `NODE_ENV` environment variable.
-   * - `vercel.env` - the Vercel deployment environment such as "production" or "preview" (`VERCEL_ENV` environment variable).
+   * - `env` - the Vercel deployment environment such as "production" or "preview" (`VERCEL_ENV` environment variable).
    * - `vercel.region` - the Vercel deployment region (`VERCEL_REGION` environment variable).
    * - `vercel.runtime` - "nodejs" or "edge" (`NEXT_RUNTIME` environment variable).
    * - `vercel.sha` - the Vercel deployment Git SHA (`VERCEL_GIT_COMMIT_SHA` environment variable).

diff --git a/tests/e2e/test/vercel-deployment/api-inbound.test.ts b/tests/e2e/test/vercel-deployment/api-inbound.test.ts
@@ -23,7 +23,7 @@ describe("vercel deployment: api inbound", {}, (props) => {
       resource: {
         "service.name": "sample-app",
         "vercel.runtime": "nodejs",
-        "vercel.env": "test",
+        env: "test",
       },
       attributes: {
         scope: "next.js",
@@ -87,7 +87,7 @@ describe("vercel deployment: api inbound", {}, (props) => {
       resource: {
         "service.name": "sample-app",
         "vercel.runtime": "edge",
-        "vercel.env": "test",
+        env: "test",
       },
       kind: SpanKind.INTERNAL,
       attributes: {

diff --git a/tests/e2e/test/vercel-deployment/api.test.ts b/tests/e2e/test/vercel-deployment/api.test.ts
@@ -19,7 +19,7 @@ describe("vercel deployment: api", {}, (props) => {
       resource: {
         "service.name": "sample-app",
         "vercel.runtime": "nodejs",
-        "vercel.env": "test",
+        env: "test",
       },
       attributes: {
         scope: "next.js",
@@ -68,7 +68,7 @@ describe("vercel deployment: api", {}, (props) => {
       resource: {
         "service.name": "sample-app",
         "vercel.runtime": "edge",
-        "vercel.env": "test",
+        env: "test",
       },
       kind: SpanKind.INTERNAL,
       attributes: {

diff --git a/tests/e2e/test/vercel-deployment/render-middleware.test.ts b/tests/e2e/test/vercel-deployment/render-middleware.test.ts
@@ -15,7 +15,7 @@ describe("vercel deployment: middleware", {}, (props) => {
       resource: {
         "service.name": "sample-app",
         "vercel.runtime": "edge",
-        "vercel.env": "test",
+        env: "test",
       },
       attributes: {
         scope: "next.js",
@@ -43,7 +43,7 @@ describe("vercel deployment: middleware", {}, (props) => {
       resource: {
         "service.name": "sample-app",
         "vercel.runtime": "nodejs",
-        "vercel.env": "test",
+        env: "test",
       },
       attributes: {
         scope: "next.js",
@@ -88,7 +88,7 @@ describe("vercel deployment: middleware", {}, (props) => {
       resource: {
         "service.name": "sample-app",
         "vercel.runtime": "edge",
-        "vercel.env": "test",
+        env: "test",
       },
       attributes: {
         scope: "next.js",
@@ -116,7 +116,7 @@ describe("vercel deployment: middleware", {}, (props) => {
       resource: {
         "service.name": "sample-app",
         "vercel.runtime": "edge",
-        "vercel.env": "test",
+        env: "test",
       },
       attributes: {
         scope: "next.js",

diff --git a/tests/e2e/test/vercel-deployment/render.test.ts b/tests/e2e/test/vercel-deployment/render.test.ts
@@ -17,7 +17,7 @@ describe("vercel deployment: render", {}, (props) => {
       resource: {
         "service.name": "sample-app",
         "vercel.runtime": "nodejs",
-        "vercel.env": "test",
+        env: "test",
       },
       attributes: {
         scope: "next.js",
@@ -29,8 +29,8 @@ describe("vercel deployment: render", {}, (props) => {
         "http.status_code": 200,
         "next.route": "/slugs/[slug]",
         "http.route": "/slugs/[slug]",
-        "operation.name": "next_js.BaseServer.handleRequest",
-        "resource.name": "/slugs/[slug]",
+        "operation.name": "web.request",
+        "resource.name": "GET /slugs/[slug]",
       },
       spans: [
         {
@@ -73,7 +73,7 @@ describe("vercel deployment: render", {}, (props) => {
       resource: {
         "service.name": "sample-app",
         "vercel.runtime": "edge",
-        "vercel.env": "test",
+        env: "test",
       },
       attributes: {
         scope: "next.js",
@@ -84,8 +84,8 @@ describe("vercel deployment: render", {}, (props) => {
         "http.status_code": 200,
         "next.route": "/slugs/[slug]/edge",
         "http.route": "/slugs/[slug]/edge",
-        "operation.name": "next_js.BaseServer.handleRequest",
-        "resource.name": "/slugs/[slug]/edge",
+        "operation.name": "web.request",
+        "resource.name": "GET /slugs/[slug]/edge",
       },
       spans: [
         {

diff --git a/tests/e2e/test/vercel-deployment/vercel-collector.test.ts b/tests/e2e/test/vercel-deployment/vercel-collector.test.ts
@@ -31,7 +31,7 @@ describe(
         resource: {
           "service.name": "sample-app",
           "vercel.runtime": "nodejs",
-          "vercel.env": "test",
+          env: "test",
         },
         attributes: {
           scope: "next.js",
@@ -79,7 +79,7 @@ describe(
         resource: {
           "service.name": "sample-app",
           "vercel.runtime": "edge",
-          "vercel.env": "test",
+          env: "test",
         },
         attributes: {
           scope: "next.js",