diff --git a/test/integration/module-id-strategies/components/CustomComponent.tsx b/test/integration/module-id-strategies/components/CustomComponent.tsx
new file mode 100644
index 0000000000000..279e4861a926d
--- /dev/null
+++ b/test/integration/module-id-strategies/components/CustomComponent.tsx
@@ -0,0 +1,11 @@
+import React from 'react'
+
+async function CustomComponent() {
+ return (
+
+
the content of a dynamic component
+
+ )
+}
+
+export default CustomComponent
diff --git a/test/integration/module-id-strategies/module-with-long-name.js b/test/integration/module-id-strategies/module-with-long-name.js
new file mode 100644
index 0000000000000..ece22b30c245a
--- /dev/null
+++ b/test/integration/module-id-strategies/module-with-long-name.js
@@ -0,0 +1,3 @@
+module.exports = {
+ foo: 'the content of a module with a long name',
+}
diff --git a/test/integration/module-id-strategies/next.config.js b/test/integration/module-id-strategies/next.config.js
new file mode 100644
index 0000000000000..40c2e5b7e65a1
--- /dev/null
+++ b/test/integration/module-id-strategies/next.config.js
@@ -0,0 +1,4 @@
+module.exports = {
+ bundlePagesRouterDependencies: true,
+ serverExternalPackages: ['opted-out-external-package'],
+}
diff --git a/test/integration/module-id-strategies/node_modules/external-module-with-long-name.js b/test/integration/module-id-strategies/node_modules/external-module-with-long-name.js
new file mode 100644
index 0000000000000..8bb699844c52a
--- /dev/null
+++ b/test/integration/module-id-strategies/node_modules/external-module-with-long-name.js
@@ -0,0 +1,3 @@
+module.exports = {
+ bar: 'the content of an external module with a long name',
+}
diff --git a/test/integration/module-id-strategies/pages/index.js b/test/integration/module-id-strategies/pages/index.js
new file mode 100644
index 0000000000000..5764ac78f6744
--- /dev/null
+++ b/test/integration/module-id-strategies/pages/index.js
@@ -0,0 +1,19 @@
+import { foo } from '../module-with-long-name'
+import { bar } from '../node_modules/external-module-with-long-name'
+import dynamic from 'next/dynamic'
+
+const DynamicCustomComponent = dynamic(
+ () => import('../components/CustomComponent'),
+ {
+ loading: () => Loading...
,
+ }
+)
+
+export default function Index() {
+ return (
+
+
+ {foo} {bar}
+
+ )
+}
diff --git a/test/integration/module-id-strategies/test/index.test.js b/test/integration/module-id-strategies/test/index.test.js
new file mode 100644
index 0000000000000..6776f1fa69f01
--- /dev/null
+++ b/test/integration/module-id-strategies/test/index.test.js
@@ -0,0 +1,121 @@
+/* eslint-env jest */
+
+import fs from 'fs-extra'
+import { join } from 'path'
+import {
+ killApp,
+ findPort,
+ launchApp,
+ nextBuild,
+ renderViaHTTP,
+} from 'next-test-utils'
+
+const appDir = join(__dirname, '../')
+
+let appPort
+let app
+
+describe('minified module ids', () => {
+ ;(!process.env.TURBOPACK || process.env.TURBOPACK_DEV
+ ? describe.skip
+ : describe)('production mode', () => {
+ let ssrBundles = ''
+ let staticBundles = ''
+
+ beforeAll(async () => {
+ await nextBuild(appDir, [])
+
+ const ssrPath = join(appDir, '.next/server/chunks/ssr/')
+ const ssrBundleBasenames = (await fs.readdir(ssrPath)).filter((p) =>
+ p.match(/\.js$/)
+ )
+ for (const basename of ssrBundleBasenames) {
+ const output = await fs.readFile(join(ssrPath, basename), 'utf8')
+ ssrBundles += output
+ }
+
+ const staticPath = join(appDir, '.next/static/chunks/')
+ const staticBundleBasenames = (await fs.readdir(staticPath)).filter((p) =>
+ p.match(/\.js$/)
+ )
+ for (const basename of staticBundleBasenames) {
+ const output = await fs.readFile(join(staticPath, basename), 'utf8')
+ staticBundles += output
+ }
+ })
+
+ it('should have no long module ids for basic modules', async () => {
+ expect(ssrBundles).not.toContain('module-with-long-name')
+ expect(ssrBundles).toContain('the content of a module with a long name')
+ })
+
+ it('should have no long module ids for external modules', async () => {
+ expect(ssrBundles).not.toContain('external-module-with-long-name')
+ expect(ssrBundles).toContain(
+ 'the content of an external module with a long name'
+ )
+ })
+
+ it('should have no long module ids for async loader modules', async () => {
+ expect(ssrBundles).not.toContain('CustomComponent.tsx')
+ expect(ssrBundles).toContain('the content of a dynamic component')
+ })
+
+ it('should have no long module id for the next client runtime module', async () => {
+ expect(staticBundles).not.toContain('next/dist/client/next-turbopack')
+ })
+ })
+ ;(!process.env.TURBOPACK || process.env.TURBOPACK_BUILD
+ ? describe.skip
+ : describe)('development mode', () => {
+ let ssrBundles = ''
+ let staticBundles = ''
+
+ beforeAll(async () => {
+ appPort = await findPort()
+ app = await launchApp(appDir, appPort)
+
+ await renderViaHTTP(appPort, '/')
+
+ const ssrPath = join(appDir, '.next/server/chunks/ssr/')
+ const ssrBundleBasenames = (await fs.readdir(ssrPath)).filter((p) =>
+ p.match(/\.js$/)
+ )
+ for (const basename of ssrBundleBasenames) {
+ const output = await fs.readFile(join(ssrPath, basename), 'utf8')
+ ssrBundles += output
+ }
+
+ const staticPath = join(appDir, '.next/static/chunks/')
+ const staticBundleBasenames = (await fs.readdir(staticPath)).filter((p) =>
+ p.match(/\.js$/)
+ )
+ for (const basename of staticBundleBasenames) {
+ const output = await fs.readFile(join(staticPath, basename), 'utf8')
+ staticBundles += output
+ }
+ })
+ afterAll(() => killApp(app))
+
+ it('should have long module ids for basic modules', async () => {
+ expect(ssrBundles).toContain('module-with-long-name')
+ expect(ssrBundles).toContain('the content of a module with a long name')
+ })
+
+ it('should have long module ids for external modules', async () => {
+ expect(ssrBundles).toContain('external-module-with-long-name')
+ expect(ssrBundles).toContain(
+ 'the content of an external module with a long name'
+ )
+ })
+
+ it('should have long module ids for async loader modules', async () => {
+ expect(ssrBundles).toContain('CustomComponent.tsx')
+ expect(ssrBundles).toContain('the content of a dynamic component')
+ })
+
+ it('should have long module id for the next client runtime module', async () => {
+ expect(staticBundles).toContain('next/dist/client/next-dev-turbopack')
+ })
+ })
+})