module-federation-ai-debug

A browser Runtime Plugin that lets an AI agent redirect selected Module Federation remotes to locally running manifests without operating Chrome DevTools or requiring the Module Federation Chrome extension.

The package mounts a lightweight floating console by default. It uses native DOM and Shadow DOM, so it does not add React or another UI framework to the host. The console focuses on proxy management: add, edit, enable, remove, clear, save, and reload.

Host integration

Add the package to the host's runtimePlugins. The plugin reads the URL before the host registers its remotes and applies matching overrides from localStorage.__MF_DEVTOOLS__.

module.exports = {
  plugins: [
    new ModuleFederationPlugin({
      runtimePlugins: [require.resolve('module-federation-ai-debug')],
    }),
  ],
};

The purple MF button opens the console. Disable it when only URL automation is needed by wrapping the plugin factory with { console: false }. Programmatic users can customize its initial state and save behavior:

import aiDebugRuntimePlugin from 'module-federation-ai-debug';

aiDebugRuntimePlugin({
  console: {
    defaultOpen: true,
    reloadOnSave: false,
    zIndex: 10000,
  },
});

An AI agent can then start one remote and open the host with a generated query parameter:

const config = {
  overrides: {
    checkout: 'http://localhost:3001/mf-manifest.json',
  },
};

const url = new URL('https://host.example.com/checkout');
url.searchParams.set('__mf_devtools', JSON.stringify(config));
console.log(url.href);

URLSearchParams performs the required percent encoding. If constructing the query manually, use encodeURIComponent(JSON.stringify(config)) exactly once.

Overrides merge with saved rules by default. Add replace: true to discard all existing override rules first. Set an individual value to null to delete only that rule:

{
  "replace": true,
  "overrides": {
    "checkout": "http://127.0.0.1:3001/mf-manifest.json",
    "legacyRemote": null
  }
}

The plugin preserves unrelated DevTools settings, clears stale snapshot data, removes a successfully consumed parameter from the address bar, and resolves overrides by remote name or alias.

For safety, HTTP(S) JSON manifests on localhost and 127.0.0.1 are allowed by default. Programmatic users can explicitly allow production hosts:

import { aiDebugRuntimePlugin } from 'module-federation-ai-debug/core';

const plugin = aiDebugRuntimePlugin({
  allowedHosts: ['assets.example.com'],
});

For environments that inject before the host runtime is initialized, use registerAIDebugRuntimePlugin(globalThis). This creates the Module Federation global plugin list when necessary and registers the plugin only once.