Refactor manifest validation to provide detected exports

Author: Mrtenz

README.md

@@ -46,6 +46,7 @@ linkStyle default opacity:0.5
   snaps_webpack_plugin(["@metamask/snaps-webpack-plugin"]);
   create_snap --> snaps_utils;
   snaps_browserify_plugin --> snaps_utils;
+  snaps_cli --> snaps_rpc_methods;
   snaps_cli --> snaps_sdk;
   snaps_cli --> snaps_utils;
   snaps_cli --> snaps_webpack_plugin;

eslint.config.mjs

@@ -8,7 +8,6 @@ const config = createConfig([
   {
     ignores: [
       '**/assembly',
-      '**/build',
       '**/coverage',
       '**/dist',
       '**/docs',

packages/examples/packages/bip32/snap.manifest.json

@@ -7,7 +7,7 @@
     "url": "https://github.com/MetaMask/snaps.git"
   },
   "source": {
-    "shasum": "lAOhuBxoCTCoBqYjdh8u1Mww15lpVSplCQ7C/oogSss=",
+    "shasum": "BMMk7RupGFky19WknPFIC/In2AGkXv7dvJ3PrGHXYXA=",
     "location": {
       "npm": {
         "filePath": "dist/bundle.js",
@@ -17,10 +17,7 @@
     }
   },
   "initialPermissions": {
-    "endowment:rpc": {
-      "dapps": true,
-      "snaps": true
-    },
+    "endowment:page-home": {},
     "snap_dialog": {},
     "snap_getBip32Entropy": [
       {

packages/snaps-cli/package.json

@@ -64,6 +64,7 @@
     "test:watch": "jest --watch"
   },
   "dependencies": {
+    "@metamask/snaps-rpc-methods": "workspace:^",
     "@metamask/snaps-sdk": "workspace:^",
     "@metamask/snaps-utils": "workspace:^",
     "@metamask/snaps-webpack-plugin": "workspace:^",

packages/snaps-cli/src/commands/build/build.ts

@@ -1,19 +1,25 @@
-import { isFile } from '@metamask/snaps-utils/node';
+import { handlerEndowments } from '@metamask/snaps-rpc-methods';
+import { checkManifest, isFile } from '@metamask/snaps-utils/node';
+import { writeManifest } from '@metamask/snaps-webpack-plugin';
 import { assert } from '@metamask/utils';
-import { resolve as pathResolve } from 'path';
+import { red, reset, yellow } from 'chalk';
+import { readFile } from 'fs/promises';
+import { dirname, resolve as pathResolve } from 'path';
 
 import { build } from './implementation';
 import { getBundleAnalyzerPort } from './utils';
 import type { ProcessedConfig } from '../../config';
 import { CommandError } from '../../errors';
 import type { Steps } from '../../utils';
-import { success, executeSteps, info } from '../../utils';
+import { error, success, executeSteps, info, warn } from '../../utils';
+import { formatError } from '../../webpack/utils';
 import { evaluate } from '../eval';
 
 type BuildContext = {
   analyze: boolean;
   config: ProcessedConfig;
   port?: number;
+  exports?: string[];
 };
 
 const steps: Steps<BuildContext> = [
@@ -24,13 +30,13 @@ const steps: Steps<BuildContext> = [
 
       if (!(await isFile(input))) {
         throw new CommandError(
-          `Input file not found: "${input}". Make sure that the "input" field in your snap config is correct.`,
+          `Input file not found: "${input}". Make sure that the "input" field in your Snap config is correct.`,
         );
       }
     },
   },
   {
-    name: 'Building the snap bundle.',
+    name: 'Building the Snap bundle.',
     task: async ({ analyze, config, spinner }) => {
       // We don't evaluate the bundle here, because it's done in a separate
       // step.
@@ -53,18 +59,85 @@ const steps: Steps<BuildContext> = [
     },
   },
   {
-    name: 'Evaluating the snap bundle.',
+    name: 'Evaluating the Snap bundle.',
     condition: ({ config }) => config.evaluate,
-    task: async ({ config, spinner }) => {
+    task: async (context) => {
+      const { config, spinner } = context;
       const path = pathResolve(
         process.cwd(),
         config.output.path,
         config.output.filename,
       );
 
-      await evaluate(path);
+      const { exports } = await evaluate(path);
 
       info(`Snap bundle evaluated successfully.`, spinner);
+
+      return {
+        ...context,
+        exports,
+      };
+    },
+  },
+
+  // TODO: Share this between the `build` and `manifest` commands.
+  {
+    name: 'Validating the Snap manifest.',
+    condition: ({ config }) => config.evaluate,
+    task: async ({ config, exports, spinner }) => {
+      const bundlePath = pathResolve(
+        process.cwd(),
+        config.output.path,
+        config.output.filename,
+      );
+
+      const { reports } = await checkManifest(dirname(config.manifest.path), {
+        updateAndWriteManifest: config.manifest.update,
+        sourceCode: await readFile(bundlePath, 'utf-8'),
+        exports,
+        handlerEndowments,
+        writeFileFn: async (path, data) => {
+          return writeManifest(path, data);
+        },
+      });
+
+      // TODO: Use `Object.groupBy` when available.
+      const errors = reports
+        .filter((report) => report.severity === 'error' && !report.wasFixed)
+        .map((report) => report.message);
+      const warnings = reports
+        .filter((report) => report.severity === 'warning' && !report.wasFixed)
+        .map((report) => report.message);
+      const fixed = reports
+        .filter((report) => report.wasFixed)
+        .map((report) => report.message);
+
+      if (errors.length > 0) {
+        error(
+          `The following errors were found in the manifest:\n\n${errors
+            .map((value) => formatError(value, '', red))
+            .join('\n\n')}\n`,
+          spinner,
+        );
+      }
+
+      if (warnings.length > 0) {
+        warn(
+          `The following warnings were found in the manifest:\n\n${warnings
+            .map((value) => formatError(value, '', yellow))
+            .join('\n\n')}\n`,
+          spinner,
+        );
+      }
+
+      if (fixed.length > 0) {
+        info(
+          `The following issues were fixed in the manifest:\n\n${reset(
+            fixed.map((value) => formatError(value, '', reset)).join('\n\n'),
+          )}\n`,
+          spinner,
+        );
+      }
     },
   },
   {

packages/snaps-cli/src/webpack/config.ts

@@ -305,8 +305,7 @@ export async function getDefaultConfiguration(
        * required, it's highly recommended to use this plugin.
        */
       new SnapsWebpackPlugin({
-        manifestPath: config.manifest.path,
-        writeManifest: config.manifest.update,
+        manifestPath: undefined,
         eval: !options.watch && options.evaluate,
       }),
 

packages/snaps-cli/src/webpack/plugins.ts

@@ -1,19 +1,18 @@
 import { assert, hasProperty, isObject } from '@metamask/utils';
-import { bold, dim, red, yellow } from 'chalk';
+import { bold, red, yellow } from 'chalk';
 import { isBuiltin } from 'module';
 import type { Ora } from 'ora';
 import type {
   Compiler,
   ProvidePlugin,
   Resolver,
-  StatsError,
   WebpackPluginInstance,
 } from 'webpack';
 import { WebpackError } from 'webpack';
 
-import { formatText, pluralize } from './utils';
+import { formatError, pluralize } from './utils';
 import { evaluate } from '../commands/eval';
-import { error, getErrorMessage, info, warn } from '../utils';
+import { error, info, warn } from '../utils';
 
 export type SnapsStatsPluginOptions = {
   /**
@@ -65,7 +64,9 @@ export class SnapsStatsPlugin implements WebpackPluginInstance {
 
       if (errors?.length) {
         const formattedErrors = errors
-          .map((statsError) => this.#getStatsErrorMessage(statsError))
+          .map((statsError) =>
+            formatError(statsError.message, statsError.details, red),
+          )
           .join('\n\n');
 
         error(
@@ -88,7 +89,7 @@ export class SnapsStatsPlugin implements WebpackPluginInstance {
       if (warnings?.length) {
         const formattedWarnings = warnings
           .map((statsWarning) =>
-            this.#getStatsErrorMessage(statsWarning, yellow),
+            formatError(statsWarning.message, statsWarning.details, yellow),
           )
           .join('\n\n');
 
@@ -119,29 +120,6 @@ export class SnapsStatsPlugin implements WebpackPluginInstance {
       }
     });
   }
-
-  /**
-   * Get the error message for the given stats error.
-   *
-   * @param statsError - The stats error.
-   * @param color - The color to use for the error message.
-   * @returns The error message.
-   */
-  #getStatsErrorMessage(statsError: StatsError, color = red) {
-    const baseMessage = this.options.verbose
-      ? getErrorMessage(statsError)
-      : statsError.message;
-
-    const [first, ...rest] = baseMessage.split('\n');
-
-    return [
-      color(formatText(`• ${first}`, 4, 2)),
-      ...rest.map((message) => formatText(color(message), 4)),
-      statsError.details && `\n${formatText(dim(statsError.details), 6)}`,
-    ]
-      .filter(Boolean)
-      .join('\n');
-  }
 }
 
 /**

packages/snaps-cli/src/webpack/utils.ts

@@ -1,5 +1,5 @@
 import { bytesToBase64 } from '@metamask/utils';
-import { dim } from 'chalk';
+import { dim, red } from 'chalk';
 import { promises as fs } from 'fs';
 import { builtinModules } from 'module';
 import type { Ora } from 'ora';
@@ -390,3 +390,27 @@ export function getImageSVG(mimeType: string, bytes: Uint8Array) {
   const dataUrl = `data:${mimeType};base64,${bytesToBase64(bytes)}`;
   return `<svg xmlns="http://www.w3.org/2000/svg"><image href="${dataUrl}" /></svg>`;
 }
+
+/**
+ * Format an error message with the given details and colour.
+ *
+ * @param message - The error message.
+ * @param details - The error details.
+ * @param color - The colour to use for the error message.
+ * @returns The formatted error message.
+ */
+export function formatError(
+  message: string,
+  details?: string | undefined,
+  color = red,
+) {
+  const [first, ...rest] = message.split('\n');
+
+  return [
+    color(formatText(`• ${first}`, 4, 2)),
+    ...rest.map((restMessage) => formatText(color(restMessage), 4)),
+    details && `\n${formatText(dim(details), 6)}`,
+  ]
+    .filter(Boolean)
+    .join('\n');
+}

packages/snaps-cli/tsconfig.build.json

@@ -14,6 +14,7 @@
     "./src/**/__snapshots__"
   ],
   "references": [
+    { "path": "../snaps-rpc-methods/tsconfig.build.json" },
     { "path": "../snaps-utils/tsconfig.build.json" },
     { "path": "../snaps-webpack-plugin/tsconfig.build.json" }
   ]

packages/snaps-cli/tsconfig.json

@@ -6,6 +6,7 @@
   },
   "include": ["./src", "./src/**/*.json", "jest.setup.ts", "package.json"],
   "references": [
+    { "path": "../snaps-rpc-methods" },
     { "path": "../snaps-utils" },
     { "path": "../snaps-webpack-plugin" }
   ]