Fix Nested Index Dynamic Routes in Development (#10595)
* Fix Nested Index Dynamic Routes in Development * add missing
This commit is contained in:
parent
72a461f913
commit
a30e94f21a
5 changed files with 88 additions and 7 deletions
|
@ -140,6 +140,10 @@ export default class DevServer extends Server {
|
|||
return
|
||||
}
|
||||
|
||||
const regexPageExtension = new RegExp(
|
||||
`\\.+(?:${this.nextConfig.pageExtensions.join('|')})$`
|
||||
)
|
||||
|
||||
let resolved = false
|
||||
return new Promise(resolve => {
|
||||
const pagesDir = this.pagesDir
|
||||
|
@ -163,18 +167,13 @@ export default class DevServer extends Server {
|
|||
const dynamicRoutedPages = []
|
||||
const knownFiles = wp.getTimeInfoEntries()
|
||||
for (const [fileName, { accuracy }] of knownFiles) {
|
||||
if (accuracy === undefined) {
|
||||
if (accuracy === undefined || !regexPageExtension.test(fileName)) {
|
||||
continue
|
||||
}
|
||||
|
||||
let pageName =
|
||||
'/' + relative(pagesDir!, fileName).replace(/\\+/g, '/')
|
||||
|
||||
pageName = pageName.replace(
|
||||
new RegExp(`\\.+(?:${this.nextConfig.pageExtensions.join('|')})$`),
|
||||
''
|
||||
)
|
||||
|
||||
pageName = pageName.replace(regexPageExtension, '')
|
||||
pageName = pageName.replace(/\/index$/, '') || '/'
|
||||
|
||||
if (!isDynamicRoute(pageName)) {
|
||||
|
|
|
@ -44,6 +44,18 @@ const Page = () => (
|
|||
<Link href="/p1/p2/all-ssg/[...rest]" as="/p1/p2/all-ssg/hello1/hello2">
|
||||
<a id="ssg-catch-all-multi">Catch-all route (multi)</a>
|
||||
</Link>
|
||||
<Link
|
||||
href="/p1/p2/nested-all-ssg/[...rest]"
|
||||
as="/p1/p2/nested-all-ssg/hello"
|
||||
>
|
||||
<a id="nested-ssg-catch-all-single">Nested Catch-all route (single)</a>
|
||||
</Link>
|
||||
<Link
|
||||
href="/p1/p2/nested-all-ssg/[...rest]"
|
||||
as="/p1/p2/nested-all-ssg/hello1/hello2"
|
||||
>
|
||||
<a id="nested-ssg-catch-all-multi">Nested Catch-all route (multi)</a>
|
||||
</Link>
|
||||
</div>
|
||||
)
|
||||
|
||||
|
|
|
@ -0,0 +1,15 @@
|
|||
import styles from './styles.module.css'
|
||||
|
||||
function All({ params }) {
|
||||
return (
|
||||
<div id="nested-all-ssg-content" className={styles.test}>
|
||||
{JSON.stringify(params)}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export function unstable_getStaticProps({ params }) {
|
||||
return { props: { params } }
|
||||
}
|
||||
|
||||
export default All
|
|
@ -0,0 +1,3 @@
|
|||
.test {
|
||||
color: red;
|
||||
}
|
|
@ -257,6 +257,24 @@ function runTests(dev) {
|
|||
})
|
||||
})
|
||||
|
||||
it('[nested ssg: catch all] should pass param in getStaticProps during SSR', async () => {
|
||||
const data = await renderViaHTTP(
|
||||
appPort,
|
||||
`/_next/data/${buildId}/p1/p2/nested-all-ssg/test1.json`
|
||||
)
|
||||
expect(JSON.parse(data).pageProps.params).toEqual({ rest: ['test1'] })
|
||||
})
|
||||
|
||||
it('[nested ssg: catch all] should pass params in getStaticProps during SSR', async () => {
|
||||
const data = await renderViaHTTP(
|
||||
appPort,
|
||||
`/_next/data/${buildId}/p1/p2/nested-all-ssg/test1/test2.json`
|
||||
)
|
||||
expect(JSON.parse(data).pageProps.params).toEqual({
|
||||
rest: ['test1', 'test2'],
|
||||
})
|
||||
})
|
||||
|
||||
it('[predefined ssg: catch all] should pass param in getStaticProps during SSR', async () => {
|
||||
const data = await renderViaHTTP(
|
||||
appPort,
|
||||
|
@ -321,6 +339,34 @@ function runTests(dev) {
|
|||
}
|
||||
})
|
||||
|
||||
it('[nested ssg: catch-all] should pass params in getStaticProps during client navigation (single)', async () => {
|
||||
let browser
|
||||
try {
|
||||
browser = await webdriver(appPort, '/')
|
||||
await browser.elementByCss('#nested-ssg-catch-all-single').click()
|
||||
await browser.waitForElementByCss('#nested-all-ssg-content')
|
||||
|
||||
const text = await browser.elementByCss('#nested-all-ssg-content').text()
|
||||
expect(text).toBe('{"rest":["hello"]}')
|
||||
} finally {
|
||||
if (browser) await browser.close()
|
||||
}
|
||||
})
|
||||
|
||||
it('[nested ssg: catch-all] should pass params in getStaticProps during client navigation (multi)', async () => {
|
||||
let browser
|
||||
try {
|
||||
browser = await webdriver(appPort, '/')
|
||||
await browser.elementByCss('#nested-ssg-catch-all-multi').click()
|
||||
await browser.waitForElementByCss('#nested-all-ssg-content')
|
||||
|
||||
const text = await browser.elementByCss('#nested-all-ssg-content').text()
|
||||
expect(text).toBe('{"rest":["hello1","hello2"]}')
|
||||
} finally {
|
||||
if (browser) await browser.close()
|
||||
}
|
||||
})
|
||||
|
||||
it('should update dynamic values on mount', async () => {
|
||||
const html = await renderViaHTTP(appPort, '/on-mount/post-1')
|
||||
expect(html).toMatch(/onmpost:.*pending/)
|
||||
|
@ -465,6 +511,12 @@ function runTests(dev) {
|
|||
page: '/p1/p2/all-ssr/[...rest]',
|
||||
regex: normalizeRegEx('^\\/p1\\/p2\\/all\\-ssr\\/(.+?)(?:\\/)?$'),
|
||||
},
|
||||
{
|
||||
page: '/p1/p2/nested-all-ssg/[...rest]',
|
||||
regex: normalizeRegEx(
|
||||
'^\\/p1\\/p2\\/nested\\-all\\-ssg\\/(.+?)(?:\\/)?$'
|
||||
),
|
||||
},
|
||||
{
|
||||
page: '/p1/p2/predefined-ssg/[...rest]',
|
||||
regex: normalizeRegEx(
|
||||
|
|
Loading…
Reference in a new issue