[backport]: Upgrade builtin babel packages on NextJS 14 #81120

TheSgrash · 2025-07-01T12:16:36Z

What

Backport of the work made for Upgrade builtin babel packages #78673 on last NextJS 14 version
Upgrade babel core packages to latest on NextJS 14
Upgrade babel plugins to latest and migrate deprecated packages
- @babel/plugin-proposal-class-properties -> @babel/plugin-transform-class-properties
- @babel/plugin-proposal-export-namespace-from -> @babel/plugin-transform-export-namespace-from
- @babel/plugin-proposal-numeric-separator -> @babel/plugin-transform-numeric-separator
- @babel/plugin-proposal-object-rest-spread -> @babel/plugin-transform-object-rest-spread
Upgrade browserslist to latest

Why

The main reason to upgrade is to upgrade the @babel/runtime to new new version to address the security vulnerability GHSA-968p-4wvh-cqc8

test-dev passed

Test Suites: 1 skipped, 5 passed, 5 of 6 total
Tests:       11 skipped, 106 passed, 117 total
Snapshots:   0 total
Time:        133.955 s, estimated 259 s
Ran all test suites matching /test\/e2e\/app-dir\/app\//i.

test-start passed

Test Suites: 6 passed, 6 total
Tests:       12 skipped, 218 passed, 230 total
Snapshots:   0 total
Time:        260.529 s
Ran all test suites matching /test\/e2e\/app-dir\/app\//i.

Fixes #77879
Discussion #79976

ijjk · 2025-07-01T12:16:58Z

Allow CI Workflow Run

approve CI run for commit: df6ebae

Note: this should only be enabled once the PR is ready to go and can only be enabled by a maintainer

ijjk · 2025-07-01T12:16:58Z

Allow CI Workflow Run

approve CI run for commit: df6ebae

Note: this should only be enabled once the PR is ready to go and can only be enabled by a maintainer

ijjk · 2025-07-01T12:16:58Z

Allow CI Workflow Run

approve CI run for commit: bd86523

Note: this should only be enabled once the PR is ready to go and can only be enabled by a maintainer

socket-security · 2025-07-01T12:17:51Z

Review the following changes in direct dependencies. Learn more about Socket for GitHub.

Diff	Package	Supply Chain Security	Vulnerability	Quality	Maintenance
	@babel/plugin-syntax-jsx@7.22.5 ⏵ 7.25.9
	@babel/plugin-transform-class-properties@7.22.5 ⏵ 7.25.9	⁺¹		⁺¹
	@babel/plugin-transform-numeric-separator@7.22.11 ⏵ 7.25.9	⁺¹
	@babel/plugin-syntax-import-attributes@7.22.5 ⏵ 7.26.0			⁺²
	@babel/plugin-syntax-explicit-resource-management@7.25.7
	@babel/plugin-transform-export-namespace-from@7.22.11 ⏵ 7.25.9	⁺¹
	@babel/preset-flow@7.22.5 ⏵ 7.25.9			⁺¹
	@babel/preset-react@7.22.5 ⏵ 7.26.3			^-1
	@babel/preset-react@7.22.5 ⏵ 7.27.1			^-1
	@babel/preset-typescript@7.22.5 ⏵ 7.27.1
	@babel/code-frame@7.22.5 ⏵ 7.26.2			⁺¹
	@babel/plugin-transform-runtime@7.22.5 ⏵ 7.26.10	⁺¹
	@babel/plugin-transform-modules-commonjs@7.22.5 ⏵ 7.26.3	⁺¹		⁺¹
	@types/async-retry@1.4.2 ⏵ 1.4.4			⁺¹³
	@types/react-dom@18.2.15 ⏵ 18.2.25	⁺¹		⁺¹	^-1
	@babel/plugin-transform-object-rest-spread@7.22.15 ⏵ 7.25.9	⁺¹		⁺¹
	@babel/preset-env@7.22.5 ⏵ 7.27.2	⁺¹		⁺¹
	kleur@4.1.3 ⏵ 4.1.5
	es5-ext@0.10.53 ⏵ 0.10.64	^-15	⁺⁵
	@types/react@18.2.37 ⏵ 18.2.71	⁺¹		⁺¹
	@babel/generator@7.22.5 ⏵ 7.27.0			⁺¹
	@babel/runtime@7.22.5 ⏵ 7.27.0		⁺⁵
	@babel/traverse@7.22.5 ⏵ 7.27.4	⁺¹	⁺⁷⁵	⁺¹	⁺⁴
	@babel/core@7.22.5 ⏵ 7.27.4			⁺¹	⁺³
	@babel/parser@7.22.5 ⏵ 7.27.5				⁺⁴
	@babel/types@7.22.5 ⏵ 7.27.6	⁺¹			⁺²
	async-retry@1.3.1 ⏵ 1.3.3			⁺¹
	moment@2.24.0 ⏵ 2.30.1		⁺²⁴	^-2
	eslint-plugin-jsx-a11y@6.7.1 ⏵ 6.10.2	⁺¹		⁺¹
	webpack-stats-plugin@1.1.0 ⏵ 1.1.3			⁺¹
	browserslist@4.22.2 ⏵ 4.25.0			^-1
	@rushstack/eslint-patch@1.3.3 ⏵ 1.11.0			⁺¹¹
	swr@2.2.4 ⏵ 2.3.3				⁺³
