mirror of
https://github.com/hanzoai/next.js.git
synced 2026-09-24 17:00:51 +00:00
Andrew ClarkandGitHub
b83e0f5843
Adds a regression test and a fix for a bug that sometimes happens when a prefetched route on the client becomes stale — the app would get stuck in a loading state. The problem was the condition I used to fallback to the non-PPR implementation, inside navigateReducer. It was too narrow, causing prefetched segments that contained dynamic holes to sometimes be treated as if they were complete. The net effect was that the dynamic data would never stream in, and the page would get stuck in a fallback state until the stale prefetch was eventually purged from the cache, or the user refreshed the page. The reason the mistake happened was, as an incremental step, I decided to fallback to the non-PPR implementation for any case where I hadn't yet implemented the equivalent functionality. I think still think this is a good strategy, despite the mistake, but I'm eager to get everything migrated to the new model as soon as possible. Closes NEXT-1920
48 lines
1.4 KiB
TypeScript
48 lines
1.4 KiB
TypeScript
import 'server-only'
|
|
|
|
import { unstable_noStore } from 'next/cache'
|
|
|
|
// NOTE: I've intentionally not yet moved these helpers into a shared module, to
|
|
// avoid early abstraction. I will if/when we start using them for other tests.
|
|
// They are based on the testing patterns we use all over the React codebase, so
|
|
// I'm reasonably confident in them.
|
|
const TEST_DATA_SERVICE_URL = process.env.TEST_DATA_SERVICE_URL
|
|
const ARTIFICIAL_DELAY = 3000
|
|
|
|
async function getTestData(key: string, isStatic: boolean): Promise<string> {
|
|
const searchParams = new URLSearchParams({
|
|
key,
|
|
})
|
|
if (!TEST_DATA_SERVICE_URL) {
|
|
// If environment variable is not set, resolve automatically after a delay.
|
|
// This is so you can run the test app locally without spinning up a
|
|
// data server.
|
|
await new Promise<void>((resolve) =>
|
|
setTimeout(() => resolve(), ARTIFICIAL_DELAY)
|
|
)
|
|
if (!isStatic) {
|
|
unstable_noStore()
|
|
}
|
|
return key
|
|
}
|
|
const response = await fetch(
|
|
TEST_DATA_SERVICE_URL + '?' + searchParams.toString(),
|
|
{
|
|
cache: isStatic ? 'force-cache' : 'no-store',
|
|
}
|
|
)
|
|
const text = await response.text()
|
|
if (response.status !== 200) {
|
|
throw new Error(text)
|
|
}
|
|
return text
|
|
}
|
|
|
|
export async function getStaticTestData(key: string): Promise<string> {
|
|
return getTestData(key, true)
|
|
}
|
|
|
|
export async function getDynamicTestData(key: string): Promise<string> {
|
|
return getTestData(key, false)
|
|
}
|