JakeChampion / fetch

A window.fetch JavaScript polyfill.

Home Page:http://github.github.io/fetch/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Inconsistent behavior for headers with native Fetch API

loderunner opened this issue · comments

According to the Fetch documentation on MDN, the headers property of the options parameter can be:

a Headers object or an object literal with String values.

However, according to an example for errors below, an array of arrays of strings can be accepted (provided the inner arrays are of length 2).

Invalid header value. The header object must contain exactly two elements.

const headers = [
  ['Content-Type', 'text/html', 'extra'],
  ['Accept'],
];
fetch('https://example.com/', { headers });

This header initializer option is supported by the Headers constructor parameter, which can be

a simple object literal with String values, an array of name-value pairs, where each pair is a 2-element string array; or an existing Headers object.


Testing in Chrome 109.0.5414.87, I found an inconsistency between what is supported by whatwg-fetch and what is supported by Chrome's native Fetch API.

  • Chrome Fetch:
    • Object
    • Array
    • Chrome Fetch Headers class
    • whatwg-fetch Headers class
  • whatwg-fetch:
    • Object
    • whatwg-fetch Headers class

I found the same results for:

  • Safari 16.0 (17614.1.25.9.10, 17614)
  • Firefox 108.0.2

My test bench for Headers support is here. cross-fetch is also tested, as it relies on whatwg-fetch in the browser, yields yet another behavior.