Simplify the test case

Author: unstubbable

test/development/app-dir/hmr-iframe/app/page1/page.tsx

@@ -1,7 +1,11 @@
 import { subscribeToHMR } from './subscribeToHMR'
 import { Component } from './Component'
 
-const RootPage = async ({ Component }: any) => {
+// The (unused) client component prop is crucial to reproduce the issue. It will
+// be serialized as a client reference in the props of this component, which
+// acts as the owner of the I/O inside subscribeToHMR, which is also serialized
+// as part of the async I/O sequence in page 2.
+const RootPage = async ({ Component }: { Component: React.ComponentType }) => {
   await subscribeToHMR()
 
   return (
@@ -13,6 +17,6 @@ const RootPage = async ({ Component }: any) => {
   )
 }
 
-export default function Page() {
+export default function Page1() {
   return <RootPage Component={Component} />
 }

test/development/app-dir/hmr-iframe/app/page1/subscribeToHMR.ts

@@ -1,54 +1,46 @@
-if (!global._payload) {
-  global._payload = {
-    payload: null,
+declare global {
+  var _testState: {
+    initialized: boolean
+    reload: boolean | Promise<void>
+  }
+}
+
+if (!globalThis._testState) {
+  globalThis._testState = {
+    initialized: false,
     reload: false,
-    ws: null,
   }
 }
 
 export const subscribeToHMR = async () => {
-  let cached = global._payload
-
-  if (cached.payload) {
-    if (cached.reload === true) {
-      let resolve: any
-
-      cached.reload = new Promise((res) => (resolve = res))
+  const state = globalThis._testState
 
+  if (state.initialized) {
+    if (state.reload === true) {
+      let resolve: () => void
+      state.reload = new Promise<void>((res) => (resolve = res))
       await new Promise((resolve) => setTimeout(resolve, 200))
-
       resolve()
     }
-    if (cached.reload instanceof Promise) {
-      await cached.reload
+
+    if (state.reload instanceof Promise) {
+      await state.reload
     }
 
-    return cached.payload
+    return
   }
 
-  cached.payload = {}
-
-  const port = process.env.PORT || '3000'
-  const hasHTTPS =
-    process.env.USE_HTTPS === 'true' ||
-    process.argv.includes('--experimental-https')
-  const protocol = hasHTTPS ? 'wss' : 'ws'
-  const path = '/_next/webpack-hmr'
-  // The __NEXT_ASSET_PREFIX env variable is set for both assetPrefix and basePath (tested in Next.js 15.1.6)
-  const prefix = process.env.__NEXT_ASSET_PREFIX ?? ''
-  cached.ws = new WebSocket(
-    process.env.PAYLOAD_HMR_URL_OVERRIDE ??
-      `${protocol}://localhost:${port}${prefix}${path}`
+  state.initialized = true
+
+  const ws = new WebSocket(
+    `ws://localhost:${process.env.PORT}/_next/webpack-hmr`
   )
-  cached.ws.onmessage = (event: any) => {
+
+  ws.onmessage = (event: any) => {
     if (typeof event.data === 'string') {
       const data = JSON.parse(event.data)
-      if (
-        // On Next.js 15, we need to check for data.action. On Next.js 16, we need to check for data.type.
-        data.type === 'serverComponentChanges' ||
-        data.action === 'serverComponentChanges'
-      ) {
-        cached.reload = true
+      if (data.type === 'serverComponentChanges') {
+        state.reload = true
       }
     }
   }

test/development/app-dir/hmr-iframe/app/page2/page.tsx

@@ -1,6 +1,6 @@
 import { subscribeToHMR } from '../page1/subscribeToHMR'
 
-export default async function Page() {
+export default async function Page2() {
   await subscribeToHMR()
 
   return (

test/development/app-dir/hmr-iframe/hmr-iframe.test.ts

@@ -15,6 +15,8 @@ describe('hmr-iframe', () => {
         .innerText()
     ).toEqual('content')
 
+    let cliOutputLength = next.cliOutput.length
+
     await next.patchFile('app/page2/page.tsx', (content) =>
       content.replace('content', 'content-new')
     )
@@ -26,8 +28,9 @@ describe('hmr-iframe', () => {
         .innerText()
     ).toEqual('content-new')
 
-    expect(next.cliOutput).not.toContain('Error')
-    expect(next.cliOutput).not.toContain('Could not find the module')
+    const cliOutput = next.cliOutput.slice(cliOutputLength)
+    expect(cliOutput).not.toContain('Error')
+    expect(cliOutput).not.toContain('Could not find the module')
 
     await next.stop()
     await next.clean()