[code-infra] Fix and update bundling fixtures (#43709)

.circleci/config.yml

@@ -60,13 +60,12 @@ default-context: &default-context
 #     key: v1-repo-{{ .Branch }}-{{ .Revision }}
 
 commands:
-  install_js:
+  setup_corepack:
     parameters:
       browsers:
         type: boolean
         default: false
         description: 'Set to true if you intend to any browser (for example with playwright).'
-
     steps:
       - when:
           condition: << parameters.browsers >>
@@ -89,6 +88,17 @@ commands:
             node --version
             pnpm --version
 
+  install_js:
+    parameters:
+      browsers:
+        type: boolean
+        default: false
+        description: 'Set to true if you intend to any browser (for example with playwright).'
+
+    steps:
+      - setup_corepack:
+          browsers: << parameters.browsers >>
+
       - run:
           name: Resolve React version
           command: |
@@ -472,192 +482,174 @@ jobs:
       - run:
           name: Build packages for fixtures
           command: pnpm lerna run --scope "@mui/*" build
+      - run:
+          name: Pack packages
+          command: pnpm release:pack
       - persist_to_workspace:
-          root: packages
+          root: packed
           paths:
-            - '*/build'
+            - '*'
 
-  test_bundling_node-esm:
+  test_bundling_node_cjs:
     <<: *default-job
-    working_directory: /tmp/material-ui/test/bundling/fixtures/node-esm/
+    working_directory: /tmp/material-ui/test/bundling/fixtures/node-cjs/
     steps:
       - checkout:
           path: /tmp/material-ui
       - attach_workspace:
-          at: /tmp/material-ui/packages
+          at: /tmp/material-ui/packed
+      - setup_corepack
       - run:
-          name: Prepare fixture
-          command: |
-            node ../../scripts/createFixture node-esm
+          name: Install dependencies
+          command: pnpm install --ignore-workspace
+      - run:
+          name: Test fixture
+          command: pnpm start
+  test_bundling_node_esm:
+    <<: *default-job
+    working_directory: /tmp/material-ui/test/bundling/fixtures/node-esm/
+    steps:
+      - checkout:
+          path: /tmp/material-ui
+      - attach_workspace:
+          at: /tmp/material-ui/packed
+      - setup_corepack
       - run:
           name: Install dependencies
-          command: |
-            pnpm
-            node ../../scripts/useBuildFromSource.js .
+          command: pnpm install --ignore-workspace
       - run:
           name: Test fixture
-          command: |
-            # TODO: Known failure
-            set +e
-            pnpm start
-            exit 0
-  test_bundling_next-webpack4:
+          # TODO: Known failure
+          command: pnpm start
+  test_bundling_next_webpack4:
     <<: *default-job
-    working_directory: /tmp/material-ui/test/bundling/fixtures/next-webpack4/
     docker:
       - image: mcr.microsoft.com/playwright:v1.47.2-focal
+    working_directory: /tmp/material-ui/test/bundling/fixtures/next-webpack4/
     steps:
       - checkout:
           path: /tmp/material-ui
       - attach_workspace:
-          at: /tmp/material-ui/packages
-      - run:
-          name: Prepare fixture
-          command: |
-            node ../../scripts/createFixture next-webpack4
+          at: /tmp/material-ui/packed
+      - setup_corepack:
+          browsers: true
       - run:
           name: Install dependencies
-          command: |
-            pnpm
-            node ../../scripts/useBuildFromSource.js .
+          command: pnpm install --ignore-workspace
       - run:
           name: Test fixture
           command: pnpm start
-  test_bundling_next-webpack5:
+  test_bundling_next_webpack5:
     <<: *default-job
-    working_directory: /tmp/material-ui/test/bundling/fixtures/next-webpack5/
     docker:
       - image: mcr.microsoft.com/playwright:v1.47.2-focal
+    working_directory: /tmp/material-ui/test/bundling/fixtures/next-webpack5/
     steps:
       - checkout:
           path: /tmp/material-ui
       - attach_workspace:
-          at: /tmp/material-ui/packages
-      - run:
-          name: Prepare fixture
-          command: |
-            node ../../scripts/createFixture next-webpack5
+          at: /tmp/material-ui/packed
+      - setup_corepack:
+          browsers: true
       - run:
           name: Install dependencies
-          command: |
-            pnpm
-            node ../../scripts/useBuildFromSource.js .
+          command: pnpm install --ignore-workspace
       - run:
           name: Test fixture
           command: pnpm start
-  test_bundling_create-react-app:
+  test_bundling_create_react_app:
     <<: *default-job
-    working_directory: /tmp/material-ui/test/bundling/fixtures/create-react-app/
     docker:
       - image: mcr.microsoft.com/playwright:v1.47.2-focal
+    working_directory: /tmp/material-ui/test/bundling/fixtures/create-react-app/
     steps:
       - checkout:
           path: /tmp/material-ui
       - attach_workspace:
-          at: /tmp/material-ui/packages
-      - run:
-          name: Prepare fixture
-          command: |
-            node ../../scripts/createFixture create-react-app
+          at: /tmp/material-ui/packed
+      - setup_corepack:
+          browsers: true
       - run:
           name: Install dependencies
-          command: |
-            pnpm
-            node ../../scripts/useBuildFromSource.js .
+          command: pnpm install --ignore-workspace
       - run:
           name: Test fixture
           command: pnpm start
   test_bundling_snowpack:
     <<: *default-job
-    working_directory: /tmp/material-ui/test/bundling/fixtures/snowpack/
     docker:
       - image: mcr.microsoft.com/playwright:v1.47.2-focal
+    working_directory: /tmp/material-ui/test/bundling/fixtures/snowpack/
     steps:
       - checkout:
           path: /tmp/material-ui
       - attach_workspace:
-          at: /tmp/material-ui/packages
-      - run:
-          name: Prepare fixture
-          command: |
-            node ../../scripts/createFixture snowpack
+          at: /tmp/material-ui/packed
+      - setup_corepack:
+          browsers: true
       - run:
           name: Install dependencies
-          command: |
-            pnpm
-            node ../../scripts/useBuildFromSource.js .
+          command: pnpm install --ignore-workspace
       - run:
           name: Test fixture
           command: pnpm start
   test_bundling_vite:
     <<: *default-job
-    working_directory: /tmp/material-ui/test/bundling/fixtures/vite/
     docker:
       - image: mcr.microsoft.com/playwright:v1.47.2-focal
+    working_directory: /tmp/material-ui/test/bundling/fixtures/vite/
     steps:
       - checkout:
           path: /tmp/material-ui
       - attach_workspace:
-          at: /tmp/material-ui/packages
-      - run:
-          name: Prepare fixture
-          command: |
-            node ../../scripts/createFixture vite
+          at: /tmp/material-ui/packed
+      - setup_corepack:
+          browsers: true
       - run:
           name: Install dependencies
-          command: |
-            pnpm
-            node ../../scripts/useBuildFromSource.js .
+          command: pnpm install --ignore-workspace
       - run:
           name: Test fixture
           command: pnpm start
   test_bundling_esbuild:
     <<: *default-job
-    working_directory: /tmp/material-ui/test/bundling/fixtures/esbuild/
     docker:
       - image: mcr.microsoft.com/playwright:v1.47.2-focal
+    working_directory: /tmp/material-ui/test/bundling/fixtures/esbuild/
     steps:
       - checkout:
           path: /tmp/material-ui
       - attach_workspace:
-          at: /tmp/material-ui/packages
-      - run:
-          name: Prepare fixture
-          command: |
-            node ../../scripts/createFixture esbuild
+          at: /tmp/material-ui/packed
+      - setup_corepack:
+          browsers: true
       - run:
           name: Install dependencies
-          command: |
-            pnpm
-            node ../../scripts/useBuildFromSource.js .
+          command: pnpm install --ignore-workspace
       - run:
           name: Test fixture
-          command: |
-            # TODO: Known failure
-            set +e
-            pnpm start
-            exit 0
+          command: pnpm start
   test_bundling_gatsby:
     <<: *default-job
-    working_directory: /tmp/material-ui/test/bundling/fixtures/gatsby/
     docker:
       - image: mcr.microsoft.com/playwright:v1.47.2-focal
+        environment:
+          GATSBY_CPU_COUNT: '3'
+    working_directory: /tmp/material-ui/test/bundling/fixtures/gatsby/
     steps:
       - checkout:
           path: /tmp/material-ui
       - attach_workspace:
-          at: /tmp/material-ui/packages
-      - run:
-          name: Prepare fixture
-          command: |
-            node ../../scripts/useBuildFromSource.js .
-            node ../../scripts/createFixture gatsby
+          at: /tmp/material-ui/packed
+      - setup_corepack:
+          browsers: true
       - run:
           name: Install dependencies
-          command: pnpm
+          command: pnpm install --ignore-workspace
       - run:
           name: Test fixture
           command: pnpm start
+
   test_bundle_size_monitor:
     <<: *default-job
     steps:
@@ -668,6 +660,7 @@ jobs:
           command: pnpm danger ci
           environment:
             DANGER_COMMAND: prepareBundleSizeReport
+      - setup_corepack
       - run:
           name: build @mui packages
           command: pnpm lerna run --ignore @mui/icons-material --concurrency 6 --scope "@mui/*" build
@@ -807,19 +800,15 @@ workflows:
     jobs:
       - test_bundling_prepare:
           <<: *default-context
-      - test_bundling_node-esm:
+      - test_bundling_node_cjs:
           <<: *default-context
           requires:
             - test_bundling_prepare
-      - test_bundling_next-webpack4:
+      - test_bundling_node_esm:
           <<: *default-context
           requires:
             - test_bundling_prepare
-      - test_bundling_next-webpack5:
-          <<: *default-context
-          requires:
-            - test_bundling_prepare
-      - test_bundling_create-react-app:
+      - test_bundling_create_react_app:
           <<: *default-context
           requires:
             - test_bundling_prepare
@@ -839,6 +828,15 @@ workflows:
           <<: *default-context
           requires:
             - test_bundling_prepare
+      - test_bundling_next_webpack4:
+          <<: *default-context
+          requires:
+            - test_bundling_prepare
+      - test_bundling_next_webpack5:
+          <<: *default-context
+          requires:
+            - test_bundling_prepare
+
   profile:
     when:
       equal: [profile, << pipeline.parameters.workflow >>]

.gitignore

@@ -43,3 +43,4 @@ docs/public/static/blog/feed/*
 .nx/cache
 .nx/workspace-data
 screenshots
+packed

apps/pigment-css-vite-app/src/pages/fixtures/index.tsx

@@ -17,9 +17,7 @@ export default function Layout() {
   );
 
   const demo = new URLSearchParams(location.search).get('demo');
-  const fixturesRoutes = (matchedRoute?.route.children ?? []).filter(
-    (item) => !!item.path && item.path !== 'index.test',
-  );
+  const fixturesRoutes = (matchedRoute?.route.children ?? []).filter((item) => !!item.path);
 
   const demosRoutes = (materialUIRoute?.route.children ?? []).filter(
     (item) => !!item.path && !item.path.includes('react-pagination'),

apps/pigment-css-vite-app/vite.config.ts

@@ -43,8 +43,10 @@ export default defineConfig({
       sourceMap: true,
       displayName: true,
     }),
-    Pages(),
     splitVendorChunkPlugin(),
+    Pages({
+      exclude: ['**/*.test.*'],
+    }),
     nodePolyfills(),
   ],
 });

package.json

@@ -18,6 +18,7 @@
     "release:publish": "pnpm publish --recursive --tag latest",
     "release:publish:dry-run": "pnpm publish --recursive --tag latest --registry=\"http://localhost:4873/\"",
     "release:tag": "node scripts/releaseTag.mjs",
+    "release:pack": "tsx scripts/releasePack.mts",
     "docs:api": "rimraf --glob ./docs/pages/**/api-docs ./docs/pages/**/api && pnpm docs:api:build",
     "docs:api:build": "tsx ./scripts/buidApiDocs/index.ts",
     "docs:build": "pnpm --filter docs build",