rayan/next.js
1
0
Fork 0
Code Issues Pull Requests Actions 12 Packages Projects Releases Wiki Activity

first commit
Some checks failed
Test examples / Test Examples (20) (push) Has been cancelled
Details
Test examples / Test Examples (22) (push) Has been cancelled
Details
Lock Threads / action (push) Has been cancelled
Details
Trigger Release / start (push) Has been cancelled
Details
Stale issue handler / stale (push) Has been cancelled
Details
Update Font Data / create-pull-request (push) Has been cancelled
Details
build-and-deploy / deploy-target (push) Has been cancelled
Details
build-and-deploy / build (push) Has been cancelled
Details
build-and-deploy / stable - aarch64-unknown-linux-musl - node@16 (push) Has been cancelled
Details
build-and-deploy / stable - x86_64-unknown-linux-musl - node@16 (push) Has been cancelled
Details
build-and-deploy / stable - aarch64-unknown-linux-gnu - node@16 (push) Has been cancelled
Details
build-and-deploy / stable - x86_64-unknown-linux-gnu - node@16 (push) Has been cancelled
Details
build-and-deploy / stable - aarch64-pc-windows-msvc - node@16 (push) Has been cancelled
Details
build-and-deploy / stable - x86_64-pc-windows-msvc - node@16 (push) Has been cancelled
Details
build-and-deploy / stable - aarch64-apple-darwin - node@16 (push) Has been cancelled
Details
build-and-deploy / stable - x86_64-apple-darwin - node@16 (push) Has been cancelled
Details
build-and-deploy / build-wasm (nodejs) (push) Has been cancelled
Details
build-and-deploy / build-wasm (web) (push) Has been cancelled
Details
build-and-deploy / Deploy preview tarball (push) Has been cancelled
Details
build-and-deploy / Potentially publish release (push) Has been cancelled
Details
build-and-deploy / publish-turbopack-npm-packages (push) Has been cancelled
Details
build-and-deploy / Deploy examples (push) Has been cancelled
Details
build-and-deploy / thank you, build (push) Has been cancelled
Details
build-and-deploy / Upload Turbopack Bytesize metrics to Datadog (push) Has been cancelled
Details
Rspack Next.js development integration tests / Rspack integration tests (push) Has been cancelled
Details
Rspack Next.js production integration tests / Rspack integration tests (push) Has been cancelled
Details
Turbopack Next.js development integration tests / Next.js integration tests (push) Has been cancelled
Details
Turbopack Next.js production integration tests / Next.js integration tests (push) Has been cancelled
Details
Update Rspack test manifest / Update and upload Rspack development test manifest (push) Has been cancelled
Details
Update Rspack test manifest / Update and upload Rspack production test manifest (push) Has been cancelled
Details
Upload bundler test manifests to areweturboyet.com / Upload test results (push) Has been cancelled
Details
Update React / create-pull-request (push) Has been cancelled
Details
test-e2e-project-reset-cron / reset-test-project (push) Has been cancelled
Details
Notify about the top 15 issues/PRs/feature requests (most reacted) in the last 90 days / run (push) Has been cancelled
Details

Browse Source
This commit is contained in:
Arian Tron
2026-03-10 19:37:31 +03:30
commit 61f56f997c
27684 changed files with 2784175 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
test/e2e/app-dir/segment-cache/prefetch-layout-sharing/app/layout.tsx Normal file
View File

@@ -0,0 +1,23 @@
import Link from 'next/link'
import { ReactNode } from 'react'
export default function RootLayout({ children }: { children: ReactNode }) {
return (
<html>
<body style={{ fontFamily: 'monospace' }}>
<Header />
{children}
</body>
</html>
)
}
function Header() {
return (
<header>
<Link href="/" prefetch={false}>
Home
</Link>
</header>
)
}

50
test/e2e/app-dir/segment-cache/prefetch-layout-sharing/app/page.tsx Normal file
View File

