Ensure setImmediate and punycode are polyfilled (#32768)

* Ensure setimmediate and punycode are polyfilled

* update compiled

packages/next/build/webpack-config.ts

@@ -615,6 +615,8 @@ export default async function getBaseWebpackConfig(
               : 'react-dom/cjs/react-dom-server.browser.production.min',
           }
         : {}),
+
+      setimmediate: 'next/dist/compiled/setimmediate',
     },
     ...(targetWeb
       ? {
@@ -632,7 +634,7 @@ export default async function getBaseWebpackConfig(
             https: require.resolve('next/dist/compiled/https-browserify'),
             os: require.resolve('next/dist/compiled/os-browserify'),
             path: require.resolve('next/dist/compiled/path-browserify'),
-            punycode: require.resolve('punycode'),
+            punycode: require.resolve('next/dist/compiled/punycode'),
             process: require.resolve('next/dist/compiled/process'),
             // Handled in separate alias
             querystring: require.resolve('next/dist/compiled/querystring-es3'),
@@ -650,6 +652,7 @@ export default async function getBaseWebpackConfig(
             vm: require.resolve('next/dist/compiled/vm-browserify'),
             zlib: require.resolve('next/dist/compiled/browserify-zlib'),
             events: require.resolve('next/dist/compiled/events/'),
+            setImmediate: require.resolve('next/dist/compiled/setimmediate'),
           },
         }
       : undefined),

packages/next/compiled/punycode/package.json

@@ -0,0 +1 @@
+{"name":"punycode","main":"punycode.js","author":{"name":"Mathias Bynens","url":"https://mathiasbynens.be/"},"license":"MIT"}

packages/next/compiled/setimmediate/package.json

@@ -0,0 +1 @@
+{"name":"setimmediate","main":"setImmediate.js","author":"YuzuJS","license":"MIT"}

packages/next/package.json

@@ -236,6 +236,7 @@
     "postcss-safe-parser": "6.0.0",
     "postcss-scss": "3.0.5",
     "postcss-value-parser": "4.1.0",
+    "punycode": "2.1.1",
     "process": "0.11.10",
     "querystring-es3": "0.2.1",
     "raw-body": "2.4.1",
@@ -244,6 +245,7 @@
     "sass-loader": "10.2.0",
     "schema-utils2": "npm:schema-utils@2.7.1",
     "schema-utils3": "npm:schema-utils@3.0.0",
+    "setimmediate": "1.0.5",
     "semver": "7.3.2",
     "send": "0.17.1",
     "source-map": "0.6.1",

packages/next/taskfile.js

@@ -510,6 +510,32 @@ export async function ncc_util(task, opts) {
     .target('compiled/util')
 }
 
+// eslint-disable-next-line camelcase
+export async function ncc_punycode(task, opts) {
+  await task
+    .source(opts.src || relative(__dirname, require.resolve('punycode/')))
+    .ncc({
+      packageName: 'punycode',
+      externals,
+      mainFields: ['browser', 'main'],
+      target: 'es5',
+    })
+    .target('compiled/punycode')
+}
+
+// eslint-disable-next-line camelcase
+export async function ncc_set_immediate(task, opts) {
+  await task
+    .source(opts.src || relative(__dirname, require.resolve('setimmediate/')))
+    .ncc({
+      packageName: 'setimmediate',
+      externals,
+      mainFields: ['browser', 'main'],
+      target: 'es5',
+    })
+    .target('compiled/setimmediate')
+}
+
 // eslint-disable-next-line camelcase
 export async function ncc_timers_browserify(task, opts) {
   await task
@@ -518,7 +544,10 @@ export async function ncc_timers_browserify(task, opts) {
     )
     .ncc({
       packageName: 'timers-browserify',
-      externals,
+      externals: {
+        ...externals,
+        setimmediate: 'next/dist/compiled/setimmediate',
+      },
       mainFields: ['browser', 'main'],
       target: 'es5',
     })
@@ -1444,6 +1473,8 @@ export async function ncc(task, opts) {
         'ncc_querystring_es3',
         'ncc_string_decoder',
         'ncc_util',
+        'ncc_punycode',
+        'ncc_set_immediate',
         'ncc_timers_browserify',
         'ncc_tty_browserify',
         'ncc_vm_browserify',

test/integration/polyfill-node-modules/test/index.test.js → test/development/basic/node-browser-polyfills.test.ts

@@ -1,22 +1,22 @@
-/* eslint-env jest */
-
 import { join } from 'path'
 import webdriver from 'next-webdriver'
-import { findPort, launchApp, killApp } from 'next-test-utils'
+import { createNext, FileRef } from 'e2e-utils'
+import { NextInstance } from 'test/lib/next-modes/base'
 
-const appDir = join(__dirname, '../')
-let appPort
-let app
+describe('theme-ui SWC option', () => {
+  let next: NextInstance
 
-describe('Basic Features', () => {
   beforeAll(async () => {
-    appPort = await findPort()
-    app = await launchApp(appDir, appPort)
+    next = await createNext({
+      files: {
+        pages: new FileRef(join(__dirname, 'node-browser-polyfills/pages')),
+      },
+    })
   })
-  afterAll(() => killApp(app))
+  afterAll(() => next.destroy())
 
-  it('should polyfill Node.js modules', async () => {
-    const browser = await webdriver(appPort, '/node-browser-polyfills')
+  it('should have polyfilled correctly', async () => {
+    const browser = await webdriver(next.url, '/')
 
     await browser.waitForCondition('window.didRender')
 

test/integration/polyfill-node-modules/pages/node-browser-polyfills.js → test/development/basic/node-browser-polyfills/pages/index.js

@@ -19,6 +19,7 @@ import timers from 'timers'
 import tty from 'tty'
 import util from 'util'
 import zlib from 'zlib'
+import 'setimmediate'
 
 export default function NodeBrowserPolyfillPage() {
   const [state, setState] = useState({})
@@ -50,26 +51,28 @@ export default function NodeBrowserPolyfillPage() {
     assert.ok(!!util.inspect)
     assert.ok(!!zlib.Gzip)
 
-    setState({
-      assert: true,
-      buffer: Buffer.from('hello world').toString('utf8'),
-      constants: constants.E2BIG,
-      hash: crypto.createHash('sha256').update('hello world').digest('hex'),
-      domain: true,
-      os: os.EOL,
-      path: path.join('/hello/world', 'test.txt'),
-      process: process.title,
-      querystring: querystring.stringify({ a: 'b' }),
-      stream: closedStream,
-      stringDecoder: true,
-      sys: true,
-      timers: true,
-      tty: true,
-      util: true,
-      http: true,
-      https: true,
-      vm: vm.runInNewContext('a + 5', { a: 100 }),
-      zlib: true,
+    setImmediate(() => {
+      setState({
+        assert: true,
+        buffer: Buffer.from('hello world').toString('utf8'),
+        constants: constants.E2BIG,
+        hash: crypto.createHash('sha256').update('hello world').digest('hex'),
+        domain: true,
+        os: os.EOL,
+        path: path.join('/hello/world', 'test.txt'),
+        process: process.title,
+        querystring: querystring.stringify({ a: 'b' }),
+        stream: closedStream,
+        stringDecoder: true,
+        sys: true,
+        timers: true,
+        tty: true,
+        util: true,
+        http: true,
+        https: true,
+        vm: vm.runInNewContext('a + 5', { a: 100 }),
+        zlib: true,
+      })
     })
   }, [])
 

yarn.lock

@@ -16277,14 +16277,14 @@ punycode@1.3.2:
   resolved "https://registry.yarnpkg.com/punycode/-/punycode-1.3.2.tgz#9653a036fb7c1ee42342f2325cceefea3926c48d"
   integrity sha1-llOgNvt8HuQjQvIyXM7v6jkmxI0=
 
+punycode@2.1.1, punycode@^2.1.0, punycode@^2.1.1:
+  version "2.1.1"
+  resolved "https://registry.yarnpkg.com/punycode/-/punycode-2.1.1.tgz#b58b010ac40c22c5657616c8d2c2c02c7bf479ec"
+
 punycode@^1.2.4:
   version "1.4.1"
   resolved "https://registry.yarnpkg.com/punycode/-/punycode-1.4.1.tgz#c0d5a63b2718800ad8e1eb0fa5269c84dd41845e"
 
-punycode@^2.1.0, punycode@^2.1.1:
-  version "2.1.1"
-  resolved "https://registry.yarnpkg.com/punycode/-/punycode-2.1.1.tgz#b58b010ac40c22c5657616c8d2c2c02c7bf479ec"
-
 pupa@^2.0.1:
   version "2.1.1"
   resolved "https://registry.yarnpkg.com/pupa/-/pupa-2.1.1.tgz#f5e8fd4afc2c5d97828faa523549ed8744a20d62"
@@ -17565,7 +17565,7 @@ set-value@^2.0.0, set-value@^2.0.1:
     is-plain-object "^2.0.3"
     split-string "^3.0.1"
 
-setimmediate@^1.0.4:
+setimmediate@1.0.5, setimmediate@^1.0.4:
   version "1.0.5"
   resolved "https://registry.yarnpkg.com/setimmediate/-/setimmediate-1.0.5.tgz#290cbb232e306942d7d7ea9b83732ab7856f8285"
   integrity sha1-KQy7Iy4waULX1+qbg3Mqt4VvgoU=