add E2E tests for unstable_after

test/e2e/app-dir/next-after/app/[id]/dynamic/page.js

@@ -0,0 +1,27 @@
+import { unstable_after as after } from 'next/server'
+import { cache } from 'react'
+import { persistentLog } from '../../../utils/log'
+import { headers } from 'next/headers'
+
+const thing = cache(() => Symbol('cache me please'))
+
+export default function Index({ params }) {
+  const hostFromRender = headers().get('host')
+  const valueFromRender = thing()
+
+  after(() => {
+    const hostFromAfter = headers().get('host')
+    const valueFromAfter = thing()
+
+    persistentLog({
+      source: '[page] /[id]/dynamic',
+      value: params.id,
+      assertions: {
+        'cache() works in after()': valueFromRender === valueFromAfter,
+        'headers() works in after()': hostFromRender === hostFromAfter,
+      },
+    })
+  })
+
+  return <div>Page with after()</div>
+}

test/e2e/app-dir/next-after/app/[id]/layout.js

@@ -0,0 +1,9 @@
+import { unstable_after as after } from 'next/server'
+import { persistentLog } from '../../utils/log'
+
+export default function Layout({ children }) {
+  after(async () => {
+    persistentLog({ source: '[layout] /[id]' })
+  })
+  return <>{children}</>
+}

test/e2e/app-dir/next-after/app/[id]/setting-cookies/page.js

@@ -0,0 +1,28 @@
+import { unstable_after as after } from 'next/server'
+import { cookies } from 'next/headers'
+
+export default function Index() {
+  after(() => {
+    cookies().set('testCookie', 'after-render')
+  })
+  const action = async () => {
+    'use server'
+    cookies().set('testCookie', 'action')
+
+    after(() => {
+      cookies().set('testCookie', 'after-action')
+    })
+  }
+
+  return (
+    <div>
+      <h1>Page with after() that tries to set cookies</h1>
+      <div id="cookie">
+        Cookie: {JSON.stringify(cookies().get('testCookie')?.value ?? null)}
+      </div>
+      <form action={action}>
+        <button type="submit">Submit</button>
+      </form>
+    </div>
+  )
+}

test/e2e/app-dir/next-after/app/[id]/with-action/page.js

@@ -0,0 +1,38 @@
+import { unstable_after as after } from 'next/server'
+import { cache } from 'react'
+import { persistentLog } from '../../../utils/log'
+import { headers } from 'next/headers'
+
+const thing = cache(() => Symbol('cache me please'))
+
+export default function Index({ params }) {
+  const action = async () => {
+    'use server'
+
+    const hostFromAction = headers().get('host')
+    const valueFromAction = thing()
+
+    after(() => {
+      const valueFromAfter = thing()
+      const hostFromAfter = headers().get('host')
+
+      persistentLog({
+        source: '[action] /[id]/with-action',
+        value: params.id,
+        assertions: {
+          'cache() works in after()': valueFromAction === valueFromAfter,
+          'headers() works in after()': hostFromAction === hostFromAfter,
+        },
+      })
+    })
+  }
+
+  return (
+    <div>
+      <h1>Page with after() in an action</h1>
+      <form action={action}>
+        <button type="submit">Submit</button>
+      </form>
+    </div>
+  )
+}

test/e2e/app-dir/next-after/app/[id]/with-metadata/page.js

@@ -0,0 +1,18 @@
+import { unstable_after as after } from 'next/server'
+import { persistentLog } from '../../../utils/log'
+
+export function generateMetadata({ params }) {
+  after(() => {
+    persistentLog({
+      source: '[metadata] /[id]/with-metadata',
+      value: params.id,
+    })
+  })
+  return {
+    title: `With metadata: ${params.id}`,
+  }
+}
+
+export default function Page() {
+  return <div>With metadata</div>
+}

test/e2e/app-dir/next-after/app/delay/page.js