@@ -0,0 +1,50 @@
import { DebugLinkAccordion } from '../components/link-accordion'
import { cacheLife } from 'next/cache'
export default async function Page() {
'use cache'
cacheLife('minutes')
return (
<main>
<h2>shared layout prefetching - layout with cookies and dynamic data</h2>
<ul>
<li>
<DebugLinkAccordion href="/shared-layout/one" prefetch={true} />
</li>
</ul>
<ul>
<li>
<DebugLinkAccordion href="/shared-layout/two" prefetch={'auto'} />
</li>
<li>
<DebugLinkAccordion href="/shared-layout/two" prefetch={true} />
</li>
</ul>
<h2>shared layout prefetching - layout with cookies</h2>
<ul>
<li>
<DebugLinkAccordion
href="/runtime-prefetchable-layout/one"
prefetch={true}
/>
</li>
<li>
<DebugLinkAccordion
href="/runtime-prefetchable-layout/two"
prefetch={'auto'}
/>
</li>
</ul>
<h2>shared layout prefetching - segment config</h2>
<ul>
<li>
This link deliberately doesn't specify a `prefetch` prop, because the
page has a segment-level prefetch config:
<br />
<DebugLinkAccordion href="/segment-config/runtime-prefetchable" />
</li>
</ul>
</main>
)
}

34
test/e2e/app-dir/segment-cache/prefetch-layout-sharing/app/runtime-prefetchable-layout/layout.tsx Normal file
View File

@@ -0,0 +1,34 @@
import { cookies } from 'next/headers'
import { Suspense } from 'react'
import { cachedDelay, DebugRenderKind } from '../shared'
export default async function Layout({ children }) {
return (
<main>
<div>
<h2>Shared layout</h2>
<DebugRenderKind />
<p id="shared-layout-description">
This shared layout uses cookies and no uncached IO, so it should be
completely runtime-prefetchable.
</p>
<Suspense fallback={<div style={{ color: 'grey' }}>Loading 1...</div>}>
<RuntimePrefetchable />
</Suspense>
</div>
<hr />
{children}
</main>
)
}
async function RuntimePrefetchable() {
const cookieStore = await cookies()
const cookieValue = cookieStore.get('testCookie')?.value ?? null
await cachedDelay([__filename, cookieValue])
return (
<div style={{ border: '1px solid blue', padding: '1em' }}>
<div id="cookie-value-layout">{`Cookie from layout: ${cookieValue}`}</div>
</div>
)
}

34
test/e2e/app-dir/segment-cache/prefetch-layout-sharing/app/runtime-prefetchable-layout/one/page.tsx Normal file
View File

@@ -0,0 +1,34 @@
import { Suspense } from 'react'
import { cachedDelay } from '../../shared'
import { cookies } from 'next/headers'
export default function Page() {
return (
<main>
<h1 style={{ color: 'yellow' }}>Page one</h1>
<Suspense fallback={<div style={{ color: 'grey' }}>Loading 1...</div>}>
<RuntimePrefetchable />
</Suspense>
</main>
)
}
async function RuntimePrefetchable() {
const cookieStore = await cookies()
const cookieValue = cookieStore.get('testCookie')?.value ?? null
await cachedDelay([__filename, cookieValue])
return (
<div style={{ border: '1px solid blue', padding: '1em' }}>
<div id="cookie-value-page">{`Cookie from page: ${cookieValue}`}</div>
{/*
TODO: a runtime-prefetched layout that had no holes itself will still be considered partial
if any other segment in the response is partial, because we don't track partiality per-segment,
so if we want to test that full prefetches can reuse layouts from runtime prefetches,
the whole page needs to be dynamically prerenderable.
*/}
{/* <Suspense fallback={<div style={{ color: 'grey' }}>Loading 2...</div>}>
<Dynamic />
</Suspense> */}
</div>
)
}

37
test/e2e/app-dir/segment-cache/prefetch-layout-sharing/app/runtime-prefetchable-layout/two/page.tsx Normal file
View File

