1149cccd94
This adds a new client router filter for app paths and redirects so that we correctly hard navigate when a transition for one of this paths is encountered. This fixes the longstanding issue where redirects weren't applied on the client so a redirect that matches a dynamic route as well would transition to the dynamic route on client transition but not on direct visit. Similarly this ensures we hard navigate to app paths from pages even if a page dynamic route matches the path. The specific filter leveraged here is a bloom filter as we can tolerate some false matches (currently targeting an error rate of `2%`) as they just trigger a hard navigation which should be acceptable and this also avoids needing to send an entire manifest with the related paths. We can leverage a manifest for the generated SSG paths as well in a follow-up to fix `fallback: false` routes not being navigated correctly on client-transition in some cases as well. The filter is initially behind an `experimental.clientRouterFilter` flag in `next.config.js` although this is auto-enabled when leveraging app directory to ensure proper transitions. fixes NEXT-609 closes: https://github.com/vercel/next.js/pull/46235 x-ref: [slack thread](https://vercel.slack.com/archives/C035J346QQL/p1677028663246719) x-ref: https://github.com/vercel/next.js/issues/41344 x-ref: https://github.com/vercel/next.js/issues/40062 x-ref: https://github.com/vercel/next.js/issues/37889 x-ref: https://github.com/vercel/next.js/discussions/26426 x-ref: https://github.com/vercel/next.js/issues/35837 ## Bug - [x] Related issues linked using `fixes #number` - [x] Integration tests added - [ ] Errors have a helpful link attached, see [`contributing.md`](https://github.com/vercel/next.js/blob/canary/contributing.md)
102 lines
2.9 KiB
TypeScript
102 lines
2.9 KiB
TypeScript
import { createNext, FileRef } from 'e2e-utils'
|
|
import { NextInstance } from 'test/lib/next-modes/base'
|
|
import { fetchViaHTTP, renderViaHTTP } from 'next-test-utils'
|
|
import path from 'path'
|
|
import { promises as fs } from 'fs'
|
|
import { readJson } from 'fs-extra'
|
|
|
|
describe('Edge Compiler can import asset assets', () => {
|
|
let next: NextInstance
|
|
|
|
// TODO: remove after this is supported for deploy
|
|
if ((global as any).isNextDeploy) {
|
|
it('should skip for deploy for now', () => {})
|
|
return
|
|
}
|
|
|
|
beforeAll(async () => {
|
|
next = await createNext({
|
|
files: new FileRef(path.join(__dirname, './app')),
|
|
})
|
|
})
|
|
afterAll(() => next.destroy())
|
|
|
|
it('allows to fetch a remote URL', async () => {
|
|
const response = await fetchViaHTTP(next.url, '/api/edge', {
|
|
handler: 'remote-full',
|
|
})
|
|
expect(await response.text()).toContain('Example Domain')
|
|
})
|
|
|
|
it('allows to fetch a remote URL with a path and basename', async () => {
|
|
const response = await fetchViaHTTP(
|
|
next.url,
|
|
'/api/edge',
|
|
{
|
|
handler: 'remote-with-base',
|
|
},
|
|
{
|
|
compress: true,
|
|
}
|
|
)
|
|
expect(await response.text()).toContain('Example Domain')
|
|
})
|
|
|
|
it('allows to fetch text assets', async () => {
|
|
const html = await renderViaHTTP(next.url, '/api/edge', {
|
|
handler: 'text-file',
|
|
})
|
|
expect(html).toContain('Hello, from text-file.txt!')
|
|
})
|
|
|
|
it('allows to fetch image assets', async () => {
|
|
const response = await fetchViaHTTP(next.url, '/api/edge', {
|
|
handler: 'image-file',
|
|
})
|
|
const buffer: Buffer = await response.buffer()
|
|
const image = await fs.readFile(
|
|
path.join(__dirname, './app/src/vercel.png')
|
|
)
|
|
expect(buffer.equals(image)).toBeTrue()
|
|
})
|
|
|
|
it('allows to assets from node_modules', async () => {
|
|
const response = await fetchViaHTTP(next.url, '/api/edge', {
|
|
handler: 'from-node-module',
|
|
})
|
|
const json = await response.json()
|
|
expect(json).toEqual({
|
|
'i am': 'a node dependency',
|
|
})
|
|
})
|
|
|
|
it('extracts all the assets from the bundle', async () => {
|
|
const manifestPath = path.join(
|
|
next.testDir,
|
|
'.next/server/middleware-manifest.json'
|
|
)
|
|
const manifest = await readJson(manifestPath)
|
|
const orderedAssets = manifest.functions['/api/edge'].assets.sort(
|
|
(a, z) => {
|
|
return String(a.name).localeCompare(z.name)
|
|
}
|
|
)
|
|
|
|
expect(orderedAssets).toMatchObject([
|
|
{
|
|
name: expect.stringMatching(/^text-file\.[0-9a-f]{16}\.txt$/),
|
|
filePath: expect.stringMatching(
|
|
/^server\/edge-chunks\/asset_text-file/
|
|
),
|
|
},
|
|
{
|
|
name: expect.stringMatching(/^vercel\.[0-9a-f]{16}\.png$/),
|
|
filePath: expect.stringMatching(/^server\/edge-chunks\/asset_vercel/),
|
|
},
|
|
{
|
|
name: expect.stringMatching(/^world\.[0-9a-f]{16}\.json/),
|
|
filePath: expect.stringMatching(/^server\/edge-chunks\/asset_world/),
|
|
},
|
|
])
|
|
})
|
|
})
|