feat(edge): adds json() response helper (vercel#9081)

### 🔖 What's in there?

Because Typescript's `libdom` does not have [`static Response.json()`](microsoft/TypeScript-DOM-lib-generator#1444) (which modern browsers and edge runtimes are supporting), Typescript users can't use easily use it.

This helper fills the gap.

### 🧪 How to test?

It's covered with unit tests

packages/edge/docs/README.md

@@ -22,6 +22,7 @@
 
 - [geolocation](README.md#geolocation)
 - [ipAddress](README.md#ipaddress)
+- [json](README.md#json)
 - [next](README.md#next)
 - [rewrite](README.md#rewrite)
 
@@ -169,6 +170,49 @@ Returns the IP address of the request from the headers.
 
 ---
 
+### json
+
+▸ **json**(`data`, `init?`): `Response`
+
+Builds a response object from a serializable JavaScript object:
+
+- sets the 'Content-Type' response header to 'application/json'
+- sets the response body from provided data
+
+**`See`**
+
+[https://fetch.spec.whatwg.org/#dom-response-json](https://fetch.spec.whatwg.org/#dom-response-json)
+
+**`Example`**
+
+<caption>Building a JSON response</caption>
+
+```ts
+import { json } from '@vercel/edge';
+
+const response = json(
+  { notification: { success: true, content: 'worked' } },
+  { headers: { 'x-custom': '1' } }
+);
+```
+
+#### Parameters
+
+| Name    | Type           | Description                                             |
+| :------ | :------------- | :------------------------------------------------------ |
+| `data`  | `any`          | serialized data                                         |
+| `init?` | `ResponseInit` | optional custom response status, statusText and headers |
+
+#### Returns
+
+`Response`
+
+#### Defined in
+
+[src/response.ts:19](https://github.com/vercel/vercel/blob/main/packages/edge/src/response.ts#L19)
+
+---
+
 ### next
 
 ▸ **next**(`init?`): `Response`

packages/edge/src/index.ts

@@ -3,3 +3,4 @@ export * from './middleware-helpers';
 
 export type { Geo } from './edge-headers';
 export * from './edge-headers';
+export * from './response';

packages/edge/src/response.ts

@@ -0,0 +1,22 @@
+/**
+ * Builds a response object from a serializable JavaScript object:
+ * - sets the 'Content-Type' response header to 'application/json'
+ * - sets the response body from provided data
+ *
+ * @see {@link https://fetch.spec.whatwg.org/#dom-response-json}
+ * @param data serialized data
+ * @param init optional custom response status, statusText and headers
+ *
+ * @example
+ * <caption>Building a JSON response</caption>
+ *
+ * ```ts
+ * import { json } from '@vercel/edge';
+ *
+ * const response = json({ notification: { success: true, content: 'worked' } }, { headers: {'x-custom': '1' }})
+ * ```
+ */
+export function json(data: any, init?: ResponseInit): Response {
+  // @ts-expect-error This is not in lib/dom right now, and we can't augment it.
+  return Response.json(data, init);
+}

packages/edge/test/response.test.ts

@@ -0,0 +1,34 @@
+/**
+ * @jest-environment @edge-runtime/jest-environment
+ */
+
+import { json } from '../src/response';
+
+describe('json', () => {
+  it('returns a response with JSON content', async () => {
+    const content = { foo: 'bar' };
+    const response = json(content);
+    expect(response.headers.get('content-type')).toEqual('application/json');
+    expect(await response.json()).toEqual(content);
+  });
+
+  it('can set response init', async () => {
+    const content = { bar: 'baz' };
+    const status = 201;
+    const statusText = 'it is in';
+    const customHeader = 'x-custom';
+    const customHeaderValue = '1';
+    const response = json(content, {
+      status,
+      statusText,
+      headers: { [customHeader]: customHeaderValue },
+    });
+    expect(response).toMatchObject({
+      status,
+      statusText,
+    });
+    expect(response.headers.get('content-type')).toEqual('application/json');
+    expect(response.headers.get(customHeader)).toEqual(customHeaderValue);
+    expect(await response.json()).toEqual(content);
+  });
+});