init project

test/bundling/fixtures/next-webpack5/next-webpack.template

@@ -0,0 +1,7 @@
+{{{imports}}}
+
+{{{usage}}}
+
+export default function Page() {
+  return null;
+}

test/bundling/fixtures/next-webpack5/next.config.mjs

@@ -0,0 +1,5 @@
+export default {
+  eslint: {
+    ignoreDuringBuilds: true,
+  },
+};

test/bundling/fixtures/next-webpack5/package.json

@@ -0,0 +1,36 @@
+{
+  "name": "next-webpack5",
+  "version": "1.0.0",
+  "license": "MIT",
+  "scripts": {
+    "start": "pnpm next build && concurrently --success first --kill-others \"pnpm next start\" \"node testNextWebpack5Integration\""
+  },
+  "dependencies": {
+    "@emotion/core": "11.0.0",
+    "@emotion/react": "11.10.4",
+    "@emotion/styled": "11.10.4",
+    "@mui/material": "workspace:*",
+    "@mui/icons-material": "workspace:*",
+    "@mui/lab": "workspace:*",
+    "@mui/styled-engine": "workspace:*",
+    "@mui/utils": "workspace:*",
+    "next": "14.2.30",
+    "react": "18.2.0",
+    "react-dom": "18.2.0",
+    "react-is": "18.2.0"
+  },
+  "devDependencies": {
+    "concurrently": "7.4.0",
+    "@playwright/test": "1.54.1"
+  },
+  "pnpm": {
+    "overrides": {
+      "@mui/material": "file:../../../../packed/@mui/material.tgz",
+      "@mui/icons-material": "file:../../../../packed/@mui/icons-material.tgz",
+      "@mui/lab": "file:../../../../packed/@mui/lab.tgz",
+      "@mui/styled-engine": "file:../../../../packed/@mui/styled-engine.tgz",
+      "@mui/system": "file:../../../../packed/@mui/system.tgz",
+      "@mui/utils": "file:../../../../packed/@mui/utils.tgz"
+    }
+  }
+}

test/bundling/fixtures/next-webpack5/pages/development.js

@@ -0,0 +1,13 @@
+import * as React from 'react';
+import IconButton from '@mui/material/IconButton';
+import AccessibilityIcon from '@mui/icons-material/Accessibility';
+
+export default function Development() {
+  return (
+    <div>
+      <IconButton>
+        <AccessibilityIcon />
+      </IconButton>
+    </div>
+  );
+}

test/bundling/fixtures/next-webpack5/testNextWebpack5Integration.js

@@ -0,0 +1,59 @@
+const { chromium } = require('@playwright/test');
+
+/**
+ * @param {number} timeoutMS
+ * @returns {Promise<void>}
+ */
+function sleep(duration) {
+  return new Promise((resolve) => {
+    setTimeout(() => {
+      resolve();
+    }, duration);
+  });
+}
+
+/**
+ * Attempts page.goto with retries
+ *
+ * @remarks The server and runner can be started up simultaneously
+ * @param {import('@playwright/test').Page} page
+ * @param {string} url
+ * @returns {boolean}
+ */
+async function attemptGoto(page, url) {
+  const maxAttempts = 10;
+  const retryTimeoutMS = 250;
+
+  let didNavigate = false;
+  for (let attempt = 1; attempt <= maxAttempts; attempt += 1) {
+    try {
+      // eslint-disable-next-line no-await-in-loop
+      await page.goto(url);
+      didNavigate = true;
+    } catch (error) {
+      // eslint-disable-next-line no-await-in-loop
+      await sleep(retryTimeoutMS);
+    }
+  }
+
+  return didNavigate;
+}
+
+async function main() {
+  const browser = await chromium.launch();
+  const page = await browser.newPage();
+
+  page.on('console', (consoleMessage) => {
+    throw new Error(
+      `Expected no console messages but got ${consoleMessage.type()}: '${consoleMessage.text()}' `,
+    );
+  });
+  await attemptGoto(page, 'http://localhost:5001/next-webpack.fixture');
+
+  await browser.close();
+}
+
+main().catch((error) => {
+  console.error(error);
+  process.exit(1);
+});