@@ -0,0 +1,37 @@
import { Suspense } from 'react'
import { cachedDelay, uncachedIO } from '../../shared'
import { cookies } from 'next/headers'
export default function Page() {
return (
<main>
<h1 style={{ color: 'green' }}>Page two</h1>
<Suspense fallback={<div style={{ color: 'grey' }}>Loading 1...</div>}>
<RuntimePrefetchable />
</Suspense>
</main>
)
}
async function RuntimePrefetchable() {
const cookieStore = await cookies()
const cookieValue = cookieStore.get('testCookie')?.value ?? null
await cachedDelay([__filename, cookieValue])
return (
<div style={{ border: '1px solid blue', padding: '1em' }}>
<div id="cookie-value-page">{`Cookie from page: ${cookieValue}`}</div>
<Suspense fallback={<div style={{ color: 'grey' }}>Loading 2...</div>}>
<Dynamic />
</Suspense>
</div>
)
}
async function Dynamic() {
await uncachedIO()
return (
<div style={{ border: '1px solid tomato', padding: '1em' }}>
<div id="dynamic-content-page">Dynamic content from page two</div>
</div>
)
}

39
test/e2e/app-dir/segment-cache/prefetch-layout-sharing/app/segment-config/runtime-prefetchable/configured-as-runtime/layout.tsx Normal file
View File

@@ -0,0 +1,39 @@
import { cookies } from 'next/headers'
import { Suspense } from 'react'
import { DebugRenderKind } from '../../../shared'
// No `export const unstable_instant = ...` is needed, we default to static
export default async function SubLayout({ children }) {
return (
<main>
<div>
<h3>Sub-layout</h3>
<DebugRenderKind />
<p id="static-content-sub-layout">
This sub-layout uses cookies, but did not specify that it should be
runtime prefetchable, so it should be prefetched statically by
default.
</p>
<Suspense
fallback={
<div id="runtime-prefetchable-fallback-sub-layout">Loading ...</div>
}
>
<RuntimePrefetchable />
</Suspense>
</div>
<hr />
{children}
</main>
)
}
async function RuntimePrefetchable() {
await cookies()
return (
<div id="runtime-prefetchable-content-sub-layout">
Runtime-prefetchable content from sub-layout
</div>
)
}

40
test/e2e/app-dir/segment-cache/prefetch-layout-sharing/app/segment-config/runtime-prefetchable/configured-as-runtime/page.tsx Normal file
View File

@@ -0,0 +1,40 @@
import { cookies } from 'next/headers'
import { Suspense } from 'react'
export const unstable_instant = {
prefetch: 'runtime',
samples: [{ cookies: [] }],
}
export default function Page() {
return (
<main>
<h1 style={{ color: 'green' }}>
A runtime-prefetchable child of a runtime-prefetchable layout
</h1>
<p id="static-content-page">
This page has two relevant parent layouts:
<br />
1. A runtime-prefetchable shared layout layout.
<br />
2. A statically-prefetchable sub-layout not shared with other pages.
<br />
<br />
We should use a runtime prefetch for it without any overrides on Link,
but its sub-layout should be prefetched statically.
</p>
<Suspense fallback="Loading...">
<RuntimePrefetchable />
</Suspense>
</main>
)
}
async function RuntimePrefetchable() {
await cookies()
return (
<div id="runtime-prefetchable-content-page">
Runtime-prefetchable content from page
</div>
)
}

41
test/e2e/app-dir/segment-cache/prefetch-layout-sharing/app/segment-config/runtime-prefetchable/configured-as-static/page.tsx Normal file
View File

@@ -0,0 +1,41 @@
import { cookies } from 'next/headers'
import { connection } from 'next/server'
import { Suspense } from 'react'
// Technically, no `export const unstable_instant = ...` is needed, because we default to static,
// this is just to make sure that we excercise the codepaths for it
export const unstable_instant = {
prefetch: 'static',
}
export default function Page() {
return (
<main>
<h1 style={{ color: 'green' }}>Statically prefetchable</h1>
<p id="static-content-page">
This page is a child of a runtime-prefetchable layout that is not
configured as runtime-prefetchable. We should not use a runtime prefetch
for it.
</p>
<Suspense fallback="Loading...">
<RuntimePrefetchable />
</Suspense>
<Suspense fallback="Loading...">
<DynamicContent />
</Suspense>
</main>
)
}
async function RuntimePrefetchable() {
await cookies()
return (
<div id="runtime-prefetchable-content-page">
Runtime-prefetchable content from page
</div>
)
}
async function DynamicContent() {
await connection()
return <div id="dynamic-content-page">Dynamic Content from page</div>
}

