Skip to content

Commit

Permalink
Use addDependency to track metadata route file changes (#66714)
Browse files Browse the repository at this point in the history
Use `addDependency` to track the file path passed to
`next-metadata-route-loader`

NOTE: We cannot apply the `next-metadata-route-loader` directly to the
metatda convention source files, since the json file could be processed
by json loader (Related previous fix #62615)

Previously when we passed down the file path as argument to the loader,
which sort of breaking the caching of webpack as the actual resource
path is string, it's not tracked as a dependency. This change fixed the
bad caching issue of static metadata routes. Based on the above reason
we use `addDependency` here to track the dependency change

Closes NEXT-3521
Closes #65755
  • Loading branch information
huozhi committed Jun 11, 2024
1 parent 942e45a commit c16a3f9
Show file tree
Hide file tree
Showing 7 changed files with 73 additions and 2 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -22,6 +22,8 @@ const cacheHeader = {

type MetadataRouteLoaderOptions = {
page: string
// Using separate argument to avoid json being parsed and hit error
// x-ref: https://github.com/vercel/next.js/pull/62615
filePath: string
isDynamic: '1' | '0'
}
Expand Down Expand Up @@ -55,8 +57,8 @@ async function getStaticAssetRouteCode(
fileBaseName === 'favicon'
? 'public, max-age=0, must-revalidate'
: process.env.NODE_ENV !== 'production'
? cacheHeader.none
: cacheHeader.longCache
? cacheHeader.none
: cacheHeader.longCache
const code = `\
/* static asset route */
import { NextResponse } from 'next/server'
Expand Down Expand Up @@ -259,6 +261,7 @@ const nextMetadataRouterLoader: webpack.LoaderDefinitionFunction<MetadataRouteLo
async function () {
const { page, isDynamic, filePath } = this.getOptions()
const { name: fileBaseName } = getFilenameAndExtension(filePath)
this.addDependency(filePath)

let code = ''
if (isDynamic === '1') {
Expand Down
Binary file not shown.
Binary file not shown.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file not shown.
Original file line number Diff line number Diff line change
@@ -0,0 +1,52 @@
import { nextTestSetup } from 'e2e-utils'
import crypto from 'crypto'

function generateMD5(text: string) {
const hash = crypto.createHash('md5')
hash.update(text)
return hash.digest('hex')
}

describe('app dir - metadata static routes cache', () => {
const { next } = nextTestSetup({
files: __dirname,
skipStart: true,
})

it('should generate different content after replace the static metadata file', async () => {
await next.build()

const faviconBuildContent = await next.readFile(
'.next/server/app/favicon.ico.body'
)
const opengrpahImageBuildContent = await next.readFile(
'.next/server/app/opengraph-image.png.body'
)

const faviconMd5 = generateMD5(faviconBuildContent)
const opengraphImageMd5 = generateMD5(opengrpahImageBuildContent)

// Update favicon and opengraph image
const newFaviconContent = await next.readFile('app/favicon.ico.new')
await next.patchFile('app/favicon.ico', newFaviconContent)

const newOpengraphImageContent = await next.readFile(
'app/opengraph-image.png.new'
)
await next.patchFile('app/opengraph-image.png', newOpengraphImageContent)

await next.build()
const faviconBuildContentNew = await next.readFile(
'.next/server/app/favicon.ico.body'
)
const opengrpahImageBuildContentNew = await next.readFile(
'.next/server/app/opengraph-image.png.body'
)

const faviconMd5New = generateMD5(faviconBuildContentNew)
const opengraphImageMd5New = generateMD5(opengrpahImageBuildContentNew)

expect(faviconMd5).not.toBe(faviconMd5New)
expect(opengraphImageMd5).not.toBe(opengraphImageMd5New)
})
})
16 changes: 16 additions & 0 deletions test/turbopack-build-tests-manifest.json
Original file line number Diff line number Diff line change
Expand Up @@ -15480,6 +15480,22 @@
"pending": [],
"flakey": [],
"runtimeError": false
},
"test/production/typescript-basic/typechecking.test.ts": {
"passed": ["typechecking should typecheck"],
"failed": [],
"pending": [],
"flakey": [],
"runtimeError": false
},
"test/production/app-dir/metadata-static-route-cache/metadata-static-route-cache.test.ts": {
"passed": [],
"failed": [
"app dir - metadata static routes cache should generate different content after replace the static metadata file"
],
"pending": [],
"flakey": [],
"runtimeError": false
}
},
"rules": {
Expand Down

0 comments on commit c16a3f9

Please sign in to comment.