[test] Track @mui/x-chat bundle size via native expand (#23049)

Author: Janpot

package.json

@@ -78,7 +78,7 @@
     "@inquirer/prompts": "8.5.1",
     "@mui/internal-babel-plugin-display-name": "1.0.4-canary.20",
     "@mui/internal-babel-plugin-minify-errors": "2.0.8-canary.27",
-    "@mui/internal-bundle-size-checker": "1.0.9-canary.81",
+    "@mui/internal-bundle-size-checker": "1.0.9-canary.83",
     "@mui/internal-code-infra": "0.0.4-canary.66",
     "@mui/internal-api-docs-builder": "1.0.4-canary.1",
     "@mui/internal-markdown": "3.0.11-canary.1",

pnpm-lock.yaml

@@ -3,110 +3,51 @@
  *
  * This file determines which packages and components will have their bundle sizes measured.
  */
-import fs from 'fs';
-import path from 'path';
-import { globby } from 'globby';
 import { defineConfig } from '@mui/internal-bundle-size-checker';
 import generateReleaseInfo from '../../scripts/generateReleaseInfo.mjs';
 
-const rootDir = path.resolve(import.meta.dirname, '../..');
+// `expand` measures one entrypoint per sub-path export declared in a package's
+// (built) `package.json`, minus the `exclude` micromatch globs (matched against
+// the export subpath). The excludes below express *what is not a renderable
+// component*, so newly added components are tracked automatically.
 
-async function findComponents(packageFolder, packageName) {
-  const pkgBuildFolder = path.join(rootDir, `packages/${packageFolder}/build`);
-  const pkgFiles = await globby(path.join(pkgBuildFolder, '([A-Z])*/index.js'));
-  const pkgComponents = pkgFiles.map((componentPath) => {
-    const componentName = path.basename(path.dirname(componentPath));
-    return `${packageName}/${componentName}`;
-  });
-  return pkgComponents;
-}
+// Renderable components are PascalCase; every lowercase-first sub-path export
+// (hooks, models, locales, internals, utils, internals/demo, moduleAugmentation/*, …)
+// is a non-component. A single rule covers them at any depth.
+const componentPackage = { exclude: ['[a-z]*', '[a-z]*/**'] };
 
-// Sub-path exports that aren't renderable components and therefore shouldn't be
-// tracked individually for bundle size (types, locales, augmentations, internals).
-// Add to this denylist when introducing non-component sub-path exports (e.g. `utils`, `colors`).
-const NON_COMPONENT_EXPORTS = new Set(['models', 'locales', 'theme-augmentation', 'internals']);
+// Date-pickers additionally ship deprecated v2 adapters we don't track.
+const pickersPackage = {
+  exclude: [...componentPackage.exclude, 'AdapterDateFnsJalaliV2', 'AdapterDateFnsV2'],
+};
 
-/**
- * Lists the component entrypoints of a package from its `exports` field.
- *
- * Unlike `findComponents`, which scans the build output for PascalCase component
- * folders, this reads the explicit kebab-case sub-path exports used by the
- * scheduler packages, so newly added views are tracked automatically without
- * hardcoding them here.
- */
-function findComponentsFromExports(packageFolder, packageName) {
-  const pkgJsonPath = path.join(rootDir, `packages/${packageFolder}/package.json`);
-  const { exports: pkgExports } = JSON.parse(fs.readFileSync(pkgJsonPath, 'utf8'));
-  return Object.keys(pkgExports)
-    .filter((key) => key.startsWith('./'))
-    .map((key) => key.slice(2))
-    .filter((name) => !NON_COMPONENT_EXPORTS.has(name) && !name.startsWith('use-'))
-    .map((name) => `${packageName}/${name}`);
-}
-
-/**
- * Generates the entrypoints configuration by scanning the project structure.
- */
-export default defineConfig(async () => {
-  const [
-    chartsComponents,
-    chartsProComponents,
-    chartsPremiumComponents,
-    datePickersComponents,
-    datePickersProComponents,
-    treeViewComponents,
-    treeViewProComponents,
-  ] = await Promise.all([
-    findComponents('x-charts', '@mui/x-charts'),
-    findComponents('x-charts-pro', '@mui/x-charts-pro'),
-    findComponents('x-charts-premium', '@mui/x-charts-premium'),
-    findComponents('x-date-pickers', '@mui/x-date-pickers'),
-    findComponents('x-date-pickers-pro', '@mui/x-date-pickers-pro'),
-    findComponents('x-tree-view', '@mui/x-tree-view'),
-    findComponents('x-tree-view-pro', '@mui/x-tree-view-pro'),
-  ]);
+// Scheduler views are kebab-case (lowercase), so the case rule can't distinguish
+// them from non-components; deny the known non-view sub-paths instead.
+const schedulerPackage = {
+  exclude: ['models', 'locales', 'theme-augmentation', 'internals', 'use-*'],
+};
 
-  // Return the complete entrypoints configuration
-  return {
-    entrypoints: [
-      '@mui/x-data-grid',
-      '@mui/x-data-grid/DataGrid',
-      '@mui/x-data-grid-pro',
-      '@mui/x-data-grid-pro/DataGridPro',
-      '@mui/x-data-grid-premium',
-      '@mui/x-data-grid-premium/DataGridPremium',
-      '@mui/x-charts',
-      ...chartsComponents,
-      '@mui/x-charts-pro',
-      ...chartsProComponents,
-      '@mui/x-charts-premium',
-      ...chartsPremiumComponents,
-      '@mui/x-date-pickers',
-      ...datePickersComponents.filter(
-        (component) =>
-          !component.includes('AdapterDateFnsJalaliV2') && !component.includes('AdapterDateFnsV2'),
-      ),
-      '@mui/x-date-pickers-pro',
-      ...datePickersProComponents.filter(
-        (component) =>
-          !component.includes('AdapterDateFnsJalaliV2') && !component.includes('AdapterDateFnsV2'),
-      ),
-      '@mui/x-tree-view',
-      ...treeViewComponents,
-      '@mui/x-tree-view-pro',
-      ...treeViewProComponents,
-      '@mui/x-scheduler',
-      ...findComponentsFromExports('x-scheduler', '@mui/x-scheduler'),
-      '@mui/x-scheduler-premium',
-      ...findComponentsFromExports('x-scheduler-premium', '@mui/x-scheduler-premium'),
-      '@mui/x-license',
-      '@mui/x-license/internals',
-    ],
-    upload: !!process.env.CI,
-    replace: {
-      // Stabilize release info string
-      [JSON.stringify(generateReleaseInfo())]: JSON.stringify('__RELEASE_INFO__'),
-    },
-    comment: true,
-  };
+export default defineConfig({
+  entrypoints: [
+    { id: '@mui/x-data-grid', expand: componentPackage },
+    { id: '@mui/x-data-grid-pro', expand: componentPackage },
+    { id: '@mui/x-data-grid-premium', expand: componentPackage },
+    { id: '@mui/x-charts', expand: componentPackage },
+    { id: '@mui/x-charts-pro', expand: componentPackage },
+    { id: '@mui/x-charts-premium', expand: componentPackage },
+    { id: '@mui/x-date-pickers', expand: pickersPackage },
+    { id: '@mui/x-date-pickers-pro', expand: pickersPackage },
+    { id: '@mui/x-tree-view', expand: componentPackage },
+    { id: '@mui/x-tree-view-pro', expand: componentPackage },
+    { id: '@mui/x-scheduler', expand: schedulerPackage },
+    { id: '@mui/x-scheduler-premium', expand: schedulerPackage },
+    { id: '@mui/x-chat', expand: componentPackage },
+    { id: '@mui/x-license', expand: componentPackage },
+  ],
+  upload: !!process.env.CI,
+  replace: {
+    // Stabilize release info string
+    [JSON.stringify(generateReleaseInfo())]: JSON.stringify('__RELEASE_INFO__'),
+  },
+  comment: true,
 });

test/bundle-size/bundle-size-checker.config.mjs

@@ -5,6 +5,7 @@
     "check": "NODE_OPTIONS=\"--max-old-space-size=4096\" bundle-size-checker --output ../size-snapshot.json"
   },
   "dependencies": {
+    "@mui/x-chat": "workspace:^",
     "@mui/x-data-grid": "workspace:^",
     "@mui/x-data-grid-pro": "workspace:^",
     "@mui/x-data-grid-premium": "workspace:^",
@@ -14,6 +15,8 @@
     "@mui/x-date-pickers": "workspace:^",
     "@mui/x-date-pickers-pro": "workspace:^",
     "@mui/x-license": "workspace:^",
+    "@mui/x-scheduler": "workspace:^",
+    "@mui/x-scheduler-premium": "workspace:^",
     "@mui/x-tree-view": "workspace:^",
     "@mui/x-tree-view-pro": "workspace:^"
   }