feat: source and transform data routes from prerenderManifest

orinokai · orinokai · commit a40925f712c3 · 2023-03-14T14:58:02.000Z
diff --git a/packages/runtime/src/templates/handlerUtils.test.ts b/packages/runtime/src/templates/handlerUtils.test.ts
@@ -1,52 +1,41 @@
-import { getPathsForRoute, localizeRoute } from './handlerUtils'
+import { removeTrailingSlash, ensureLocalePrefix } from './handlerUtils'
 
-describe('getPathsForRoute', () => {
-  it('transforms / (root level) data routes to /index', () => {
-    expect(getPathsForRoute('/', 'buildId')).toContainEqual(expect.stringMatching(/index.json/))
+describe('removeTrailingSlash', () => {
+  it('removes a trailing slash from a string', () => {
+    expect(removeTrailingSlash('/foo/')).toEqual('/foo')
   })
-  it('removes the trailing slash from data routes', () => {
-    expect(getPathsForRoute('/foo/', 'buildId')).toContainEqual(expect.stringMatching(/foo.json$/))
+  it('ignores a string without a trailing slash', () => {
+    expect(removeTrailingSlash('/foo')).toEqual('/foo')
   })
-  it('respects the trailing slash for rsc routes', () => {
-    expect(getPathsForRoute('/foo', 'buildId')).toContainEqual(expect.stringMatching(/foo.rsc$/))
-    expect(getPathsForRoute('/foo/', 'buildId')).toContainEqual(expect.stringMatching(/foo.rsc\/$/))
+  it('does not remove a slash on its own', () => {
+    expect(removeTrailingSlash('/')).toEqual('/')
   })
 })
 
-describe('localizeRoute', () => {
-  it('returns a non-localized path for the default locale', () => {
+describe('ensureLocalePrefix', () => {
+  it('adds default locale prefix if missing', () => {
     expect(
-      localizeRoute('/foo', {
+      ensureLocalePrefix('/foo', {
         defaultLocale: 'en',
         locales: ['en', 'fr', 'de'],
       }),
-    ).toContain('/foo')
+    ).toEqual('/en/foo')
   })
-  it('returns a localized path for each non-default locale', () => {
+  it('skips prefixing if locale is present', () => {
     expect(
-      localizeRoute('/foo', {
+      ensureLocalePrefix('/fr/foo', {
         defaultLocale: 'en',
         locales: ['en', 'fr', 'de'],
       }),
-    ).toEqual(expect.arrayContaining(['/fr/foo', '/de/foo']))
-  })
-  it('returns every locale for data routes', () => {
+    ).toEqual('/fr/foo')
     expect(
-      localizeRoute(
-        '/foo',
-        {
-          defaultLocale: 'en',
-          locales: ['en', 'fr', 'de'],
-        },
-        true,
-      ),
-    ).toEqual([
-      expect.stringMatching(/\/en\/foo/),
-      expect.stringMatching(/\/fr\/foo/),
-      expect.stringMatching(/\/de\/foo/),
-    ])
+      ensureLocalePrefix('/en/foo', {
+        defaultLocale: 'en',
+        locales: ['en', 'fr', 'de'],
+      }),
+    ).toEqual('/en/foo')
   })
   it('skips localization if i18n not configured', () => {
-    expect(localizeRoute('/foo')).toEqual(['/foo'])
+    expect(ensureLocalePrefix('/foo')).toEqual('/foo')
   })
 })
diff --git a/packages/runtime/src/templates/handlerUtils.ts b/packages/runtime/src/templates/handlerUtils.ts
@@ -271,42 +271,56 @@ export const netlifyApiFetch = <T>({
   })
 
 /**
- * Get all paths related to a route including data, i18n and rsc routes
+ * Remove trailing slash from a route (but not the root route)
  */
-export const getPathsForRoute = (
+export const removeTrailingSlash = (route: string): string => (route.endsWith('/') ? route.slice(0, -1) || '/' : route)
+
+/**
+ * Normalize a data route to include the build ID and index suffix
+ *
+ * @param route The route to normalize
+ * @param buildId The Next.js build ID
+ * @param i18n The i18n config from next.config.js
+ * @returns The normalized route
+ * @example
+ * normalizeDataRoute('/_next/data/en.json', 'dev', { defaultLocale: 'en', locales: ['en', 'fr'] }) // '/_next/data/dev/en/index.json'
+ */
+export const normalizeDataRoute = (
   route: string,
   buildId: string,
   i18n?: {
     defaultLocale: string
     locales: string[]
   },
-): string[] => {
-  const routes = []
-  // static files
-  routes.push(...localizeRoute(route, i18n))
-  // data routes
-  routes.push(
-    ...localizeRoute(route.endsWith('/') ? route.slice(0, -1) || '/index' : route, i18n, true).map(
-      (localizeRoute) => `/_next/data/${buildId}${localizeRoute}.json`,
-    ),
-  )
-  // rsc routes
-  routes.push(route.endsWith('/') ? `${route.slice(0, -1) || '/index'}.rsc/` : `${route}.rsc`)
-  return routes
+): string => {
+  if (route.endsWith('.rsc')) return route
+  const withBuildId = route.replace(/^\/_next\/data\//, `/_next/data/${buildId}/`)
+  return i18n && i18n.locales.some((locale) => withBuildId.endsWith(`${buildId}/${locale}.json`))
+    ? withBuildId.replace(/\.json$/, '/index.json')
+    : withBuildId
 }
 
 /**
- * Localize a route based on i18n config
- * (don't localize if i18n is not configured or if the route is the default locale and not a data route)
+ * Ensure that a route has a locale prefix
+ *
+ * @param route The route to ensure has a locale prefix
+ * @param i18n The i18n config from next.config.js
+ * @returns The route with a locale prefix
+ * @example
+ * ensureLocalePrefix('/', { defaultLocale: 'en', locales: ['en', 'fr'] }) // '/en'
+ * ensureLocalePrefix('/foo', { defaultLocale: 'en', locales: ['en', 'fr'] }) // '/en/foo'
+ * ensureLocalePrefix('/en/foo', { defaultLocale: 'en', locales: ['en', 'fr'] }) // '/en/foo'
  */
-export const localizeRoute = (
+export const ensureLocalePrefix = (
   route: string,
   i18n?: {
     defaultLocale: string
     locales: string[]
   },
-  data = false,
-): string[] =>
+): string =>
   i18n
-    ? i18n.locales.map((locale) => (locale === i18n.defaultLocale && data === false ? route : `/${locale}${route}`))
-    : [route]
+    ? // eslint-disable-next-line unicorn/no-nested-ternary
+      i18n.locales.some((locale) => route === `/${locale}` || route.startsWith(`/${locale}/`))
+      ? route
+      : `/${i18n.defaultLocale}${route === '/' ? '' : route}`
+    : route
diff --git a/packages/runtime/src/templates/server.test.ts b/packages/runtime/src/templates/server.test.ts
@@ -14,10 +14,39 @@ jest.mock('./handlerUtils', () => {
 })
 const mockedApiFetch = netlifyApiFetch as jest.MockedFunction<typeof netlifyApiFetch>
 
+jest.mock(
+  'prerender-manifest.json',
+  () => ({
+    routes: {
+      '/en/getStaticProps/with-revalidate': {
+        dataRoute: '/_next/data/en/getStaticProps/with-revalidate.json',
+      },
+    },
+    dynamicRoutes: {
+      '/blog/[author]/[slug]': {
+        routeRegex: '^/blog/([^/]+?)/([^/]+?)(?:/)?$',
+        dataRoute: '/blog/[author]/[slug].rsc',
+      },
+    },
+  }),
+  { virtual: true },
+)
+
 beforeAll(() => {
   const NextServer: NextServerType = getNextServer()
   jest.spyOn(NextServer.prototype, 'getRequestHandler').mockImplementation(() => () => Promise.resolve())
-  Object.setPrototypeOf(NetlifyNextServer, jest.fn())
+
+  const MockNetlifyNextServerConstructor = function () {
+    this.distDir = '.'
+    this.buildId = 'build-id'
+    this.nextConfig = {
+      i18n: {
+        defaultLocale: 'en',
+        locales: ['en', 'fr', 'de'],
+      },
+    }
+  }
+  Object.setPrototypeOf(NetlifyNextServer, MockNetlifyNextServerConstructor)
 })
 
 describe('the netlify next server', () => {
@@ -36,21 +65,78 @@ describe('the netlify next server', () => {
     expect(response).toBe(undefined)
   })
 
-  it('throws an error when invalid paths are revalidated', async () => {
+  it('matches a normalized static route to find the data route', async () => {
+    const netlifyNextServer = new NetlifyNextServer({ conf: {} }, {})
+    const requestHandler = netlifyNextServer.getRequestHandler()
+
+    const { req: mockReq, res: mockRes } = mockRequest(
+      '/getStaticProps/with-revalidate/',
+      { 'x-prerender-revalidate': 'test' },
+      'GET',
+    )
+    await requestHandler(mockReq, mockRes)
+
+    expect(mockedApiFetch).toHaveBeenCalledWith(
+      expect.objectContaining({
+        payload: expect.objectContaining({
+          paths: ['/getStaticProps/with-revalidate/', '/_next/data/build-id/en/getStaticProps/with-revalidate.json'],
+        }),
+      }),
+    )
+  })
+
+  it('matches a normalized dynamic route to find the data', async () => {
+    const netlifyNextServer = new NetlifyNextServer({ conf: {} }, {})
+    const requestHandler = netlifyNextServer.getRequestHandler()
+
+    const { req: mockReq, res: mockRes } = mockRequest('/blog/rob/hello', { 'x-prerender-revalidate': 'test' }, 'GET')
+    await requestHandler(mockReq, mockRes)
+
+    expect(mockedApiFetch).toHaveBeenCalledWith(
+      expect.objectContaining({
+        payload: expect.objectContaining({
+          paths: ['/blog/rob/hello', '/blog/rob/hello.rsc'],
+        }),
+      }),
+    )
+  })
+
+  it('throws an error when route is not found in the manifest', async () => {
     const netlifyNextServer = new NetlifyNextServer({ conf: {} }, {})
     const requestHandler = netlifyNextServer.getRequestHandler()
 
-    const { req: mockReq, res: mockRes } = mockRequest('/not-a-path/', { 'x-prerender-revalidate': 'test' }, 'GET')
+    const { req: mockReq, res: mockRes } = mockRequest(
+      '/not-a-valid-path/',
+      { 'x-prerender-revalidate': 'test' },
+      'GET',
+    )
 
-    mockedApiFetch.mockResolvedValueOnce({ code: 404, message: 'Invalid paths' })
-    await expect(requestHandler(mockReq, mockRes)).rejects.toThrow('Invalid paths')
+    await expect(requestHandler(mockReq, mockRes)).rejects.toThrow('could not find a route')
+  })
+
+  it('throws an error when paths are not found by the API', async () => {
+    const netlifyNextServer = new NetlifyNextServer({ conf: {} }, {})
+    const requestHandler = netlifyNextServer.getRequestHandler()
+
+    const { req: mockReq, res: mockRes } = mockRequest(
+      '/getStaticProps/with-revalidate/',
+      { 'x-prerender-revalidate': 'test' },
+      'GET',
+    )
+
+    mockedApiFetch.mockResolvedValueOnce({ code: 500, message: 'Failed to revalidate' })
+    await expect(requestHandler(mockReq, mockRes)).rejects.toThrow('Failed to revalidate')
   })
 
   it('throws an error when the revalidate API is unreachable', async () => {
     const netlifyNextServer = new NetlifyNextServer({ conf: {} }, {})
     const requestHandler = netlifyNextServer.getRequestHandler()
 
-    const { req: mockReq, res: mockRes } = mockRequest('', { 'x-prerender-revalidate': 'test' }, 'GET')
+    const { req: mockReq, res: mockRes } = mockRequest(
+      '/getStaticProps/with-revalidate/',
+      { 'x-prerender-revalidate': 'test' },
+      'GET',
+    )
 
     mockedApiFetch.mockRejectedValueOnce(new Error('Unable to connect'))
     await expect(requestHandler(mockReq, mockRes)).rejects.toThrow('Unable to connect')
diff --git a/packages/runtime/src/templates/server.ts b/packages/runtime/src/templates/server.ts
@@ -1,6 +1,13 @@
 import { NodeRequestHandler, Options } from 'next/dist/server/next-server'
 
-import { netlifyApiFetch, getNextServer, NextServerType, getPathsForRoute } from './handlerUtils'
+import {
+  netlifyApiFetch,
+  getNextServer,
+  NextServerType,
+  removeTrailingSlash,
+  ensureLocalePrefix,
+  normalizeDataRoute,
+} from './handlerUtils'
 
 const NextServer: NextServerType = getNextServer()
 
@@ -19,12 +26,16 @@ class NetlifyNextServer extends NextServer {
   public getRequestHandler(): NodeRequestHandler {
     const handler = super.getRequestHandler()
     return async (req, res, parsedUrl) => {
-      if (req.headers['x-prerender-revalidate']) {
-        // handle on-demand revalidation by purging the ODB cache
-        await this.netlifyRevalidate(req.url)
-      }
+      // preserve the URL before Next.js mutates it for i18n
+      const originalUrl = req.url
+
       // handle the original res.revalidate() request
-      return handler(req, res, parsedUrl)
+      await handler(req, res, parsedUrl)
+
+      // handle on-demand revalidation by purging the ODB cache
+      if (res.statusCode === 200 && req.headers['x-prerender-revalidate']) {
+        await this.netlifyRevalidate(originalUrl)
+      }
     }
   }
 
@@ -34,20 +45,55 @@ class NetlifyNextServer extends NextServer {
       const result = await netlifyApiFetch<{ ok: boolean; code: number; message: string }>({
         endpoint: `sites/${process.env.SITE_ID}/refresh_on_demand_builders`,
         payload: {
-          paths: getPathsForRoute(route, this.buildId, this.nextConfig?.i18n),
+          paths: this.getNetlifyPathsForRoute(route),
           domain: this.hostname,
         },
         token: this.netlifyOptions.revalidateToken,
         method: 'POST',
       })
-      if (result.ok !== true) {
+      if (!result.ok) {
         throw new Error(result.message)
       }
     } catch (error) {
-      console.log('Error revalidating', error.message)
+      console.log(`Error revalidating ${route}:`, error.message)
       throw error
     }
   }
+
+  private getNetlifyPathsForRoute(route: string): string[] {
+    const { routes, dynamicRoutes } = this.getPrerenderManifest()
+
+    // matches static appDir and non-i18n routes
+    const normalizedRoute = removeTrailingSlash(route)
+    if (normalizedRoute in routes) {
+      const dataRoute = normalizeDataRoute(routes[normalizedRoute].dataRoute, this.buildId)
+      return [route, dataRoute]
+    }
+
+    // matches static pageDir i18n routes
+    const localizedRoute = ensureLocalePrefix(normalizedRoute, this.nextConfig?.i18n)
+    if (localizedRoute in routes) {
+      const dataRoute = normalizeDataRoute(routes[localizedRoute].dataRoute, this.buildId, this.nextConfig?.i18n)
+      return [route, dataRoute]
+    }
+
+    // matches dynamic routes
+    for (const dynamicRoute in dynamicRoutes) {
+      const matches = normalizedRoute.match(dynamicRoutes[dynamicRoute].routeRegex)
+      if (matches && matches.length !== 0) {
+        // remove the first match, which is the full route
+        matches.shift()
+        // replace the dynamic segments with the actual values
+        const dataRoute = normalizeDataRoute(
+          dynamicRoutes[dynamicRoute].dataRoute.replace(/\[(.*?)]/g, () => matches.shift()),
+          this.buildId,
+        )
+        return [route, dataRoute]
+      }
+    }
+
+    throw new Error(`could not find a route to revalidate`)
+  }
 }
 
 export { NetlifyNextServer }
