From 38c3e832ad8093f61f7c2a73311b50ea8b28bf61 Mon Sep 17 00:00:00 2001
From: JJ Kasper <jj@jjsweb.site>
Date: Fri, 25 Oct 2024 09:34:41 -0700
Subject: [PATCH] Add test for fetch with auth in use cache (#71768)

This ensures we are properly caching fetch inside of use cache even if
it uses `Authorzation` and comes after cookies() access.
---
 .../app/cache-fetch-auth-header/page.tsx      | 25 +++++++++++++++++++
 test/e2e/app-dir/use-cache/use-cache.test.ts  |  9 +++++++
 2 files changed, 34 insertions(+)
 create mode 100644 test/e2e/app-dir/use-cache/app/cache-fetch-auth-header/page.tsx

diff --git a/test/e2e/app-dir/use-cache/app/cache-fetch-auth-header/page.tsx b/test/e2e/app-dir/use-cache/app/cache-fetch-auth-header/page.tsx
new file mode 100644
index 0000000000000..9a39705e8c835
--- /dev/null
+++ b/test/e2e/app-dir/use-cache/app/cache-fetch-auth-header/page.tsx
@@ -0,0 +1,25 @@
+import { cookies } from 'next/headers'
+import React from 'react'
+
+async function getData() {
+  'use cache'
+
+  return fetch('https://next-data-api-endpoint.vercel.app/api/random', {
+    headers: {
+      Authorization: `Bearer ${process.env.MY_TOKEN}`,
+    },
+  }).then((res) => res.text())
+}
+
+export default async function Page() {
+  const myCookies = await cookies()
+  const id = myCookies.get('id')?.value
+
+  return (
+    <>
+      <p>index page</p>
+      <p id="random">{await getData()}</p>
+      <p id="my-id">{id || ''}</p>
+    </>
+  )
+}
diff --git a/test/e2e/app-dir/use-cache/use-cache.test.ts b/test/e2e/app-dir/use-cache/use-cache.test.ts
index 68f9e3de002e6..ee20c6fcb3ed0 100644
--- a/test/e2e/app-dir/use-cache/use-cache.test.ts
+++ b/test/e2e/app-dir/use-cache/use-cache.test.ts
@@ -275,4 +275,13 @@ describe('use-cache', () => {
 
     expect(await browser.elementByCss('#random').text()).toBe(initialValue)
   })
+
+  it('should override fetch with cookies/auth in use cache properly', async () => {
+    const browser = await next.browser('/cache-fetch-auth-header')
+
+    const initialValue = await browser.elementByCss('#random').text()
+    await browser.refresh()
+
+    expect(await browser.elementByCss('#random').text()).toBe(initialValue)
+  })
 })