13
test/e2e/app-dir/segment-cache/prefetch-layout-sharing/app/segment-config/runtime-prefetchable/fully-static/page.tsx Normal file
View File

@@ -0,0 +1,13 @@
// No `export const unstable_instant = ...` is needed, we default to static
export default function Page() {
return (
<main>
<h1 style={{ color: 'green' }}>Fully statically prefetchable</h1>
<p id="static-content-page">
This page is a statically-prefetchable child of a runtime-prefetchable
layout. We should not use a runtime prefetch for it.
</p>
</main>
)
}

36
test/e2e/app-dir/segment-cache/prefetch-layout-sharing/app/segment-config/runtime-prefetchable/layout.tsx Normal file
View File

@@ -0,0 +1,36 @@
import { cookies } from 'next/headers'
import { Suspense } from 'react'
import { DebugRenderKind } from '../../shared'
export const unstable_instant = {
prefetch: 'runtime',
samples: [{ cookies: [] }],
}
export default async function Layout({ children }) {
return (
<main>
<div>
<h2>Shared layout</h2>
<DebugRenderKind />
<p id="static-content-layout">
This shared layout uses cookies and no uncached IO, so it should be
completely runtime-prefetchable.
</p>
<Suspense fallback="Loading ...">
<RuntimePrefetchable />
</Suspense>
</div>
<hr />
{children}
</main>
)
}
async function RuntimePrefetchable() {
await cookies()
return (
<div id="runtime-prefetchable-content-layout">
Runtime-prefetchable content from shared layout
</div>
)
}

57
test/e2e/app-dir/segment-cache/prefetch-layout-sharing/app/segment-config/runtime-prefetchable/page.tsx Normal file
View File

@@ -0,0 +1,57 @@
import { cookies } from 'next/headers'
import { DebugLinkAccordion } from '../../../components/link-accordion'
import { Suspense } from 'react'
// No `export const unstable_instant = ...` is needed, we default to static
// (but see page description for more on the actual behavior)
export default function Page() {
return (
<main>
<h1>Child of a runtime prefetchable layout</h1>
<div>
<p>
When this page is prefetched from outside of the{' '}
<code>/segment-config/runtime-prefetchable</code> segment, the page
contents will be runtime-prefetched (despite this segment not being
marked as runtime-prefetchable) because the parent layout is marked as
runtime-prefetchable.
</p>
<Suspense fallback="Loading...">
<RuntimePrefetchable />
</Suspense>
</div>
<ul>
<li>
A page that shares some layouts with this page, and should use a
static prefetch:
<br />
<DebugLinkAccordion href="/segment-config/runtime-prefetchable/configured-as-static" />
</li>
<li>
A page that shares some layouts with this page, and should use a
runtime prefetch:
<br />
<DebugLinkAccordion href="/segment-config/runtime-prefetchable/configured-as-runtime" />
</li>
<li>
A page that shares some layouts with this page, and has a fully static
page segment
<br />
<DebugLinkAccordion href="/segment-config/runtime-prefetchable/fully-static" />
</li>
</ul>
</main>
)
}
async function RuntimePrefetchable() {
await cookies()
return (
<div id="runtime-prefetchable-content-page">
Runtime-prefetchable content from page
</div>
)
}

48
test/e2e/app-dir/segment-cache/prefetch-layout-sharing/app/shared-layout/layout.tsx Normal file
View File

@@ -0,0 +1,48 @@
import { cookies } from 'next/headers'
import { Suspense } from 'react'
import { cachedDelay, DebugRenderKind, uncachedIO } from '../shared'
import { connection } from 'next/server'
export default async function Layout({ children }) {
return (
<main>
<div>
<h2>Shared layout</h2>
<DebugRenderKind />
<p id="shared-layout-description">
This shared layout uses cookies and some uncached IO, so parts of it
should be runtime-prefetchable.
</p>
<Suspense fallback={<div style={{ color: 'grey' }}>Loading 1...</div>}>
<RuntimePrefetchable />
</Suspense>
</div>
<hr />
{children}
</main>
)
}
async function RuntimePrefetchable() {
const cookieStore = await cookies()
const cookieValue = cookieStore.get('testCookie')?.value ?? null
await cachedDelay([__filename, cookieValue])
return (
<div style={{ border: '1px solid blue', padding: '1em' }}>
<div id="cookie-value-layout">{`Cookie from layout: ${cookieValue}`}</div>
<Suspense fallback={<div style={{ color: 'grey' }}>Loading 2...</div>}>
<Dynamic />
</Suspense>
</div>
)
}
async function Dynamic() {
await uncachedIO()
await connection()
return (
<div style={{ border: '1px solid tomato', padding: '1em' }}>
<div id="dynamic-content-layout">Dynamic content from layout</div>
</div>
)
}

