PR #88241: fix(devtools): prevent infinite console error loop

• Repository: vercel/next.js
• Author: hooperits
• State: open | merged: False
• Link: https://github.com/vercel/next.js/pull/88241

Description (problem / solution / changelog)

Summary

Fixes #88234

This PR adds a re-entrancy guard to prevent the infinite console error loop that occurs in Next.js 16.1.1 when DevTools are open.

Problem

When DevTools are open in the browser, the console floods with TypeError: _interop_require_wildcard._ is not a function errors at approximately 3 errors/second. This makes development unusable.

Root Cause: When handleConsoleError() or forwardErrorLog() in the patched console.error throws an error, it triggers another console.error call, which is also patched, creating infinite recursion.

Solution

Add a simple re-entrancy guard pattern to intercept-console-error.ts:

let isHandlingError = false

// Inside patched console.error:
if (isHandlingError) {
  originConsoleError.apply(window.console, args)
  return
}

isHandlingError = true
try {
  // ... existing implementation
} catch (e) {
  originConsoleError.apply(window.console, args)
} finally {
  isHandlingError = false
}

Changes

• packages/next/src/next-devtools/userspace/app/errors/intercept-console-error.ts: Added re-entrancy guard (~15 lines)
• test/e2e/devtools-error-loop/: New e2e test suite with 3 tests

Test Plan

• No infinite error loop when DevTools are open
• Legitimate errors still display correctly (exactly once)
• Fix remains stable through page reloads
• TypeScript types pass
• ESLint passes

How to Test

1. Clone this branch
2. pnpm install && pnpm build
3. Create a Next.js app with npx create-next-app@canary
4. Link the built Next.js: npm link /path/to/next.js/packages/next
5. Run npm run dev and open browser DevTools
6. Observe: no error flooding in console

Or run the e2e tests:

pnpm test-dev-turbo test/e2e/devtools-error-loop/devtools-error-loop.test.ts

Changed files

• packages/next/src/next-devtools/userspace/app/errors/intercept-console-error.ts (modified, +40/-21)
• test/e2e/devtools-error-loop/app/error-page/page.tsx (added, +23/-0)
• test/e2e/devtools-error-loop/app/layout.tsx (added, +11/-0)
• test/e2e/devtools-error-loop/app/page.tsx (added, +11/-0)
• test/e2e/devtools-error-loop/devtools-error-loop.test.ts (added, +109/-0)
• test/e2e/devtools-error-loop/next.config.js (added, +1/-0)

PR #88418: test: add regression test for console.error infinite loop

• Repository: vercel/next.js
• Author: timneutkens
• State: closed | merged: False
• Link: https://github.com/vercel/next.js/pull/88418

Description (problem / solution / changelog)

What?

Adds a regression test suite for the console.error infinite loop bug reported in #88234.

Why?

Issue #88234 reports that Next.js DevTools can cause an infinite console error loop when an internal error occurs in the intercept-console-error.js handler. This test suite helps ensure the console.error handling doesn't cause infinite loops.

How?

Added a new test suite at test/development/app-dir/console-error-loop/ with 6 test cases:

1. Internal error handling - Tests behavior when console.error handler throws internally
2. Basic error logging - Tests single console.error calls don't loop
3. Non-Error objects - Tests handling of strings, objects, null/undefined args
4. Rapid consecutive errors - Tests 10 rapid console.errors stay bounded
5. Suspense errors - Tests console.error during React Suspense
6. DevTools handler - Tests actual Next.js DevTools handler with complex/malformed args

The tests detect infinite loops by counting console.error invocations and failing if the count exceeds reasonable bounds.

Fixes #88234

Changed files

• test/development/app-dir/console-error-loop/app/devtools-error/page.tsx (added, +84/-0)
• test/development/app-dir/console-error-loop/app/internal-error/page.tsx (added, +71/-0)
• test/development/app-dir/console-error-loop/app/layout.tsx (added, +12/-0)
• test/development/app-dir/console-error-loop/app/non-error-object/page.tsx (added, +45/-0)
• test/development/app-dir/console-error-loop/app/page.tsx (added, +34/-0)
• test/development/app-dir/console-error-loop/app/rapid-errors/page.tsx (added, +37/-0)
• test/development/app-dir/console-error-loop/app/suspense-error/page.tsx (added, +20/-0)
• test/development/app-dir/console-error-loop/console-error-loop.test.ts (added, +170/-0)
• test/development/app-dir/console-error-loop/next.config.js (added, +5/-0)