Send Credentials for `getServerSideProps` Requests (#10826)

* Send Credentials for `getServerSideProps` Requests

* Fix tests

packages/next/next-server/lib/router/router.ts

@@ -83,7 +83,21 @@ function fetchNextData(
         // @ts-ignore __NEXT_DATA__
         pathname: `/_next/data/${__NEXT_DATA__.buildId}${pathname}.json`,
         query,
-      })
+      }),
+      {
+        // Cookies are required to be present for Next.js' SSG "Preview Mode".
+        // Cookies may also be required for `getServerSideProps`.
+        //
+        // > `fetch` won’t send cookies, unless you set the credentials init
+        // > option.
+        // https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch
+        //
+        // > For maximum browser compatibility when it comes to sending &
+        // > receiving cookies, always supply the `credentials: 'same-origin'`
+        // > option instead of relying on the default.
+        // https://github.com/github/fetch#caveats
+        credentials: 'same-origin',
+      }
     ).then(res => {
       if (!res.ok) {
         if (--attempts > 0 && res.status >= 500) {

test/integration/getserversideprops-preview/pages/to-index.js

+import Link from 'next/link'
+
+export function getServerSideProps() {
+  return { props: {} }
+}
+
+export default function() {
+  return (
+    <main>
+      <Link href="/">
+        <a id="to-index">To Index</a>
+      </Link>
+    </main>
+  )
+}

test/integration/getserversideprops-preview/test/index.test.js

@@ -165,7 +165,7 @@ function runTests(startServer = nextStart) {
     )
   })
 
-  it('should fetch preview data', async () => {
+  it('should fetch preview data on SSR', async () => {
     await browser.get(`http://localhost:${appPort}/`)
     await browser.waitForElementByCss('#props-pre')
     // expect(await browser.elementById('props-pre').text()).toBe('Has No Props')
@@ -175,6 +175,18 @@ function runTests(startServer = nextStart) {
     )
   })
 
+  it('should fetch preview data on CST', async () => {
+    await browser.get(`http://localhost:${appPort}/to-index`)
+    await browser.waitForElementByCss('#to-index')
+    await browser.eval('window.itdidnotrefresh = "hello"')
+    await browser.elementById('to-index').click()
+    await browser.waitForElementByCss('#props-pre')
+    expect(await browser.eval('window.itdidnotrefresh')).toBe('hello')
+    expect(await browser.elementById('props-pre').text()).toBe(
+      'true and {"client":"mode"}'
+    )
+  })
+
   it('should fetch prerendered data', async () => {
     await browser.get(`http://localhost:${appPort}/api/reset`)
 

test/integration/prerender-preview/pages/to-index.js

+import Link from 'next/link'
+
+export function getStaticProps() {
+  return { props: {} }
+}
+
+export default function() {
+  return (
+    <main>
+      <Link href="/">
+        <a id="to-index">To Index</a>
+      </Link>
+    </main>
+  )
+}

test/integration/prerender-preview/test/index.test.js

@@ -165,7 +165,7 @@ function runTests(startServer = nextStart) {
     )
   })
 
-  it('should fetch preview data', async () => {
+  it('should fetch preview data on SSR', async () => {
     await browser.get(`http://localhost:${appPort}/`)
     await browser.waitForElementByCss('#props-pre')
     // expect(await browser.elementById('props-pre').text()).toBe('Has No Props')
@@ -175,6 +175,18 @@ function runTests(startServer = nextStart) {
     )
   })
 
+  it('should fetch preview data on CST', async () => {
+    await browser.get(`http://localhost:${appPort}/to-index`)
+    await browser.waitForElementByCss('#to-index')
+    await browser.eval('window.itdidnotrefresh = "hello"')
+    await browser.elementById('to-index').click()
+    await browser.waitForElementByCss('#props-pre')
+    expect(await browser.eval('window.itdidnotrefresh')).toBe('hello')
+    expect(await browser.elementById('props-pre').text()).toBe(
+      'true and {"client":"mode"}'
+    )
+  })
+
   it('should fetch prerendered data', async () => {
     await browser.get(`http://localhost:${appPort}/api/reset`)