[KongchangAI]
· 2 min read· 1,023 words

Moka Open-Source Tool: Visually Test MCP Locally and Export LangGraph Code in One Click

Moka Open-Source Tool: Visually Test MCP Locally and Export LangGraph Code in One Click

Moka is a zero-config local tool for visually debugging MCP servers and exporting LangGraph code.

Moka is an open-source local debugging tool for MCP and LangGraph developers built around a "validate first, then code" philosophy. It offers a chat-style visual interface for testing tool calls, streaming output, and raw JSON-RPC traffic, turning guesswork into direct observation. Its standout feature is one-click export of a runnable LangGraph Python script after validating your workflow in the UI. Moka also connects to existing LangGraph Agents via the AG-UI protocol, making it easy to slot into current workflows. The entire tool launches locally with a single `npx @mokalabs/sandbox` command — no data leaves your machine.

A Local Debugging Tool That Fills the MCP Development Gap

As the Model Context Protocol (MCP) increasingly becomes the go-to standard for connecting large language models with external tools, developers often lack an intuitive way to verify whether an MCP server works as expected before writing any code. An open-source project called Moka was built precisely for this pain point — it provides a fully local visual playground that lets you validate your MCP tools and prompts before you ever touch the codebase.

According to the project author's post on Reddit, Moka's core purpose is to "visually test MCP servers and prompts before writing code." This means it's not another heavyweight Agent framework — it's a front-loaded validation and debugging step in the development workflow, solving the everyday but tedious question: "Did my tool call actually trigger correctly?"

Model Context Protocol (MCP) was introduced and open-sourced by Anthropic in late 2024, designed to establish a standardized communication interface between large language models and external tools or data sources. It uses JSON-RPC 2.0 as its transport-layer protocol and supports both stdio and HTTP+SSE as transport modes. MCP's core abstractions consist of three primitives: Tools (functions the model can invoke), Resources (data sources the model can read), and Prompts (reusable prompt templates). MCP Servers implement and expose these primitives, while MCP Clients (typically Agent frameworks or IDE plugins) discover and invoke them. Claude Desktop, Cursor, Continue, and other mainstream AI tools already support MCP, and the ecosystem is growing rapidly — but dedicated debugging tools for MCP Servers themselves remain scarce. That's exactly the gap Moka aims to fill.

Three Core Capabilities

Test Tool Calls in a Local Chat UI

Moka provides a local chat interface where developers can directly test tool calls, streaming output, and the underlying raw JSON-RPC traffic. For a protocol like MCP that communicates over JSON-RPC, being able to observe raw message exchanges is extremely valuable — it transforms debugging from "guessing" into "observing," especially when tracking down issues with tool parameter passing or response formatting, significantly cutting down time-to-diagnosis.

Export LangGraph Code in One Click

This is Moka's most compelling feature. Once you've validated your workflow in the visual interface, clicking the "Export as code" button generates a ready-to-run LangGraph (Python) script. This "what-you-see-is-what-you-get, then export to code" workflow dramatically reduces the friction between prototype validation and production implementation. Developers no longer need to manually translate validated logic from the UI into code, reducing the risk of human error.

LangGraph is a stateful, multi-step Agent orchestration framework from the LangChain team. It describes an Agent's execution flow as a directed graph (DAG or cyclic graph) — nodes represent processing steps (such as calling an LLM or executing a tool), and edges represent state transition conditions. Compared to simple chaining, LangGraph natively supports cyclical reasoning, conditional branching, and human-in-the-loop interruptions. It's one of the dominant choices for building production-grade Agents in the Python ecosystem. Moka's decision to use it as the sole code export target signals that its core users are developers building Agent applications on LangGraph. The exported scripts can directly integrate with the LangChain/LangGraph toolchain (e.g., LangSmith for monitoring, LangServe for deployment), further shortening the path from prototype to production.

Use as a Debugging UI for Existing LangGraph Agents

Beyond building from scratch, Moka also supports an optional use case: point it at an existing LangGraph agent via the AG-UI protocol and use Moka as that agent's debugging interface. This lets teams already using LangGraph incorporate Moka into their existing workflows without starting over — a thoughtful nod to integration-friendliness.

AG-UI (Agent-User Interaction) is an emerging open standard specifically designed to define real-time communication interfaces between frontend UIs and backend Agents. It supports streaming event delivery, tool call state synchronization, and human-in-the-loop interruptions. It plays a similar standardization role to MCP, but focused on the interaction layer between Agents and user interfaces. By supporting AG-UI, Moka positions itself not just as a "build from scratch" tool, but as a general-purpose debugging frontend for any AG-UI-compatible Agent — a meaningful advantage of flexibility at a stage when the tooling ecosystem is still maturing.

A Zero-Configuration Local Experience

Moka takes a refreshingly minimal approach to usability — it emphasizes "zero-configuration local execution" and can be launched with a single command:

npx @mokalabs/sandbox

Running entirely locally means no data needs to be uploaded to any third-party service, which is a significant privacy and security advantage for developers working with sensitive tools or internal APIs. The project is open-sourced on GitHub at github.com/mokahq/mokalabs.

Why Tools Like This Matter

The MCP ecosystem is expanding rapidly — more and more tools and data sources are being exposed to LLMs via MCP — but the accompanying developer toolchain remains immature. Most developers currently rely on log printing and repeated restarts to debug MCP servers, which is painfully inefficient.

Tools like Moka that combine "visual testing + code export" are essentially filling in the missing "IDE experience" for MCP development. They consolidate three previously fragmented steps — tool validation, prompt debugging, and code generation — into a single local interface. For teams building Agent applications, especially those on the LangGraph stack, this kind of front-loaded validation can significantly reduce costly rework later.

That said, as a newly released open-source project, Moka is still in its early stages. Its compatibility with different MCP servers, the complexity coverage of exported code, and long-term maintenance trajectory all remain to be tested by the community. But the direction it represents — making MCP and Agent development more visual and debuggable — clearly resonates with the real, day-to-day needs of many developers right now.

Summary

Moka is a local visual debugging tool built for MCP and LangGraph developers. Its core value lies in a "validate first, then code" workflow: test tool calls and JSON-RPC traffic in a chat UI, confirm everything works, then export a runnable LangGraph Python script in one click. It can also serve as a debugging frontend for existing agents. If you're building Agents in the MCP ecosystem, it's worth a quick try with npx @mokalabs/sandbox.

#MCP debugging tool#LangGraph code export#Model Context Protocol#AI Agent development#Moka open source
Share:

Related articles