@mui/internal-bundle-size-checker 1.0.9-canary.5 → 1.0.9-canary.50

package/src/configLoader.js

@@ -2,9 +2,11 @@
  * Utility to load the bundle-size-checker configuration
  */
 
-import fs from 'fs';
-import path from 'path';
+import fs from 'node:fs/promises';
+import path from 'node:path';
 import envCi from 'env-ci';
+import * as module from 'node:module';
+import * as url from 'node:url';
 
 /**
  * Attempts to load and parse a single config file
@@ -14,10 +16,6 @@ import envCi from 'env-ci';
  */
 async function loadConfigFile(configPath) {
   try {
-    if (!fs.existsSync(configPath)) {
-      return null;
-    }
-
     // Dynamic import for ESM
     const configUrl = new URL(`file://${configPath}`);
     const { default: config } = await import(configUrl.href);
@@ -29,12 +27,18 @@ async function loadConfigFile(configPath) {
       resolvedConfig = await config;
     } else if (typeof config === 'function') {
       resolvedConfig = await config();
+    } else {
+      // Handle plain config objects
+      resolvedConfig = config;
     }
 
     return resolvedConfig;
-  } catch (error) {
-    console.error(`Error loading config from ${configPath}:`, error);
-    throw error; // Re-throw to indicate failure
+  } catch (/** @type {any} */ error) {
+    if (error.code === 'ERR_MODULE_NOT_FOUND') {
+      return null;
+    }
+
+    throw error;
   }
 }
 
@@ -77,59 +81,132 @@ export function applyUploadConfigDefaults(uploadConfig, ciInfo) {
   };
 }
 
+/**
+ * @param {{ [s: string]: any; } | ArrayLike<any>} exportsObj
+ * @returns {string[]} Array of export paths
+ */
+function findExports(exportsObj) {
+  const paths = [];
+  for (const [key, value] of Object.entries(exportsObj)) {
+    // ignore null values
+    if (!value) {
+      continue;
+    }
+    if (key.startsWith('.')) {
+      paths.push(key);
+    } else {
+      paths.push(...findExports(value));
+    }
+  }
+  return paths;
+}
+
+/**
+ * @param {import("fs").PathLike | fs.FileHandle} pkgJson
+ * @returns {Promise<string[]>}
+ */
+async function findExportedPaths(pkgJson) {
+  const pkgContent = await fs.readFile(pkgJson, 'utf8');
+  const { exports = {} } = JSON.parse(pkgContent);
+  return findExports(exports);
+}
+
+/**
+ * Checks if the given import source is a top-level package
+ * @param {string} importSrc - The import source string
+ * @returns {boolean} - True if it's a top-level package, false otherwise
+ */
+function isPackageTopLevel(importSrc) {
+  const parts = importSrc.split('/');
+  return parts.length === 1 || (parts.length === 2 && parts[0].startsWith('@'));
+}
+
 /**
  * Normalizes entries to ensure they have a consistent format and ids are unique
  * @param {EntryPoint[]} entries - The array of entries from the config
- * @returns {ObjectEntry[]} - Normalized entries with uniqueness enforced
+ * @param {string} configPath - The path to the configuration file
+ * @returns {Promise<ObjectEntry[]>} - Normalized entries with uniqueness enforced
  */
