Merge pull request #1243 from Shopify/ml-add-graphql-client-sdk-headers

[GraphQL Client] Add default SDK headers to graphql-client
Shopify · Feb 28, 2024 · 5a9baf8 · 5a9baf8
2 parents c3e98d2 + 8c85639
commit 5a9baf8
Show file tree

Hide file tree

Showing 7 changed files with 286 additions and 20 deletions.
diff --git a/.changeset/funny-doors-switch.md b/.changeset/funny-doors-switch.md
@@ -0,0 +1,5 @@
+---
+"@shopify/graphql-client": patch
+---
+
+Add default SDK headers to all API requests when none are provided
diff --git a/packages/graphql-client/src/graphql-client/constants.ts b/packages/graphql-client/src/graphql-client/constants.ts
@@ -13,6 +13,12 @@ export const CONTENT_TYPES = {
   json: "application/json",
   multipart: "multipart/mixed",
 };
+export const SDK_VARIANT_HEADER = "X-SDK-Variant";
+export const SDK_VERSION_HEADER = "X-SDK-Version";
+
+export const DEFAULT_SDK_VARIANT = "shopify-graphql-client";
+// This is value is replaced with package.json version during rollup build process
+export const DEFAULT_CLIENT_VERSION = "ROLLUP_REPLACE_CLIENT_VERSION";
 
 export const RETRY_WAIT_TIME = 1000;
 export const RETRIABLE_STATUS_CODES = [429, 503];

diff --git a/packages/graphql-client/src/graphql-client/graphql-client.ts b/packages/graphql-client/src/graphql-client/graphql-client.ts
@@ -19,6 +19,10 @@ import {
   HEADER_SEPARATOR,
   DEFER_OPERATION_REGEX,
   BOUNDARY_HEADER_REGEX,
+  SDK_VARIANT_HEADER,
+  SDK_VERSION_HEADER,
+  DEFAULT_SDK_VARIANT,
+  DEFAULT_CLIENT_VERSION,
 } from "./constants";
 import {
   formatErrorMessage,
@@ -122,6 +126,11 @@ function generateFetch(
       return headers;
     }, {});
 
+    if (!flatHeaders[SDK_VARIANT_HEADER] && !flatHeaders[SDK_VERSION_HEADER]) {
+      flatHeaders[SDK_VARIANT_HEADER] = DEFAULT_SDK_VARIANT;
+      flatHeaders[SDK_VERSION_HEADER] = DEFAULT_CLIENT_VERSION;
+    }
+
     const fetchParams: Parameters<CustomFetchApi> = [
       overrideUrl ?? url,
       {

diff --git a/packages/graphql-client/src/graphql-client/tests/graphql-client/client-fetch-request.test.ts b/packages/graphql-client/src/graphql-client/tests/graphql-client/client-fetch-request.test.ts
@@ -2,8 +2,19 @@ import fetchMock from "jest-fetch-mock";
 
 import { GraphQLClient } from "../../types";
 
-import { operation, variables, clientConfig, getValidClient } from "./fixtures";
-import { fetchApiTests, parametersTests, retryTests } from "./common-tests";
+import {
+  operation,
+  variables,
+  clientConfig,
+  getValidClient,
+  defaultHeaders,
+} from "./fixtures";
+import {
+  fetchApiTests,
+  parametersTests,
+  sdkHeadersTests,
+  retryTests,
+} from "./common-tests";
 
 describe("GraphQL Client", () => {
   let mockLogger: jest.Mock;
@@ -35,6 +46,10 @@ describe("GraphQL Client", () => {
         parametersTests(functionName);
       });
 
+      describe("SDK headers", () => {
+        sdkHeadersTests(functionName);
+      });
+
       describe("returned object", () => {
         it("returns the HTTP response", async () => {
           const response = await client.fetch(operation);
@@ -121,7 +136,7 @@ describe("GraphQL Client", () => {
               {
                 method: "POST",
                 body: JSON.stringify({ query: operation }),
-                headers: clientConfig.headers,
+                headers: defaultHeaders,
               },
             ];
 
@@ -247,7 +262,7 @@ describe("GraphQL Client", () => {
               {
                 method: "POST",
                 body: JSON.stringify({ query: operation }),
-                headers: clientConfig.headers,
+                headers: defaultHeaders,
               },
             ];
 
@@ -312,7 +327,7 @@ describe("GraphQL Client", () => {
                 {
                   method: "POST",
                   body: JSON.stringify({ query: operation }),
-                  headers: clientConfig.headers,
+                  headers: defaultHeaders,
                 },
               ],
             },
@@ -327,6 +342,10 @@ describe("GraphQL Client", () => {
 
     fetchApiTests(functionName);
 
+    describe("SDK headers", () => {
+      sdkHeadersTests(functionName);
+    });
+
     describe("calling the function", () => {
       describe("function parameters", () => {
         parametersTests(functionName);
@@ -626,7 +645,7 @@ describe("GraphQL Client", () => {
               {
                 method: "POST",
                 body: JSON.stringify({ query: operation }),
-                headers: clientConfig.headers,
+                headers: defaultHeaders,
               },
             ];
 
@@ -767,7 +786,7 @@ describe("GraphQL Client", () => {
               {
                 method: "POST",
                 body: JSON.stringify({ query: operation }),
-                headers: clientConfig.headers,
+                headers: defaultHeaders,
               },
             ];
 
@@ -833,7 +852,7 @@ describe("GraphQL Client", () => {
                 {
                   method: "POST",
                   body: JSON.stringify({ query: operation }),
-                  headers: clientConfig.headers,
+                  headers: defaultHeaders,
                 },
               ],
             },

diff --git a/packages/graphql-client/src/graphql-client/tests/graphql-client/client-requestStream.test.ts b/packages/graphql-client/src/graphql-client/tests/graphql-client/client-requestStream.test.ts
@@ -8,8 +8,14 @@ import {
   createIterableResponse,
   createIterableBufferResponse,
   createReaderStreamResponse,
+  defaultHeaders,
 } from "./fixtures";
-import { fetchApiTests, parametersTests, retryTests } from "./common-tests";
+import {
+  fetchApiTests,
+  parametersTests,
+  sdkHeadersTests,
+  retryTests,
+} from "./common-tests";
 
 const operation = `
 query shop($country: CountryCode, $language: LanguageCode) @inContext(country: $country, language: $language) {
@@ -57,6 +63,10 @@ describe("GraphQL Client", () => {
 
     fetchApiTests(functionName, operation);
 
+    describe("SDK headers", () => {
+      sdkHeadersTests(functionName, operation);
+    });
+
     describe("calling the function", () => {
       describe("fetch parameters", () => {
         parametersTests("requestStream", operation);
@@ -1171,7 +1181,7 @@ describe("GraphQL Client", () => {
               {
                 method: "POST",
                 body: JSON.stringify({ query: operation }),
-                headers: clientConfig.headers,
+                headers: defaultHeaders,
               },
             ];
 
@@ -1333,7 +1343,7 @@ describe("GraphQL Client", () => {
               {
                 method: "POST",
                 body: JSON.stringify({ query: operation }),
-                headers: clientConfig.headers,
+                headers: defaultHeaders,
               },
             ];
 
@@ -1407,7 +1417,7 @@ describe("GraphQL Client", () => {
                 {
                   method: "POST",
                   body: JSON.stringify({ query: operation }),
-                  headers: clientConfig.headers,
+                  headers: defaultHeaders,
                 },
               ],
             },