test(next): add tests for Node-like hashbang support (#27906)

* update to webpack 5.50.0

* feat: use shebang loader shim for now

* chore: snapshot formatting change

* chore: remove unneeded SSR test

* chore: test all file extensions

* chore: remove shebang loader from Webpack config

* chore: revert unnecessary changes

* Update test/integration/hashbang/test/index.test.js

Co-authored-by: Steven <[email protected]>

* chore: revert changes to yarn.lock

Co-authored-by: Tobias Koppers <[email protected]>
Co-authored-by: Steven <[email protected]>

Author: 3 people

test/integration/hashbang/src/cases/cjs.cjs

@@ -0,0 +1,3 @@
+#!/usr/env node
+
+module.exports = 789

test/integration/hashbang/src/cases/js.js

@@ -0,0 +1,3 @@
+#!/usr/env node
+
+module.exports = 123

test/integration/hashbang/src/cases/mjs.mjs

@@ -0,0 +1,3 @@
+#!/usr/env node
+
+export default 456

test/integration/hashbang/src/pages/index.js

@@ -0,0 +1,20 @@
+/**
+ * Import hashbang modules.
+ */
+import js from '../cases/js.js'
+import cjs from '../cases/cjs.cjs'
+import mjs from '../cases/mjs.mjs'
+
+const jsMsg = `JS: ${js}`
+const mjsMsg = `MJS: ${mjs}`
+const cjsMsg = `CJS: ${cjs}`
+
+const Page = () => (
+  <div>
+    <h3>{jsMsg}</h3>
+    <h3>{mjsMsg}</h3>
+    <h3>{cjsMsg}</h3>
+  </div>
+)
+
+export default Page

test/integration/hashbang/test/index.test.js

@@ -0,0 +1,63 @@
+/* eslint-env jest */
+
+import { join } from 'path'
+import fs from 'fs-extra'
+import {
+  renderViaHTTP,
+  findPort,
+  launchApp,
+  killApp,
+  nextBuild,
+  nextStart,
+} from 'next-test-utils'
+
+jest.setTimeout(1000 * 60 * 2)
+
+let app
+let appPort
+const appDir = join(__dirname, '../')
+
+function runTests() {
+  describe('first-line hashbang (#!) parse', () => {
+    it('should work for .js files', async () => {
+      const html = await renderViaHTTP(appPort, '/')
+      expect(html).toMatch('JS: 123')
+    })
+
+    it('should work for .mjs files', async () => {
+      const html = await renderViaHTTP(appPort, '/')
+      expect(html).toMatch('MJS: 456')
+    })
+
+    it('should work for .cjs files', async () => {
+      const html = await renderViaHTTP(appPort, '/')
+      expect(html).toMatch('CJS: 789')
+    })
+  })
+}
+
+const nextConfig = join(appDir, 'next.config.js')
+
+describe('Hashbang', () => {
+  describe('dev mode', () => {
+    beforeAll(async () => {
+      appPort = await findPort()
+      app = await launchApp(appDir, appPort)
+    })
+    afterAll(() => killApp(app))
+
+    runTests(true)
+  })
+
+  describe('production mode', () => {
+    beforeAll(async () => {
+      await fs.remove(nextConfig)
+      await nextBuild(appDir)
+      appPort = await findPort()
+      app = await nextStart(appDir, appPort)
+    })
+    afterAll(() => killApp(app))
+
+    runTests()
+  })
+})