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 00000000000000..279e4861a926db
--- /dev/null
+++ b/test/integration/module-id-strategies/components/CustomComponent.tsx
@@ -0,0 +1,11 @@
+import React from 'react'
+
+async function CustomComponent() {
+  return (
+    <div>
+      <h1>the content of a dynamic component</h1>
+    </div>
+  )
+}
+
+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 00000000000000..ece22b30c245a6
--- /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 00000000000000..40c2e5b7e65a1c
--- /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 00000000000000..8bb699844c52a2
--- /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 00000000000000..5764ac78f6744b
--- /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: () => <p>Loading...</p>,
+  }
+)
+
+export default function Index() {
+  return (
+    <div>
+      <DynamicCustomComponent />
+      {foo} {bar}
+    </div>
+  )
+}
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 00000000000000..aaa758912f13fa
--- /dev/null
+++ b/test/integration/module-id-strategies/test/index.test.js
@@ -0,0 +1,93 @@
+/* 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 allBundles = ''
+
+    beforeAll(async () => {
+      await nextBuild(appDir, [])
+
+      const ssrPath = join(appDir, '.next/server/chunks/ssr')
+      const pageBundleBasenames = (await fs.readdir(ssrPath)).filter((p) =>
+        p.match(/\.js$/)
+      )
+      for (const basename of pageBundleBasenames) {
+        const output = await fs.readFile(join(ssrPath, basename), 'utf8')
+        allBundles += output
+      }
+    })
+
+    it('should have no long module ids for basic modules', async () => {
+      expect(allBundles).not.toContain('module-with-long-name')
+      expect(allBundles).toContain('the content of a module with a long name')
+    })
+
+    it('should have no long module ids for external modules', async () => {
+      expect(allBundles).not.toContain('external-module-with-long-name')
+      expect(allBundles).toContain(
+        'the content of an external module with a long name'
+      )
+    })
+
+    it('should have no long module ids for async loader modules', async () => {
+      expect(allBundles).not.toContain('CustomComponent.tsx')
+      expect(allBundles).toContain('the content of a dynamic component')
+    })
+  })
+  ;(!process.env.TURBOPACK || process.env.TURBOPACK_BUILD
+    ? describe.skip
+    : describe)('development mode', () => {
+    let allBundles = ''
+
+    beforeAll(async () => {
+      appPort = await findPort()
+      app = await launchApp(appDir, appPort)
+
+      await renderViaHTTP(appPort, '/')
+
+      const ssrPath = join(appDir, '.next/server/chunks/ssr')
+      const pageBundleBasenames = (await fs.readdir(ssrPath)).filter((p) =>
+        p.match(/\.js$/)
+      )
+      for (const basename of pageBundleBasenames) {
+        const output = await fs.readFile(join(ssrPath, basename), 'utf8')
+        allBundles += output
+      }
+    })
+    afterAll(() => killApp(app))
+
+    it('should have long module ids for basic modules', async () => {
+      expect(allBundles).toContain('module-with-long-name')
+      expect(allBundles).toContain('the content of a module with a long name')
+    })
+
+    it('should have long module ids for external modules', async () => {
+      expect(allBundles).toContain('external-module-with-long-name')
+      expect(allBundles).toContain(
+        'the content of an external module with a long name'
+      )
+    })
+
+    it('should have long module ids for async loader modules', async () => {
+      expect(allBundles).toContain('CustomComponent.tsx')
+      expect(allBundles).toContain('the content of a dynamic component')
+    })
+  })
+})