Networking: Preserve the content-type header when fetch()-ing (#2028)

Allows the use of arbitrary Content-type header when sending POST
requests from WordPress.

Playground fetch() network transport for `wp_safe_remote_*` calls
enforced the `Content-Type` header of
`application/x-www-form-urlencoding` when POST-ing. This PR turns that
value into a fallback that's only used if not explicit value is
provided.

Closes #1428

 ## Testing instructions

* CI unit tests
* Try the Blueprint URL below and confirm in devtools the content-type
header used was `text/plain`

```
http://localhost:5400/website-server/#{%22features%22:{%22networking%22:true},%22steps%22:[{%22step%22:%22writeFile%22,%22path%22:%22/wordpress/wp-content/mu-plugins/0-fetch-test.php%22,%22data%22:%22%3C?php%20add_action('init',%20function()%20{%20wp_safe_remote_post('https://api.w.org',array('headers'=%3E['Content-Type'=%3E'text/plain']));%20});%20%22}]}
```

---------

Co-authored-by: Brandon Payton <[email protected]>

Author: adamziel

packages/playground/remote/src/lib/setup-fetch-network-transport.ts

@@ -72,7 +72,12 @@ export async function handleRequest(data: RequestData, fetchFn = fetch) {
 	try {
 		const fetchMethod = data.method || 'GET';
 		const fetchHeaders = data.headers || {};
-		if (fetchMethod == 'POST') {
+
+		const hasContentTypeHeader = Object.keys(fetchHeaders).some(
+			(name) => name.toLowerCase() === "content-type"
+		);
+
+		if (fetchMethod == 'POST' && !hasContentTypeHeader) {
 			fetchHeaders['Content-Type'] = 'application/x-www-form-urlencoded';
 		}
 

packages/playground/remote/src/test/setup-fetch-network-transport.spec.ts

@@ -25,6 +25,36 @@ describe('handleRequest', () => {
 			`HTTP/1.1 200 OK\r\ncontent-type: text/html\r\n\r\nHello, world!`
 		);
 	});
+	it('Should preserve the Content-Type header when POSTing', async () => {
+		// eslint-disable-next-line @typescript-eslint/no-unused-vars
+		const fetchMock = vitest.fn(async (u: string, o: RequestInit) => {
+			return {
+				status: 200,
+				statusText: 'OK',
+				headers: new Headers({
+					'Content-type': 'text/html',
+				}),
+				arrayBuffer: async () => {
+					return new TextEncoder().encode('Hello, world!');
+				},
+			};
+		});
+		const response = await handleRequest(
+			{
+				url: 'https://playground.wordpress.net/',
+				headers: { 'Content-type': 'text/html' },
+				method: 'POST',
+			},
+			fetchMock as any
+		);
+		const headers = fetchMock.mock.calls[0][1]?.headers || {};
+		expect(headers).toEqual({
+			'Content-type': 'text/html',
+		});
+		expect(new TextDecoder().decode(response)).toBe(
+			`HTTP/1.1 200 OK\r\ncontent-type: text/html\r\n\r\nHello, world!`
+		);
+	});
 	it('Should reject responses with malicious headers trying to terminate the headers section early', async () => {
 		const fetchMock = vitest.fn(async () => {
 			return {