MGLabs
MGLabs is a student-built software platform for AI, learning, coding, project building, games, and creative tools. For the WebMCP Challenge, I extended the existing MGLabs platform with a new agent-native interaction layer so people and AI agents can work through the same real interface together instead of requiring an agent to guess its way through buttons and page structure.
Why WebMCP fits MGLabs
MGLabs already contains many different workflows: Launchpad, BrightPath learning tools, an Arcade with playable games, a Store, project tools, support, trust information, and problem reporting. That makes it useful for people, but it also creates navigation complexity for an AI agent. WebMCP lets MGLabs expose the actions it intentionally supports as structured tools with clear schemas and descriptions.
Instead of an agent scraping the interface and trying to infer which button to click, MGLabs now exposes explicit WebMCP tools that operate the real human-facing product.
What people and agents can do together
The WebMCP extension adds structured tools that let an agent:
- navigate to real MGLabs areas such as Launchpad, BrightPath, Games, Store, Trust, and other supported destinations;
- search the real MGLabs Arcade and visibly populate the same search UI a person uses;
- open a real playable Arcade game by title or game ID, with unknown names falling back to a visible search instead of inventing a game;
- open real BrightPath tools such as Quiz, Flashcards, Notebook, Study Room, Explain, Image, Code, and Homework;
- open Report a Problem for the human to review, while deliberately keeping the final report submission under human control; and
- query a bounded description of the public capabilities MGLabs intentionally exposes to agents without reading private account data.
Every WebMCP action is reflected in the visible MGLabs interface. A WebMCP status panel shows whether the browser supports the API, how many structured tools are available, and the latest agent action. The extension is progressive: browsers without WebMCP can still use the normal MGLabs experience.
Human control and safety
I intentionally avoided exposing high-risk automatic actions. The WebMCP tools do not automatically publish games, make purchases, delete content, change account settings, or submit problem reports. For example, an agent can open Report a Problem, but the person still reviews and submits the form through the normal interface.
Existing project vs. work added during the challenge
MGLabs existed before the WebMCP Challenge. The WebMCP work described here was added after the challenge submission period began on August 25, 2026. The challenge-specific extension includes the WebMCP bridge, structured tool schemas and handlers, visible WebMCP status and action reporting, Arcade agent-command handling, BrightPath WebMCP handoff behavior, and challenge-specific verification tests.
The pre-existing parts of MGLabs include the broader platform shell, BrightPath, Arcade, Game Studio, Store, support tools, account/admin systems, and other applications. The submission is specifically focused on the new WebMCP-powered interaction layer and how it makes those existing workflows meaningfully more usable by people and agents together.
Implementation
MGLabs uses React, TypeScript, JavaScript, HTML, and CSS. The new WebMCP layer uses the imperative document.modelContext.registerTool() API with structured JSON input schemas. Tool registration is treated as progressive enhancement and is cleaned up with an AbortController lifecycle. WebMCP actions reuse the same MGLabs state and user-facing workflows rather than creating a hidden agent-only version of the product.
Testing
The live project should be tested in ChatGPT's in-app browser or a WebMCP-enabled compatible version of Google Chrome. Useful test prompts include:
- “Open the MGLabs Games section.”
- “Search MGLabs Arcade for snake.”
- “Open Neon Serpent.”
- “Open the Quiz tool in BrightPath.”
- “Open Report a Problem.”
The human-visible page should update after each tool call. Opening the problem reporter must not create a report until the human explicitly submits the normal form.
Built With
- appdeploy
- css
- html
- javascript
- react
- typescript
- webmcp