Fix basePath not being applied for GS(S)P data routes (#12200)

vercel · Apr 26, 2020 · 9b8a9de · 9b8a9de
1 parent 5d8968f
commit 9b8a9de
Show file tree

Hide file tree

Showing 6 changed files with 74 additions and 5 deletions.
diff --git a/packages/next/client/page-loader.js b/packages/next/client/page-loader.js
@@ -3,6 +3,7 @@ import mitt from '../next-server/lib/mitt'
 import { isDynamicRoute } from './../next-server/lib/router/utils/is-dynamic'
 import { getRouteMatcher } from './../next-server/lib/router/utils/route-matcher'
 import { getRouteRegex } from './../next-server/lib/router/utils/route-regex'
+import { delBasePath } from './../next-server/lib/router/router'
 
 function hasRel(rel, link) {
   try {
@@ -96,10 +97,12 @@ export default class PageLoader {
    * @param {string} asPath the URL as shown in browser (virtual path); used for dynamic routes
    */
   getDataHref(href, asPath) {
-    const getHrefForSlug = (/** @type string */ path) =>
-      `${this.assetPrefix}/_next/data/${this.buildId}${
+    const getHrefForSlug = (/** @type string */ path) => {
+      path = delBasePath(path)
+      return `${this.assetPrefix}/_next/data/${this.buildId}${
         path === '/' ? '/index' : path
       }.json`
+    }
 
     const { pathname: hrefPathname, query } = parse(href, true)
     const { pathname: asPathname } = parse(asPath)

diff --git a/packages/next/next-server/lib/router/router.ts b/packages/next/next-server/lib/router/router.ts
@@ -22,7 +22,7 @@ export function addBasePath(path: string): string {
   return path.indexOf(basePath) !== 0 ? basePath + path : path
 }
 
-function delBasePath(path: string): string {
+export function delBasePath(path: string): string {
   return path.indexOf(basePath) === 0
     ? path.substr(basePath.length) || '/'
     : path
@@ -91,8 +91,10 @@ function fetchNextData(
   function getResponse(): Promise<any> {
     return fetch(
       formatWithValidation({
-        // @ts-ignore __NEXT_DATA__
-        pathname: `/_next/data/${__NEXT_DATA__.buildId}${pathname}.json`,
+        pathname: addBasePath(
+          // @ts-ignore __NEXT_DATA__
+          `/_next/data/${__NEXT_DATA__.buildId}${delBasePath(pathname)}.json`
+        ),
         query,
       }),
       {

diff --git a/test/integration/basepath/pages/gsp.js b/test/integration/basepath/pages/gsp.js
@@ -0,0 +1,15 @@
+export const getStaticProps = () => {
+  return {
+    props: {
+      hello: 'world',
+      random: Math.random(),
+    },
+  }
+}
+
+export default props => (
+  <>
+    <h3 id="gsp">getStaticProps</h3>
+    <p id="props">{JSON.stringify(props)}</p>
+  </>
+)
diff --git a/test/integration/basepath/pages/gssp.js b/test/integration/basepath/pages/gssp.js
@@ -0,0 +1,15 @@
+export const getServerSideProps = () => {
+  return {
+    props: {
+      hello: 'world',
+      random: Math.random(),
+    },
+  }
+}
+
+export default props => (
+  <>
+    <h3 id="gssp">getServerSideProps</h3>
+    <p id="props">{JSON.stringify(props)}</p>
+  </>
+)
diff --git a/test/integration/basepath/pages/hello.js b/test/integration/basepath/pages/hello.js
@@ -8,6 +8,18 @@ export default () => (
         <h1>Hello World</h1>
       </a>
     </Link>
+    <br />
+    <Link href="/gsp">
+      <a id="gsp-link">
+        <h1>getStaticProps</h1>
+      </a>
+    </Link>
+    <br />
+    <Link href="/gssp">
+      <a id="gssp-link">
+        <h1>getServerSideProps</h1>
+      </a>
+    </Link>
     <div id="base-path">{useRouter().basePath}</div>
   </>
 )
diff --git a/test/integration/basepath/test/index.test.js b/test/integration/basepath/test/index.test.js
@@ -50,6 +50,28 @@ const runTests = (context, dev = false) => {
     }
   })
 
+  it('should fetch data for getStaticProps without reloading', async () => {
+    const browser = await webdriver(context.appPort, '/docs/hello')
+    await browser.eval('window.beforeNavigate = true')
+    await browser.elementByCss('#gsp-link').click()
+    await browser.waitForElementByCss('#gsp')
+    expect(await browser.eval('window.beforeNavigate')).toBe(true)
+
+    const props = JSON.parse(await browser.elementByCss('#props').text())
+    expect(props.hello).toBe('world')
+  })
+
+  it('should fetch data for getServerSideProps without reloading', async () => {
+    const browser = await webdriver(context.appPort, '/docs/hello')
+    await browser.eval('window.beforeNavigate = true')
+    await browser.elementByCss('#gsp-link').click()
+    await browser.waitForElementByCss('#gsp')
+    expect(await browser.eval('window.beforeNavigate')).toBe(true)
+
+    const props = JSON.parse(await browser.elementByCss('#props').text())
+    expect(props.hello).toBe('world')
+  })
+
   it('should have correct href for a link', async () => {
     const browser = await webdriver(context.appPort, '/docs/hello')
     const href = await browser.elementByCss('a').getAttribute('href')