[code-infra] Allow specifying a custom error formatter module for error minifcation (mui#45291)

Author: Janpot

.codesandbox/ci.json

@@ -20,6 +20,7 @@
     "packages/mui-system",
     "packages/mui-types",
     "packages/mui-utils",
+    "packages-internal/babel-plugin-minify-errors",
     "packages-internal/babel-plugin-resolve-imports",
     "packages-internal/docs-utils",
     "packages-internal/scripts",
@@ -35,6 +36,7 @@
     "@mui/internal-docs-utils": "packages-internal/docs-utils",
     "@mui/internal-markdown": "packages/markdown",
     "@mui/internal-scripts": "packages-internal/scripts",
+    "@mui/internal-babel-plugin-minify-errors": "packages-internal/babel-plugin-minify-errors",
     "@mui/internal-babel-plugin-resolve-imports": "packages-internal/babel-plugin-resolve-imports",
     "@mui/lab": "packages/mui-lab/build",
     "@mui/material-nextjs": "packages/mui-material-nextjs/build",

babel.config.js

@@ -106,6 +106,7 @@ module.exports = function getBabelConfig(api) {
       {
         missingError,
         errorCodesPath,
+        runtimeModule: '@mui/utils/formatMuiErrorMessage',
       },
     ],
     ...(useESModules

dangerfile.js

@@ -1,7 +1,7 @@
+// eslint-disable-next-line import/no-unresolved
+const tsx = require('tsx/cjs/api');
+
 // danger uses babelify under the hood. The implementation is buggy and fails on our
 // custom plugins in our codebase. We'll just disable it and do our own compilation.
 // Danger must always be run with envirnonent variable `DANGER_DISABLE_TRANSPILATION="true"`.
-require('@babel/register')({
-  extensions: ['.js', '.ts', '.tsx'],
-});
-require('./dangerFileContent');
+tsx.require('./dangerFileContent', __filename);

packages-internal/babel-plugin-minify-errors/__fixtures__/.eslintrc.js

@@ -8,5 +8,8 @@ module.exports = {
     // Babel import helpers do not add one.
     // Since this is auto generated code we don't care about code style.
     'import/newline-after-import': 'off',
+    'import/no-unresolved': 'off',
+    '@typescript-eslint/no-unused-vars': 'off',
+    'no-undef': 'off',
   },
 };

packages-internal/babel-plugin-minify-errors/__fixtures__/custom-runtime-imports-recursive/error-codes.json

@@ -0,0 +1,3 @@
+{
+  "42": "MUI: This is a test error message.\nWith a second line."
+}

packages-internal/babel-plugin-minify-errors/__fixtures__/custom-runtime-imports-recursive/input.js

@@ -0,0 +1 @@
+throw /* minify-error */ new Error('MUI: This is a test error message.\n' + 'With a second line.');

packages-internal/babel-plugin-minify-errors/__fixtures__/custom-runtime-imports-recursive/output.js

@@ -0,0 +1,6 @@
+import _formatErrorMessage from '@custom/error-formatter';
+throw new Error(
+  process.env.NODE_ENV !== 'production'
+    ? 'MUI: This is a test error message.\n' + 'With a second line.'
+    : _formatErrorMessage(42),
+);

packages-internal/babel-plugin-minify-errors/__fixtures__/custom-runtime-imports-recursive/package.json

@@ -0,0 +1,7 @@
+{
+  "imports": {
+    "#error-formatter": "#error-formatter-2",
+    "#error-formatter-2": "#error-formatter-3",
+    "#error-formatter-3": "@custom/error-formatter"
+  }
+}

packages-internal/babel-plugin-minify-errors/__fixtures__/custom-runtime-imports-relative/error-codes.json

@@ -0,0 +1,3 @@
+{
+  "42": "MUI: This is a test error message.\nWith a second line."
+}

packages-internal/babel-plugin-minify-errors/__fixtures__/custom-runtime-imports-relative/error/formatter.ts

@@ -0,0 +1,3 @@
+export default function formatter() {
+  return 'Hello world';
+}

packages-internal/babel-plugin-minify-errors/__fixtures__/custom-runtime-imports-relative/input.js

@@ -0,0 +1 @@
+throw /* minify-error */ new Error('MUI: This is a test error message.\n' + 'With a second line.');

packages-internal/babel-plugin-minify-errors/__fixtures__/custom-runtime-imports-relative/output.js

@@ -0,0 +1,6 @@
+import _formatErrorMessage from './error/formatter.js';
+throw new Error(
+  process.env.NODE_ENV !== 'production'
+    ? 'MUI: This is a test error message.\n' + 'With a second line.'
+    : _formatErrorMessage(42),
+);

packages-internal/babel-plugin-minify-errors/__fixtures__/custom-runtime-imports-relative/package.json

@@ -0,0 +1,5 @@
+{
+  "imports": {
+    "#error-formatter": "./error/formatter.ts"
+  }
+}

packages-internal/babel-plugin-minify-errors/__fixtures__/custom-runtime-imports/error-codes.json

@@ -0,0 +1,3 @@
+{
+  "42": "MUI: This is a test error message.\nWith a second line."
+}

packages-internal/babel-plugin-minify-errors/__fixtures__/custom-runtime-imports/input.js

@@ -0,0 +1 @@
+throw /* minify-error */ new Error('MUI: This is a test error message.\n' + 'With a second line.');

packages-internal/babel-plugin-minify-errors/__fixtures__/custom-runtime-imports/output.js

@@ -0,0 +1,6 @@
+import _formatErrorMessage from '@custom/error-formatter';
+throw new Error(
+  process.env.NODE_ENV !== 'production'
+    ? 'MUI: This is a test error message.\n' + 'With a second line.'
+    : _formatErrorMessage(42),
+);

packages-internal/babel-plugin-minify-errors/__fixtures__/custom-runtime-imports/package.json

@@ -0,0 +1,5 @@
+{
+  "imports": {
+    "#error-formatter": "@custom/error-formatter"
+  }
+}

packages-internal/babel-plugin-minify-errors/__fixtures__/custom-runtime/error-codes.json

@@ -0,0 +1,3 @@
+{
+  "42": "MUI: This is a test error message.\nWith a second line."
+}

packages-internal/babel-plugin-minify-errors/__fixtures__/custom-runtime/input.js

@@ -0,0 +1 @@
+throw /* minify-error */ new Error('MUI: This is a test error message.\n' + 'With a second line.');

packages-internal/babel-plugin-minify-errors/__fixtures__/custom-runtime/output.js

@@ -0,0 +1,6 @@
+import _formatErrorMessage from '@custom/error-formatter';
+throw new Error(
+  process.env.NODE_ENV !== 'production'
+    ? 'MUI: This is a test error message.\n' + 'With a second line.'
+    : _formatErrorMessage(42),
+);

packages-internal/babel-plugin-minify-errors/__fixtures__/error-code-extraction/output.js

@@ -1,5 +1,3 @@
-import _formatMuiErrorMessage from '@mui/utils/formatMuiErrorMessage';
-throw new Error(process.env.NODE_ENV !== 'production' ? 'exists' : _formatMuiErrorMessage(1));
-throw new Error(
-  process.env.NODE_ENV !== 'production' ? 'will be created' : _formatMuiErrorMessage(2),
-);
+import _formatErrorMessage from '@mui/utils/formatMuiErrorMessage';
+throw new Error(process.env.NODE_ENV !== 'production' ? 'exists' : _formatErrorMessage(1));
+throw new Error(process.env.NODE_ENV !== 'production' ? 'will be created' : _formatErrorMessage(2));

packages-internal/babel-plugin-minify-errors/__fixtures__/interpolation/output.js

@@ -1,18 +1,16 @@
-import _formatMuiErrorMessage from '@mui/utils/formatMuiErrorMessage';
+import _formatErrorMessage from '@mui/utils/formatMuiErrorMessage';
 const foo = 'foo';
 const bar = 'bar';
 throw new Error(
-  process.env.NODE_ENV !== 'production'
-    ? `MUI: ${foo}, ${bar}`
-    : _formatMuiErrorMessage(1, foo, bar),
+  process.env.NODE_ENV !== 'production' ? `MUI: ${foo}, ${bar}` : _formatErrorMessage(1, foo, bar),
 );
 throw new Error(
   process.env.NODE_ENV !== 'production'
     ? `MUI: ${foo}` + `, ${bar}`
-    : _formatMuiErrorMessage(1, foo, bar),
+    : _formatErrorMessage(1, foo, bar),
 );
 throw new Error(
   process.env.NODE_ENV !== 'production'
     ? 'MUI: ' + `${foo}, ${bar}`
-    : _formatMuiErrorMessage(1, foo, bar),
+    : _formatErrorMessage(1, foo, bar),
 );

packages-internal/babel-plugin-minify-errors/__fixtures__/literal/output.js

@@ -1,11 +1,11 @@
-import _formatMuiErrorMessage from '@mui/utils/formatMuiErrorMessage';
+import _formatErrorMessage from '@mui/utils/formatMuiErrorMessage';
 throw new Error(
   process.env.NODE_ENV !== 'production'
     ? 'MUI: Expected valid input target.\n' + 'Did you use `inputComponent`'
-    : _formatMuiErrorMessage(1),
+    : _formatErrorMessage(1),
 );
 throw new Error(
   process.env.NODE_ENV !== 'production'
     ? `MUI: Expected valid input target.\n` + `Did you use \`inputComponent\``
-    : _formatMuiErrorMessage(1),
+    : _formatErrorMessage(1),
 );