-function normalizeEntries(entries) {
+async function normalizeEntries(entries, configPath) {
   const usedIds = new Set();
 
-  return entries.map((entry) => {
-    if (typeof entry === 'string') {
-      // Transform string entries into object entries
-      const [importSrc, importName] = entry.split('#');
-      if (importName) {
-        // For entries like '@mui/material#Button', create an object with import and importedNames
-        entry = {
-          id: entry,
-          import: importSrc,
-          importedNames: [importName],
-        };
-      } else {
-        // For entries like '@mui/material', create an object with import only
-        entry = {
-          id: entry,
-          import: importSrc,
-        };
-      }
-    }
+  const result = (
+    await Promise.all(
+      entries.map(async (entry) => {
+        if (typeof entry === 'string') {
+          entry = { id: entry };
+        }
 
-    if (!entry.id) {
-      throw new Error('Object entries must have an id property');
-    }
+        entry = { ...entry };
 
-    if (!entry.code && !entry.import) {
-      throw new Error(`Entry "${entry.id}" must have either code or import property defined`);
-    }
+        if (!entry.id) {
+          throw new Error('Object entries must have an id property');
+        }
 
+        if (!entry.code && !entry.import) {
+          // Transform string entries into object entries
+          const [importSrc, importName] = entry.id.split('#');
+          entry.import = importSrc;
+          if (importName) {
+            entry.importedNames = [importName];
+          }
+          if (isPackageTopLevel(entry.import) && !entry.importedNames) {
+            entry.track = true;
+          }
+        }
+
+        if (entry.expand) {
+          if (!entry.import || !isPackageTopLevel(entry.import)) {
+            throw new Error(
+              `Entry "${entry.id}": expand can only be used with top-level package imports`,
+            );
+          }
+          if (!module.findPackageJSON) {
+            throw new Error(
+              "Your Node.js version doesn't support `module.findPackageJSON`, which is required to expand entries.",
+            );
+          }
+          const pkgJson = module.findPackageJSON(entry.import, url.pathToFileURL(configPath));
+          if (!pkgJson) {
+            throw new Error(`Can't find package.json for entry "${entry.id}".`);
+          }
+          const exportedPaths = await findExportedPaths(pkgJson);
+
+          const expandedEntries = [];
+          for (const exportPath of exportedPaths) {
+            const importSrc = entry.import + exportPath.slice(1);
+            expandedEntries.push({
+              id: importSrc,
+              import: importSrc,
+              track: isPackageTopLevel(importSrc),
+            });
+          }
+          return expandedEntries;
+        }
+
+        return [entry];
+      }),
+    )
+  ).flat();
+
+  for (const entry of result) {
     if (usedIds.has(entry.id)) {
       throw new Error(`Duplicate entry id found: "${entry.id}". Entry ids must be unique.`);
     }
-
     usedIds.add(entry.id);
+  }
 
-    return entry;
-  });
+  return result;
 }
 
 /**
  * Apply default values to the configuration using CI environment
  * @param {BundleSizeCheckerConfigObject} config - The loaded configuration
- * @returns {NormalizedBundleSizeCheckerConfig} Configuration with defaults applied
+ * @param {string} configPath - The path to the configuration file
+ * @returns {Promise<NormalizedBundleSizeCheckerConfig>} Configuration with defaults applied
  * @throws {Error} If required fields are missing
  */
-function applyConfigDefaults(config) {
+async function applyConfigDefaults(config, configPath) {
   // Get environment CI information
   /** @type {{ branch?: string, isPr?: boolean, prBranch?: string, slug?: string}} */
   const ciInfo = envCi();
@@ -145,8 +222,10 @@ function applyConfigDefaults(config) {
   // Clone the config to avoid mutating the original
   /** @type {NormalizedBundleSizeCheckerConfig} */
   const result = {
-    entrypoints: normalizeEntries(config.entrypoints),
+    entrypoints: await normalizeEntries(config.entrypoints, configPath),
     upload: null, // Default to disabled
+    comment: config.comment !== undefined ? config.comment : true, // Default to enabled
+    replace: config.replace || {}, // String replacements, default to empty object
   };
 
   // Handle different types of upload value
@@ -195,7 +274,7 @@ export async function loadConfig(rootDir) {
     const config = await loadConfigFile(configPath);
     if (config) {
       // Apply defaults and return the config
-      return applyConfigDefaults(config);
+      return applyConfigDefaults(config, configPath);
     }
   }
 

package/src/constants.js

@@ -0,0 +1 @@
+export const DASHBOARD_ORIGIN = 'https://frontend-public.mui.com';

package/src/fetchSnapshot.js

@@ -1,10 +1,10 @@
-import { octokit } from './github.js';
+// This file must be importable in the browser
 
 /**
  *
  * @param {string} repo - The name of the repository e.g. 'mui/material-ui'
  * @param {string} sha - The commit SHA
- * @returns {Promise<import('./sizeDiff').SizeSnapshot>} - The size snapshot data
+ * @returns {Promise<import('./sizeDiff.js').SizeSnapshot>} - The size snapshot data
  */
 export async function fetchSnapshot(repo, sha) {
   const urlsToTry = [
@@ -27,7 +27,7 @@ export async function fetchSnapshot(repo, sha) {
         continue;
       }
 
-      return response.json();
+      return /** @type {Promise<any>} */ (response.json());
     } catch (error) {
       lastError = error;
       continue;
@@ -36,61 +36,3 @@ export async function fetchSnapshot(repo, sha) {
 
   throw new Error(`Failed to fetch snapshot`, { cause: lastError });
 }
-
-/**
- * Gets parent commits for a given commit SHA using GitHub API
- * @param {string} repo - Repository name (e.g., 'mui/material-ui')
- * @param {string} commit - The commit SHA to start from
- * @param {number} depth - How many commits to retrieve (including the starting commit)
- * @returns {Promise<string[]>} Array of commit SHAs in chronological order (excluding the starting commit)
- */
-async function getParentCommits(repo, commit, depth = 4) {
-  try {
-    const [owner, repoName] = repo.split('/');
-
-    const { data: commits } = await octokit.repos.listCommits({
-      owner,
-      repo: repoName,
-      sha: commit,
-      per_page: depth,
-    });
-
-    // Skip the first commit (which is the starting commit) and return the rest
-    return commits.slice(1).map((commitDetails) => commitDetails.sha);
-  } catch (/** @type {any} */ error) {
-    console.warn(`Failed to get parent commits for ${commit}: ${error.message}`);
-    return [];
-  }
-}
-
-/**
- * Attempts to fetch a snapshot with fallback to parent commits
- * @param {string} repo - Repository name
- * @param {string} commit - The commit SHA to start from
- * @param {number} [fallbackDepth=3] - How many parent commits to try as fallback
- * @returns {Promise<{snapshot: import('./sizeDiff').SizeSnapshot | null, actualCommit: string | null}>}
- */
-export async function fetchSnapshotWithFallback(repo, commit, fallbackDepth = 3) {
-  // Try the original commit first
-  try {
-    const snapshot = await fetchSnapshot(repo, commit);
-    return { snapshot, actualCommit: commit };
-  } catch (/** @type {any} */ error) {
-    // fallthrough to parent commits if the snapshot for the original commit fails
-  }
-
-  // Get parent commits and try each one
-  const parentCommits = await getParentCommits(repo, commit, fallbackDepth + 1);
-
-  for (const parentCommit of parentCommits) {
-    try {
-      // eslint-disable-next-line no-await-in-loop
-      const snapshot = await fetchSnapshot(repo, parentCommit);
-      return { snapshot, actualCommit: parentCommit };
-    } catch {
-      // fallthrough to the next parent commit if fetching fails
-    }
-  }
-
-  return { snapshot: null, actualCommit: null };
-}

package/src/fetchSnapshotWithFallback.js

@@ -0,0 +1,34 @@
+import { fetchSnapshot } from './fetchSnapshot.js';
+import { getParentCommits } from './git.js';
+
+/**
+ * Attempts to fetch a snapshot with fallback to parent commits
+ * @param {string} repo - Repository name
+ * @param {string} commit - The commit SHA to start from
+ * @param {number} [fallbackDepth=3] - How many parent commits to try as fallback
+ * @returns {Promise<{snapshot: import('./sizeDiff.js').SizeSnapshot | null, actualCommit: string | null}>}
+ */
+export async function fetchSnapshotWithFallback(repo, commit, fallbackDepth = 3) {
+  // Try the original commit first
+  try {
+    const snapshot = await fetchSnapshot(repo, commit);
+    return { snapshot, actualCommit: commit };
+  } catch (/** @type {any} */ error) {
+    // fallthrough to parent commits if the snapshot for the original commit fails
+  }
+
+  // Get parent commits and try each one
+  const parentCommits = await getParentCommits(repo, commit, fallbackDepth);
+
+  for (const parentCommit of parentCommits) {
+    try {
+      // eslint-disable-next-line no-await-in-loop
+      const snapshot = await fetchSnapshot(repo, parentCommit);
+      return { snapshot, actualCommit: parentCommit };
+    } catch {
+      // fallthrough to the next parent commit if fetching fails
+    }
+  }
+
+  return { snapshot: null, actualCommit: null };
+}

package/src/git.js

@@ -0,0 +1,50 @@
+import { execa } from 'execa';
+import gitUrlParse from 'git-url-parse';
+
+/**
+ * Gets parent commits for a given commit SHA using git CLI
+ * @param {string} repo - Repository name (e.g., 'mui/material-ui') - ignored for git CLI
+ * @param {string} commit - The commit SHA to start from
+ * @param {number} depth - How many commits to retrieve (including the starting commit)
+ * @returns {Promise<string[]>} Array of commit SHAs in chronological order (excluding the starting commit)
+ */
+export async function getParentCommits(repo, commit, depth = 3) {
+  const { stdout } = await execa('git', ['rev-list', `--max-count=${depth}`, '--skip=1', commit]);
+  return stdout.trim().split('\n').filter(Boolean);
+}
+
+/**
+ * Compares two commits and returns merge base information using git CLI
+ * @param {string} base - Base commit SHA
+ * @param {string} head - Head commit SHA
+ * @returns {Promise<string>} Object with merge base commit info
+ */
+export async function getMergeBase(base, head) {
+  const { stdout } = await execa('git', ['merge-base', base, head]);
+  return stdout.trim();
+}
+
+/**
+ * Gets the current repository owner and name from git remote
+ * @returns {Promise<string | null>}
+ */
+async function getRemoteUrl(remote = 'origin') {
+  try {
+    const { stdout } = await execa('git', ['remote', 'get-url', remote]);
+    return stdout.trim();
+  } catch {
+    return null;
+  }
+}
+
+/**
+ * Gets the current repository owner and name from git remote
+ * @returns {Promise<{owner: string | null, name: string | null}>}
+ */
+export async function getCurrentRepoInfo() {
+  const remoteUrl = (await getRemoteUrl('upstream')) || (await getRemoteUrl('origin'));
+  if (!remoteUrl) {
+    return { owner: null, name: null };
+  }
+  return gitUrlParse(remoteUrl);
+}

package/src/github.js

@@ -4,4 +4,7 @@ import { Octokit } from '@octokit/rest';
 
 // Create and export Octokit instance
 /** @type {import('@octokit/rest').Octokit} */
-export const octokit = new Octokit();
+export const octokit = new Octokit({
+  auth: process.env.DANGER_GITHUB_API_TOKEN,
+  userAgent: 'bundle-size-checker',
+});

package/src/index.js

@@ -1,13 +1,7 @@
+/// <reference types="./types.d.ts" />
+
 import defineConfig from './defineConfig.js';
 import { loadConfig } from './configLoader.js';
-import { calculateSizeDiff } from './sizeDiff.js';
 import { renderMarkdownReport } from './renderMarkdownReport.js';
-import { fetchSnapshot } from './fetchSnapshot.js';
-
-export { defineConfig, loadConfig, calculateSizeDiff, renderMarkdownReport, fetchSnapshot };
 
-/**
- * @typedef {import('./sizeDiff.js').Size} Size
- * @typedef {import('./sizeDiff.js').SizeSnapshot} SizeSnapshot
- * @typedef {import('./sizeDiff.js').ComparisonResult} ComparisonResult
- */
+export { defineConfig, loadConfig, renderMarkdownReport };

package/src/notifyPr.js

@@ -0,0 +1,81 @@
+// @ts-check
+
+import { octokit } from './github.js';
+
+/**
+ * Recursively searches for a comment containing the specified marker.
+ * Searches page-by-page (newest first) and stops when found or no more pages exist.
+ *
+ * @param {string} owner - Repository owner
+ * @param {string} repoName - Repository name
+ * @param {number} prNumber - Pull request number
+ * @param {string} marker - HTML comment marker to search for
+ * @param {number} page - Current page number (default: 1)
+ */
+async function findCommentByMarker(owner, repoName, prNumber, marker, page = 1) {
+  const { data: comments } = await octokit.issues.listComments({
+    owner,
+    repo: repoName,
+    issue_number: prNumber,
+    sort: 'updated',
+    direction: 'desc',
+    per_page: 100,
+    page,
+  });
+
+  // Base case: no comments on this page
+  if (comments.length <= 0) {
+    return null;
+  }
+
+  // Success case: found comment with marker
+  const foundComment = comments.find((comment) => comment.body && comment.body.includes(marker));
+  if (foundComment) {
+    return foundComment;
+  }
+
+  return findCommentByMarker(owner, repoName, prNumber, marker, page + 1);
+}
+
+/**
+ * Creates or updates a comment on a pull request with the specified content.
+ * Uses an HTML comment marker to identify and update existing comments.
+ * Searches page-by-page (newest first) and stops early when comment is found.
+ *
+ * @param {string} repo - The repository in format "owner/repo"
+ * @param {number} prNumber - The pull request number
+ * @param {string} id - Unique identifier to mark the comment for future updates
+ * @param {string} content - The content to post or update in the comment
+ * @returns {Promise<void>}
+ */
+export async function notifyPr(repo, prNumber, id, content) {
+  const [owner, repoName] = repo.split('/');
+
+  if (!owner || !repoName) {
+    throw new Error(`Invalid repo format. Expected "owner/repo", got "${repo}"`);
+  }
+
+  const marker = `<!-- bundle-size-checker-id: ${id} -->`;
+  const commentBody = `${marker}\n${content}`;
+
+  // Search for existing comment with our marker
+  const existingComment = await findCommentByMarker(owner, repoName, prNumber, marker);
+
+  if (existingComment) {
+    // Update existing comment
+    await octokit.issues.updateComment({
+      owner,
+      repo: repoName,
+      comment_id: existingComment.id,
+      body: commentBody,
+    });
+  } else {
+    // Create new comment
+    await octokit.issues.createComment({
+      owner,
+      repo: repoName,
+      issue_number: prNumber,
+      body: commentBody,
+    });
+  }
+}

package/src/renderMarkdownReport.js

@@ -5,9 +5,11 @@
  */
 
 import { calculateSizeDiff } from './sizeDiff.js';
-import { fetchSnapshot, fetchSnapshotWithFallback } from './fetchSnapshot.js';
+import { fetchSnapshot } from './fetchSnapshot.js';
 import { displayPercentFormatter, byteSizeChangeFormatter } from './formatUtils.js';
-import { octokit } from './github.js';
+import { getMergeBase } from './git.js';
+import { fetchSnapshotWithFallback } from './fetchSnapshotWithFallback.js';
+import { DASHBOARD_ORIGIN } from './constants.js';
 
 /**
  * Generates a symbol based on the relative change value.
@@ -97,11 +99,13 @@ function formatMarkdownTable(columns, data) {
   const separators = alignments.map((align) => {
     switch (align) {
       case 'center':
-        return ':----------:';
+        return ':---------:';
       case 'right':
         return '----------:';
+      case 'left':
+        return ':----------';
       default:
-        return '----------';
+        return '-----------';
     }
   });
   table += `|${separators.join('|')}|\n`;
@@ -141,9 +145,9 @@ export function renderMarkdownReportContent(
 
     markdownContent += formatMarkdownTable(
       [
-        { field: 'id', header: 'Bundle' },
-        { field: 'parsed', header: 'Parsed Size', align: 'right' },
-        { field: 'gzip', header: 'Gzip Size', align: 'right' },
+        { field: 'id', header: 'Bundle', align: 'left' },
+        { field: 'parsed', header: 'Parsed size', align: 'right' },
+        { field: 'gzip', header: 'Gzip size', align: 'right' },
       ],
       trackedEntries.map(({ id, parsed, gzip }) => ({
         id,
@@ -193,50 +197,40 @@ export function renderMarkdownReportContent(
  *
  * @param {PrInfo} prInfo
  * @param {Object} [options] - Optional parameters
- * @param {string | null} [options.circleciBuildNumber] - The CircleCI build number
  * @param {string | null} [options.actualBaseCommit] - The actual commit SHA used for comparison (may differ from prInfo.base.sha)
  * @returns {URL}
  */
 function getDetailsUrl(prInfo, options = {}) {
-  const { circleciBuildNumber, actualBaseCommit } = options;
+  const { actualBaseCommit } = options;
   const detailedComparisonUrl = new URL(
-    `https://frontend-public.mui.com/size-comparison/${prInfo.base.repo.full_name}/diff`,
+    `${DASHBOARD_ORIGIN}/size-comparison/${prInfo.base.repo.full_name}/diff`,
   );
   detailedComparisonUrl.searchParams.set('prNumber', String(prInfo.number));
   detailedComparisonUrl.searchParams.set('baseRef', prInfo.base.ref);
   detailedComparisonUrl.searchParams.set('baseCommit', actualBaseCommit || prInfo.base.sha);
   detailedComparisonUrl.searchParams.set('headCommit', prInfo.head.sha);
-  if (circleciBuildNumber) {
-    detailedComparisonUrl.searchParams.set('circleCIBuildNumber', circleciBuildNumber);
-  }
   return detailedComparisonUrl;
 }
 
 /**
  *
  * @param {PrInfo} prInfo
- * @param {string} [circleciBuildNumber] - The CircleCI build number
  * @param {Object} [options] - Additional options
  * @param {string[]} [options.track] - Array of bundle IDs to track
  * @param {number} [options.fallbackDepth=3] - How many parent commits to try as fallback when base snapshot is missing
  * @param {number} [options.maxDetailsLines=100] - Maximum number of bundles to show in details section
+ * @param {(base: string, head: string) => Promise<string>} [options.getMergeBase] - Custom function to get merge base commit
  * @returns {Promise<string>} Markdown report
  */
-export async function renderMarkdownReport(prInfo, circleciBuildNumber, options = {}) {
+export async function renderMarkdownReport(prInfo, options = {}) {
   let markdownContent = '';
 
   const prCommit = prInfo.head.sha;
   const repo = prInfo.base.repo.full_name;
   const { fallbackDepth = 3 } = options;
 
-  const [owner, repoName] = repo.split('/');
-  const { data } = await octokit.repos.compareCommits({
-    owner,
-    repo: repoName,
-    base: prInfo.base.sha,
-    head: prCommit,
-  });
-  const baseCommit = data.merge_base_commit.sha;
+  const getMergeBaseFn = options.getMergeBase || getMergeBase;
+  const baseCommit = await getMergeBaseFn(prInfo.base.sha, prCommit);
 
   const [baseResult, prSnapshot] = await Promise.all([
     fetchSnapshotWithFallback(repo, baseCommit, fallbackDepth),
@@ -257,7 +251,7 @@ export async function renderMarkdownReport(prInfo, circleciBuildNumber, options
 
   markdownContent += report;
 
-  markdownContent += `\n\n[Details of bundle changes](${getDetailsUrl(prInfo, { circleciBuildNumber, actualBaseCommit })})`;
+  markdownContent += `\n\n[Details of bundle changes](${getDetailsUrl(prInfo, { actualBaseCommit })})`;
 
   return markdownContent;
 }