See 2 more rows in the dashboard

View full report

socket-security · 2025-07-01T12:17:53Z

Warning

Review the following alerts detected in dependencies.

According to your organization's Security Policy, it is recommended to resolve "Warn" alerts. Learn more about Socket for GitHub.

Action	Severity	Alert (click "▶" to expand/collapse)
Warn		`es5-ext@0.10.64` is Protestware or potentially unwanted behavior. Note: The script attempts to run a local post-install script, which could potentially contain malicious code. The error handling suggests that it is designed to fail silently, which is a common tactic in malicious scripts. From: package.json → `npm/es5-ext@0.10.64` ℹ Read more on: This package \| This alert \| What is protestware? Next steps: Take a moment to review the security alert above. Review the linked package source code to understand the potential risk. Ensure the package is not malicious before proceeding. If you're unsure how to proceed, reach out to your security team or ask the Socket team for help at `support@socket.dev`. Suggestion: Consider that consuming this package may come along with functionality unrelated to its primary purpose. Mark the package as acceptable risk. To ignore this alert only in this pull request, reply with the comment `@SocketSecurity ignore npm/es5-ext@0.10.64`. You can also ignore all packages with `@SocketSecurity ignore-all`. To ignore an alert for all future pull requests, use Socket's Dashboard to change the triage state of this alert.

View full report

ijjk · 2025-07-29T22:15:37Z

Failing test suites

Commit: 55f7662

pnpm test-start test/e2e/prerender-native-module.test.ts

prerender native module > should render index correctly
prerender native module > should render /blog/first correctly
prerender native module > should render /blog/second correctly
prerender native module > should output traces

Expand output

● prerender native module › should render index correctly

next build failed with code/signal 1

  90 |           if (code || signal)
  91 |             reject(
> 92 |               new Error(`next build failed with code/signal ${code || signal}`)
     |               ^
  93 |             )
  94 |           else resolve()
  95 |         })

  at ChildProcess.<anonymous> (lib/next-modes/next-start.ts:92:15)

● prerender native module › should render /blog/first correctly

next build failed with code/signal 1

  90 |           if (code || signal)
  91 |             reject(
> 92 |               new Error(`next build failed with code/signal ${code || signal}`)
     |               ^
  93 |             )
  94 |           else resolve()
  95 |         })

  at ChildProcess.<anonymous> (lib/next-modes/next-start.ts:92:15)

● prerender native module › should render /blog/second correctly

next build failed with code/signal 1

  90 |           if (code || signal)
  91 |             reject(
> 92 |               new Error(`next build failed with code/signal ${code || signal}`)
     |               ^
  93 |             )
  94 |           else resolve()
  95 |         })

  at ChildProcess.<anonymous> (lib/next-modes/next-start.ts:92:15)

● prerender native module › should output traces

next build failed with code/signal 1

  90 |           if (code || signal)
  91 |             reject(
> 92 |               new Error(`next build failed with code/signal ${code || signal}`)
     |               ^
  93 |             )
  94 |           else resolve()
  95 |         })

  at ChildProcess.<anonymous> (lib/next-modes/next-start.ts:92:15)

● Test suite failed to run

TypeError: Cannot read properties of undefined (reading 'destroy')

  23 |     })
  24 |   })
