Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix app render: escape segment value #42626 #42823

Merged
merged 7 commits into from Nov 18, 2022
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
8 changes: 7 additions & 1 deletion packages/next/server/app-render.tsx
Expand Up @@ -874,7 +874,13 @@ export async function renderToHTMLOrFlight(
}

const key = segmentParam.param
const value = pathParams[key]
let value = pathParams[key]

if (Array.isArray(value)) {
value = value.map((i) => encodeURIComponent(i))
} else if (typeof value === 'string') {
value = encodeURIComponent(value)
}

if (!value) {
// Handle case where optional catchall does not have a value, e.g. `/dashboard/[...slug]` when requesting `/dashboard`
Expand Down
12 changes: 12 additions & 0 deletions test/production/app-dir-prefetch-non-iso-url/app/[slug]/page.js
@@ -0,0 +1,12 @@
export default function Slug(props) {
return (
<>
<p id="page">/[slug]</p>
<p id="props">{JSON.stringify(props)}</p>
</>
)
}

export function generateStaticParams() {
return [{ slug: 'iso-url' }, { slug: 'кириллица' }]
}
7 changes: 7 additions & 0 deletions test/production/app-dir-prefetch-non-iso-url/app/layout.js
@@ -0,0 +1,7 @@
export default function Layout({ children }) {
return (
<html>
<body>{children}</body>
</html>
)
}
18 changes: 18 additions & 0 deletions test/production/app-dir-prefetch-non-iso-url/app/page.js
@@ -0,0 +1,18 @@
import Link from 'next/link'

export default function Page(props) {
return (
<>
<p id="page">index</p>
<p id="props">{JSON.stringify(props)}</p>
<Link href="/iso-url" id="to-iso">
/iso-url
</Link>
<br />
<Link href="/кириллица" id="to-non-iso">
/кириллица
</Link>
<br />
</>
)
}
48 changes: 48 additions & 0 deletions test/production/app-dir-prefetch-non-iso-url/index.test.ts
@@ -0,0 +1,48 @@
import { createNext, FileRef } from 'e2e-utils'
import { NextInstance } from 'test/lib/next-modes/base'
import { join } from 'path'
import { BrowserInterface } from '../../lib/browsers/base'
import webdriver from 'next-webdriver'
import { check } from 'next-test-utils'

describe('app-dir-prefetch-non-iso-url', () => {
let next: NextInstance

beforeAll(async () => {
next = await createNext({
files: {
'next.config.js': new FileRef(join(__dirname, 'next.config.js')),
app: new FileRef(join(__dirname, 'app')),
},
})
})
afterAll(() => next.destroy())

it('should go to iso url', async () => {
let browser: BrowserInterface

try {
browser = await webdriver(next.appPort, '/')
await browser.elementByCss('#to-iso').click()
await check(() => browser.elementByCss('#page').text(), '/[slug]')
} finally {
if (browser) {
await browser.close()
}
}
})

it('should go to non-iso url', async () => {
let browser: BrowserInterface

try {
browser = await webdriver(next.appPort, '/')
await browser.elementByCss('#to-non-iso').click()
await check(() => browser.elementByCss('#page').text(), '/[slug]')
} finally {
if (browser) {
await browser.close()
}
}
})
})
6 changes: 6 additions & 0 deletions test/production/app-dir-prefetch-non-iso-url/next.config.js
@@ -0,0 +1,6 @@
/** @type {import("next").NextConfig} */
const nextConfig = {
experimental: { appDir: true },
}

module.exports = nextConfig