first commit

2026-03-10 19:37:31 +03:30
commit 61f56f997c
27684 changed files with 2784175 additions and 0 deletions
--- a/test/development/app-hmr/fixtures/default-template/app/bundler-runtime-changes/new-runtime-functionality/page.tsx
+++ b/test/development/app-hmr/fixtures/default-template/app/bundler-runtime-changes/new-runtime-functionality/page.tsx
@@ -0,0 +1,8 @@
+'use client'
+// requires
+import * as React from 'react'
+
+export default function RuntimeChangesNewRuntimeFunctionalityPage() {
+  React.useEffect(() => {}, [])
+  return <div data-testid="new-runtime-functionality-page" />
+}
--- a/test/development/app-hmr/fixtures/default-template/app/bundler-runtime-changes/page.tsx
+++ b/test/development/app-hmr/fixtures/default-template/app/bundler-runtime-changes/page.tsx
@@ -0,0 +1,9 @@
+import Link from 'next/link'
+
+export default function RuntimeChangesPage() {
+  return (
+    <Link href="/bundler-runtime-changes/new-runtime-functionality">
+      Click me
+    </Link>
+  )
+}
--- a/test/development/app-hmr/fixtures/default-template/app/counter.js
+++ b/test/development/app-hmr/fixtures/default-template/app/counter.js
@@ -0,0 +1,16 @@
+'use client'
+
+import { useState } from 'react'
+
+export function Counter() {
+  const [count, setCount] = useState(0)
+
+  return (
+    <div>
+      <p id="counter-value">Count: {count}</p>
+      <button id="increment-button" onClick={() => setCount(count + 1)}>
+        Increment
+      </button>
+    </div>
+  )
+}
--- a/test/development/app-hmr/fixtures/default-template/app/env/edge-module-var/page.jsx
+++ b/test/development/app-hmr/fixtures/default-template/app/env/edge-module-var/page.jsx
@@ -0,0 +1,7 @@
+const MY_DEVICE = process.env.MY_DEVICE?.slice()
+
+export default function Page() {
+  return <p>{MY_DEVICE}</p>
+}
+
+export const runtime = 'edge'
--- a/test/development/app-hmr/fixtures/default-template/app/env/edge/page.jsx
+++ b/test/development/app-hmr/fixtures/default-template/app/env/edge/page.jsx
@@ -0,0 +1,5 @@
+export default function Page() {
+  return <p>{process.env.MY_DEVICE}</p>
+}
+
+export const runtime = 'edge'
--- a/test/development/app-hmr/fixtures/default-template/app/env/node-module-var/page.jsx
+++ b/test/development/app-hmr/fixtures/default-template/app/env/node-module-var/page.jsx
@@ -0,0 +1,5 @@
+const MY_DEVICE = process.env.MY_DEVICE?.slice()
+
+export default function Page() {
+  return <p>{MY_DEVICE}</p>
+}
--- a/test/development/app-hmr/fixtures/default-template/app/env/node/page.jsx
+++ b/test/development/app-hmr/fixtures/default-template/app/env/node/page.jsx
@@ -0,0 +1,3 @@
+export default function Page() {
+  return <p>{process.env.MY_DEVICE}</p>
+}
--- a/test/development/app-hmr/fixtures/default-template/app/favicon.ico
+++ b/test/development/app-hmr/fixtures/default-template/app/favicon.ico
--- a/test/development/app-hmr/fixtures/default-template/app/folder/page.jsx
+++ b/test/development/app-hmr/fixtures/default-template/app/folder/page.jsx
@@ -0,0 +1,3 @@
+export default function Page() {
+  return <h1>Hello</h1>
+}
--- a/test/development/app-hmr/fixtures/default-template/app/layout.jsx
+++ b/test/development/app-hmr/fixtures/default-template/app/layout.jsx
@@ -0,0 +1,7 @@
+export default function Root({ children }) {
+  return (
+    <html>
+      <body>{children}</body>
+    </html>
+  )
+}
--- a/test/development/app-hmr/fixtures/default-template/app/page.js
+++ b/test/development/app-hmr/fixtures/default-template/app/page.js
@@ -0,0 +1,10 @@
+import { Counter } from './counter'
+
+export default function Page() {
+  return (
+    <div>
+      <p>hello world</p>
+      <Counter />
+    </div>
+  )
+}
--- a/test/development/app-hmr/fixtures/default-template/next.config.js
+++ b/test/development/app-hmr/fixtures/default-template/next.config.js
@@ -0,0 +1,4 @@
+/**
+ * @type {import('next').NextConfig}
+ */
+module.exports = {}
--- a/test/development/app-hmr/hmr-env.test.ts
+++ b/test/development/app-hmr/hmr-env.test.ts
@@ -0,0 +1,33 @@
+import { FileRef, nextTestSetup } from 'e2e-utils'
+import { retry } from 'next-test-utils'
+import path from 'path'
+
+const envFile = '.env.development.local'
+
+describe(`app-dir hmr-env`, () => {
+  const { next } = nextTestSetup({
+    files: new FileRef(path.join(__dirname, 'fixtures', 'default-template')),
+    patchFileDelay: 1000,
+  })
+
+  it.each(['node', 'node-module-var', 'edge', 'edge-module-var'])(
+    'should update server components pages when env files is changed (%s)',
+    async (page) => {
+      const browser = await next.browser(`/env/${page}`)
+      expect(await browser.elementByCss('p').text()).toBe('mac')
+
+      await next.patchFile(envFile, 'MY_DEVICE="ipad"', async () => {
+        await retry(async () => {
+          expect(await browser.elementByCss('p').text()).toBe('ipad')
+        })
+      })
+
+      // ensure it's restored back to "mac" before the next test
+      await retry(async () => {
+        expect(await browser.elementByCss('p').text()).toBe('mac')
+      })
+
+      expect(next.cliOutput).not.toContain('FATAL')
+    }
+  )
+})
--- a/test/development/app-hmr/hmr.test.ts
+++ b/test/development/app-hmr/hmr.test.ts
@@ -0,0 +1,135 @@
+import { FileRef, nextTestSetup } from 'e2e-utils'
+import { retry, waitFor } from 'next-test-utils'
+import path from 'path'
+
+const envFile = '.env.development.local'
+
+describe(`app-dir-hmr`, () => {
+  const { next } = nextTestSetup({
+    files: new FileRef(path.join(__dirname, 'fixtures', 'default-template')),
+    patchFileDelay: 1000,
+  })
+
+  describe('filesystem changes', () => {
+    it('should not continously poll when hitting a not found page', async () => {
+      let requestCount = 0
+
+      const browser = await next.browser('/does-not-exist', {
+        beforePageLoad(page) {
+          page.on('request', (request) => {
+            const url = new URL(request.url())
+            if (url.pathname === '/does-not-exist') {
+              requestCount++
+            }
+          })
+        },
+      })
+      const body = await browser.elementByCss('body').text()
+      expect(body).toContain('404')
+
+      await waitFor(3000)
+
+      expect(requestCount).toBe(1)
+    })
+
+    it('should not break when renaming a folder', async () => {
+      const browser = await next.browser('/folder')
+      const text = await browser.elementByCss('h1').text()
+      expect(text).toBe('Hello')
+
+      // Rename folder
+      await next.renameFolder('app/folder', 'app/folder-renamed')
+
+      try {
+        // Should be 404 in a few seconds
+        await retry(async () => {
+          const body = await browser.elementByCss('body').text()
+          expect(body).toContain('404')
+        })
+
+        // The new page should be rendered
+        const newHTML = await next.render('/folder-renamed')
+        expect(newHTML).toContain('Hello')
+
+        expect(next.cliOutput).not.toContain('FATAL')
+      } finally {
+        // Rename it back
+        await next.renameFolder('app/folder-renamed', 'app/folder')
+      }
+    })
+
+    it('should update server components after navigating to a page with a different runtime', async () => {
+      const browser = await next.browser('/env/node')
+      expect(await browser.elementByCss('p').text()).toBe('mac')
+
+      await browser.loadPage(`${next.url}/env/edge`)
+      await browser.eval('window.__TEST_NO_RELOAD = true')
+      expect(await browser.elementByCss('p').text()).toBe('mac')
+
+      const getCliOutput = next.getCliOutputFromHere()
+      await next.patchFile(envFile, 'MY_DEVICE="ipad"', async () => {
+        await waitFor(() => getCliOutput().includes('Reload env'))
+
+        // use an extra-long timeout since the environment reload can be a
+        // little slow (especially on overloaded CI servers)
+        await retry(async () => {
+          expect(await browser.elementByCss('p').text()).toBe('ipad')
+        }, 5000 /* ms */)
+
+        expect(await browser.eval('window.__TEST_NO_RELOAD === true')).toBe(
+          true
+        )
+      })
+
+      // ensure it's restored back to "mac" before the next test
+      await retry(async () => {
+        expect(await browser.elementByCss('p').text()).toBe('mac')
+      })
+
+      expect(next.cliOutput).not.toContain('FATAL')
+    })
+
+    it('should have no unexpected action error for hmr', async () => {
+      expect(next.cliOutput).not.toContain('Unexpected action')
+    })
+
+    it('can navigate cleanly to a page that requires a change in the Webpack runtime', async () => {
+      // This isn't a very accurate test since the Webpack runtime is somewhat an implementation detail.
+      // To ensure this is still valid, check the `*/webpack.*.hot-update.js` network response content when the navigation is triggered.
+      // If there is new functionality added, the test is still valid.
+      // If not, the test doesn't cover anything new.
+      // TODO: Enforce console.error assertions or MPA navigation assertions in all tests instead.
+      const browser = await next.browser('/bundler-runtime-changes')
+      await browser.eval('window.__TEST_NO_RELOAD = true')
+
+      await browser
+        .elementByCss('a')
+        .click()
+        .waitForElementByCss('[data-testid="new-runtime-functionality-page"]', {
+          state: 'attached',
+        })
+
+      const logs = await browser.log()
+      // TODO: Should assert on all logs but these are cluttered with logs from our test utils (e.g. playwright tracing or webdriver)
+      expect(logs).toEqual(
+        expect.arrayContaining([
+          {
+            message: expect.stringContaining('[Fast Refresh] done in'),
+            source: 'log',
+          },
+        ])
+      )
+      expect(logs).not.toEqual(
+        expect.arrayContaining([
+          expect.objectContaining({
+            source: 'error',
+          }),
+        ])
+      )
+      // No MPA navigation triggered
+      expect(await browser.eval('window.__TEST_NO_RELOAD')).toEqual(true)
+
+      expect(next.cliOutput).not.toContain('FATAL')
+    })
+  })
+})
--- a/test/development/app-hmr/server-restart.test.ts
+++ b/test/development/app-hmr/server-restart.test.ts
@@ -0,0 +1,66 @@
+import { FileRef, nextTestSetup, createNext } from 'e2e-utils'
+import { retry, waitFor } from 'next-test-utils'
+import path from 'path'
+
+describe('app-dir server restart', () => {
+  const { next } = nextTestSetup({
+    files: new FileRef(path.join(__dirname, 'fixtures', 'default-template')),
+    patchFileDelay: 1000,
+  })
+
+  it('should reload the page when the server restarts', async () => {
+    const browser = await next.browser('/')
+    await retry(async () => {
+      expect(await browser.elementByCss('body').text()).toMatch(/hello world/)
+    })
+
+    // Verify the counter is at 0 initially
+    expect(await browser.elementById('counter-value').text()).toBe('Count: 0')
+
+    // Click increment button to change state
+    await browser.elementById('increment-button').click()
+    expect(await browser.elementById('counter-value').text()).toBe('Count: 1')
+
+    // Click again to make it 2
+    await browser.elementById('increment-button').click()
+    expect(await browser.elementById('counter-value').text()).toBe('Count: 2')
+
+    // Set up reload detection before stopping the server
+    let reloadPromise = new Promise((resolve) => {
+      browser.on('request', (req) => {
+        if (req.url().endsWith('/')) {
+          resolve(req.url())
+        }
+      })
+    })
+
+    const appPort = next.appPort
+    await next.destroy()
+
+    // Start a new server instance on the same port
+    const secondNext = await createNext({
+      files: new FileRef(path.join(__dirname, 'fixtures', 'default-template')),
+      env: next.env,
+      forcedPort: appPort,
+    })
+
+    // Wait for the new server to be ready
+    await waitFor(1000)
+
+    // Wait for the browser to reload
+    await reloadPromise
+
+    // Verify the page content is still available after reload
+    await retry(async () => {
+      expect(await browser.elementByCss('body').text()).toMatch(/hello world/)
+    })
+
+    // IMPORTANT: Verify the counter state is reset to 0 after reload
+    // This proves the page actually reloaded and didn't just reconnect
+    await retry(async () => {
+      expect(await browser.elementById('counter-value').text()).toBe('Count: 0')
+    })
+
+    await secondNext.destroy()
+  })
+})