@@ -0,0 +1,30 @@
+import { Suspense } from 'react'
+import { unstable_after as after } from 'next/server'
+import { persistentLog } from '../../utils/log'
+
+export const dynamic = 'force-dynamic'
+
+export default async function Page() {
+  after(() => {
+    persistentLog({ source: '[page] /delay (Page)' })
+  })
+  return (
+    <Suspense fallback={'Loading...'}>
+      <Inner>Delay</Inner>
+    </Suspense>
+  )
+}
+
+async function Inner({ children }) {
+  after(() => {
+    persistentLog({ source: '[page] /delay (Inner)' })
+  })
+
+  // the test intercepts this to assert on whether the after() callbacks ran
+  // before and after we finish handling the request.
+  await fetch('https://example.test/delayed-request', {
+    signal: AbortSignal.timeout(10_000),
+  })
+
+  return <>{children}</>
+}

test/e2e/app-dir/next-after/app/interrupted/calls-not-found/page.js

@@ -0,0 +1,12 @@
+import { notFound } from 'next/navigation'
+import { unstable_after as after } from 'next/server'
+import { persistentLog } from '../../../utils/log'
+
+export default function Page() {
+  after(() => {
+    persistentLog({
+      source: '[page] /interrupted/calls-not-found',
+    })
+  })
+  notFound()
+}

test/e2e/app-dir/next-after/app/interrupted/calls-redirect/page.js

@@ -0,0 +1,12 @@
+import { redirect } from 'next/navigation'
+import { unstable_after as after } from 'next/server'
+import { persistentLog } from '../../../utils/log'
+
+export default function Page() {
+  after(() => {
+    persistentLog({
+      source: '[page] /interrupted/calls-redirect',
+    })
+  })
+  redirect('/interrupted/redirect-target')
+}

test/e2e/app-dir/next-after/app/interrupted/redirect-target/page.js

@@ -0,0 +1,11 @@
+import { unstable_after as after } from 'next/server'
+import { persistentLog } from '../../../utils/log'
+
+export default function Page() {
+  after(() => {
+    persistentLog({
+      source: '[page] /interrupted/redirect-target',
+    })
+  })
+  return <div>Redirect</div>
+}

test/e2e/app-dir/next-after/app/interrupted/throws-error/page.js

@@ -0,0 +1,11 @@
+import { unstable_after as after } from 'next/server'
+import { persistentLog } from '../../../utils/log'
+
+export default function Page() {
+  after(() => {
+    persistentLog({
+      source: '[page] /interrupted/throws-error',
+    })
+  })
+  throw new Error('User error')
+}

test/e2e/app-dir/next-after/app/layout.js

@@ -0,0 +1,10 @@
+export default function AppLayout({ children }) {
+  return (
+    <html>
+      <head>
+        <title>after</title>
+      </head>
+      <body>{children}</body>
+    </html>
+  )
+}

test/e2e/app-dir/next-after/app/middleware/redirect/page.js

@@ -0,0 +1,3 @@
+export default function Page() {
+  return <div>Redirect</div>
+}

test/e2e/app-dir/next-after/app/route/route.js

@@ -0,0 +1,13 @@
+import { unstable_after as after } from 'next/server'
+import { persistentLog } from '../../utils/log'
+
+export const dynamic = 'force-dynamic'
+
+export async function GET() {
+  const data = { message: 'Hello, world!' }
+  after(() => {
+    persistentLog({ source: '[route handler] /route' })
+  })
+
+  return Response.json({ data })
+}

test/e2e/app-dir/next-after/app/static/page.js

@@ -0,0 +1,12 @@
+import { unstable_after as after } from 'next/server'
+import { persistentLog } from '../../utils/log'
+
+// (patched in tests)
+// export const dynamic = 'REPLACE_ME'
+
+export default function Index() {
+  after(async () => {
+    persistentLog({ source: '[page] /static' })
+  })
+  return <div>Page with after()</div>
+}