37
test/e2e/app-dir/segment-cache/prefetch-layout-sharing/app/shared-layout/one/page.tsx Normal file
View File

@@ -0,0 +1,37 @@
import { Suspense } from 'react'
import { cachedDelay, uncachedIO } from '../../shared'
import { cookies } from 'next/headers'
export default function Page() {
return (
<main>
<h1 style={{ color: 'yellow' }}>Page one</h1>
<Suspense fallback={<div style={{ color: 'grey' }}>Loading 1...</div>}>
<RuntimePrefetchable />
</Suspense>
</main>
)
}
async function RuntimePrefetchable() {
const cookieStore = await cookies()
const cookieValue = cookieStore.get('testCookie')?.value ?? null
await cachedDelay([__filename, cookieValue])
return (
<div style={{ border: '1px solid blue', padding: '1em' }}>
<div id="cookie-value-page">{`Cookie from page: ${cookieValue}`}</div>
<Suspense fallback={<div style={{ color: 'grey' }}>Loading 2...</div>}>
<Dynamic />
</Suspense>
</div>
)
}
async function Dynamic() {
await uncachedIO()
return (
<div style={{ border: '1px solid tomato', padding: '1em' }}>
<div id="dynamic-content-page">Dynamic content from page one</div>
</div>
)
}

37
test/e2e/app-dir/segment-cache/prefetch-layout-sharing/app/shared-layout/two/page.tsx Normal file
View File

@@ -0,0 +1,37 @@
import { Suspense } from 'react'
import { cachedDelay, uncachedIO } from '../../shared'
import { cookies } from 'next/headers'
export default function Page() {
return (
<main>
<h1 style={{ color: 'green' }}>Page two</h1>
<Suspense fallback={<div style={{ color: 'grey' }}>Loading 1...</div>}>
<RuntimePrefetchable />
</Suspense>
</main>
)
}
async function RuntimePrefetchable() {
const cookieStore = await cookies()
const cookieValue = cookieStore.get('testCookie')?.value ?? null
await cachedDelay([__filename, cookieValue])
return (
<div style={{ border: '1px solid blue', padding: '1em' }}>
<div id="cookie-value-page">{`Cookie from page: ${cookieValue}`}</div>
<Suspense fallback={<div style={{ color: 'grey' }}>Loading 2...</div>}>
<Dynamic />
</Suspense>
</div>
)
}
async function Dynamic() {
await uncachedIO()
return (
<div style={{ border: '1px solid tomato', padding: '1em' }}>
<div id="dynamic-content-page">Dynamic content from page two</div>
</div>
)
}

33
test/e2e/app-dir/segment-cache/prefetch-layout-sharing/app/shared.tsx Normal file
View File

@@ -0,0 +1,33 @@
import { cacheLife } from 'next/cache'
import { setTimeout } from 'timers/promises'
export async function uncachedIO() {
await setTimeout(0)
}
export async function cachedDelay(key: any) {
'use cache'
cacheLife('minutes')
await setTimeout(1)
}
export function DebugRenderKind() {
const { workUnitAsyncStorage } =
require('next/dist/server/app-render/work-unit-async-storage.external') as typeof import('next/dist/server/app-render/work-unit-async-storage.external')
const workUnitStore = workUnitAsyncStorage.getStore()!
return (
<div>
workUnitStore.type: {workUnitStore.type}
{(() => {
switch (workUnitStore.type) {
case 'prerender':
return '(static prefetch)'
case 'prerender-runtime':
return '(runtime prefetch)'
default:
return null
}
})()}
</div>
)
}