Fix headers type (extends apollographql#9042) (apollographql#10471)

* fix(types): use correct type for headers When passing the headers property to `createHttpLink` one might think that it is ok to pass them as `Headers` interface, but that doesn't work because there is several places in the code that expect headers to be passed as an object. * chore: fix TS errors * chore: adds changeset Co-authored-by: Filipe Guerra <alias.mac@gmail.com>

Author: alessbell

.changeset/proud-months-dance.md

@@ -0,0 +1,5 @@
+---
+"@apollo/client": patch
+---
+
+More robust type definition for `headers` property passed to `createHttpLink`

src/link/batch-http/__tests__/batchHttpLink.ts

@@ -510,7 +510,7 @@ describe('SharedHttpTest', () => {
 
  execute(link, { query: sampleQuery, variables }).subscribe(
  makeCallback(resolve, reject, (result: any) => {
- const headers: any = fetchMock.lastCall()![1]!.headers;
+ const headers: Record<string, string> = fetchMock.lastCall()![1]!.headers as Record<string, string>;
  expect(headers.authorization).toBe('1234');
  expect(headers['content-type']).toBe('application/json');
  expect(headers.accept).toBe('*/*');
@@ -527,7 +527,7 @@ describe('SharedHttpTest', () => {
 
  execute(link, { query: sampleQuery, variables }).subscribe(
  makeCallback(resolve, reject, (result: any) => {
- const headers: any = fetchMock.lastCall()![1]!.headers;
+ const headers: Record<string, string> = fetchMock.lastCall()![1]!.headers as Record<string, string>;
  expect(headers.authorization).toBe('1234');
  expect(headers['content-type']).toBe('application/json');
  expect(headers.accept).toBe('*/*');
@@ -549,7 +549,7 @@ describe('SharedHttpTest', () => {
 
  execute(link, { query: sampleQuery, variables }).subscribe(
  makeCallback(resolve, reject, (result: any) => {
- const headers: any = fetchMock.lastCall()![1]!.headers;
+ const headers: Record<string, string> = fetchMock.lastCall()![1]!.headers as Record<string, string>;
  expect(headers.authorization).toBe('1234');
  expect(headers['content-type']).toBe('application/json');
  expect(headers.accept).toBe('*/*');
@@ -570,7 +570,7 @@ describe('SharedHttpTest', () => {
  context,
  }).subscribe(
  makeCallback(resolve, reject, (result: any) => {
- const headers: any = fetchMock.lastCall()![1]!.headers;
+ const headers: Record<string, string> = fetchMock.lastCall()![1]!.headers as Record<string, string>;
  expect(headers.authorization).toBe('1234');
  expect(headers['content-type']).toBe('application/json');
  expect(headers.accept).toBe('*/*');

src/link/http/createHttpLink.ts

@@ -138,6 +138,7 @@ export const createHttpLink = (linkOptions: HttpOptions = {}) => {
 
  // does not match custom directives beginning with @defer
  if (hasDirectives(['defer'], operation.query)) {
+ options.headers = options.headers || {};
  options.headers.accept = "multipart/mixed; deferSpec=20220824, application/json";
  }
 

src/link/http/selectHttpOptionsAndBody.ts

@@ -40,11 +40,11 @@ export interface HttpOptions {
  /**
  * An object representing values to be sent as headers on the request.
  */
- headers?: any;
+ headers?: Record<string, string>;
 
  /**
- * If set to true, header names won't be automatically normalized to 
- * lowercase. This allows for non-http-spec-compliant servers that might 
+ * If set to true, header names won't be automatically normalized to
+ * lowercase. This allows for non-http-spec-compliant servers that might
  * expect capitalized header names.
  */
  preserveHeaderCase?: boolean;
@@ -92,7 +92,7 @@ export interface HttpQueryOptions {
 export interface HttpConfig {
  http?: HttpQueryOptions;
  options?: any;
- headers?: any;
+ headers?: Record<string, string>;
  credentials?: any;
 }
 
@@ -173,7 +173,9 @@ export function selectHttpOptionsAndBodyInternal(
  };
  });
 
- options.headers = removeDuplicateHeaders(options.headers, http.preserveHeaderCase);
+ if (options.headers) {
+ options.headers = removeDuplicateHeaders(options.headers, http.preserveHeaderCase);
+ }
 
  //The body depends on the http options
  const { operationName, extensions, variables, query } = operation;
@@ -191,7 +193,7 @@ export function selectHttpOptionsAndBodyInternal(
 };
 
 // Remove potential duplicate header names, preserving last (by insertion order).
-// This is done to prevent unintentionally duplicating a header instead of 
+// This is done to prevent unintentionally duplicating a header instead of
 // overwriting it (See #8447 and #8449).
 function removeDuplicateHeaders(
  headers: Record<string, string>,
@@ -204,12 +206,12 @@ function removeDuplicateHeaders(
  Object.keys(Object(headers)).forEach(name => {
  normalizedHeaders[name.toLowerCase()] = headers[name];
  });
- return normalizedHeaders; 
+ return normalizedHeaders;
  }
 
  // If we are preserving the case, remove duplicates w/ normalization,
  // preserving the original name.
- // This allows for non-http-spec-compliant servers that expect intentionally 
+ // This allows for non-http-spec-compliant servers that expect intentionally
  // capitalized header names (See #6741).
  const headerData = Object.create(null);
  Object.keys(Object(headers)).forEach(name => {