> 25 |   afterAll(() => next.destroy())
     |                       ^
  26 |
  27 |   it('should render index correctly', async () => {
  28 |     const browser = await webdriver(next.url, '/')

  at Object.destroy (e2e/prerender-native-module.test.ts:25:23)

Read more about building and testing Next.js in contributing.md.

vercel · 2025-08-06T07:49:11Z

packages/next/src/client/components/router-reducer/ppr-navigations.ts

+    rsc: createDeferredRsc() as unknown as React.ReactNode,
+    head: isLeafSegment
+      ? (createDeferredRsc() as unknown as React.ReactNode)


Type assertions are breaking the designed contract where rsc and head fields should accept promise-like objects, not just React nodes.

View Details

Analysis

The code adds type assertions as unknown as React.ReactNode to force createDeferredRsc() (which returns PendingDeferredRsc) into the React.ReactNode type. However, this breaks the intended design where the rsc and head fields should accept both React nodes AND promise-like objects.

The downstream consumption code in layout-router.tsx specifically expects and handles this:

// Lines 390-393 comment: "`rsc` is either a React node or a promise for a React node..." const resolvedRsc: React.ReactNode = typeof rsc === 'object' && rsc !== null && typeof rsc.then === 'function' ? use(rsc) // Unwraps promises : rsc

The type assertions mask what should be a legitimate type compatibility issue. The proper solution would be to update the CacheNode type definition to reflect that rsc and head can be either React.ReactNode OR promise-like objects, rather than using type assertions to lie to the type system.

This could lead to issues if other parts of the codebase assume these fields are always plain ReactNodes when they can actually be promises.

Recommendation

Instead of using type assertions, update the CacheNode type definition in packages/next/src/shared/lib/app-router-context.shared-runtime.ts to properly reflect that the rsc and head fields can accept both React.ReactNode and promise-like objects (specifically DeferredRsc types). Then remove the type assertions and let TypeScript verify the proper type compatibility.

TheSgrash added 3 commits June 13, 2025 11:05

Updating @babel libraries because of vulns

584ec5d

updating libraries

6004f35

solving mime issues

df6ebae

ijjk added create-next-app Related to our CLI tool for quickly starting a new Next.js application. examples Issue was opened via the examples template. Rspack tests type: next labels Jul 1, 2025

TheSgrash added 2 commits July 1, 2025 14:20

Fixing wrongly changed README

a820dff

fixing es5-ext library version to a non-vulnerable one

11ffb3e

TheSgrash changed the title ~~Upgrade builtin babel packages on NextJS 14~~ [backport]: Upgrade builtin babel packages on NextJS 14 Jul 9, 2025

Merge branch '14-2-1' into 14-2-1

bd86523

vercel bot reviewed Aug 6, 2025

View reviewed changes

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

[backport]: Upgrade builtin babel packages on NextJS 14 #81120

[backport]: Upgrade builtin babel packages on NextJS 14 #81120

Uh oh!

TheSgrash commented Jul 1, 2025

Uh oh!

ijjk commented Jul 1, 2025

Uh oh!

ijjk commented Jul 1, 2025

Uh oh!

ijjk commented Jul 1, 2025 •

edited

Loading

Uh oh!

socket-security bot commented Jul 1, 2025 •

edited

Loading

Uh oh!

socket-security bot commented Jul 1, 2025 •

edited

Loading

Uh oh!

ijjk commented Jul 29, 2025 •

edited

Loading

Uh oh!

vercel bot Aug 6, 2025

Uh oh!

Uh oh!

[backport]: Upgrade builtin babel packages on NextJS 14 #81120

Are you sure you want to change the base?

[backport]: Upgrade builtin babel packages on NextJS 14 #81120

Uh oh!

Conversation

TheSgrash commented Jul 1, 2025

What

Why

Uh oh!

ijjk commented Jul 1, 2025

Uh oh!

ijjk commented Jul 1, 2025

Uh oh!

ijjk commented Jul 1, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

socket-security bot commented Jul 1, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

socket-security bot commented Jul 1, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

ijjk commented Jul 29, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Failing test suites

Uh oh!

vercel bot Aug 6, 2025

Choose a reason for hiding this comment

Analysis

Recommendation

Uh oh!

Uh oh!

ijjk commented Jul 1, 2025 •

edited

Loading

socket-security bot commented Jul 1, 2025 •

edited

Loading

socket-security bot commented Jul 1, 2025 •

edited

Loading

ijjk commented Jul 29, 2025 •

edited

Loading