Inspiration

We run Social Work Test Prep Academy, an ASWB exam prep product. Its most valuable piece is not content, it is a measurement loop: diagnose, score readiness, prescribe. That loop is exactly what an agent can operate for its human, so the WebMCP Challenge was the push to make it agent-native.

What it does

The page registers 11 WebMCP tools. An agent starts a diagnostic, the human answers real questions on screen, and every tool call visibly moves the page: the readiness ring counts up, weak areas rank themselves, and a dated week-by-week study prescription assembles from the exam date the agent carries in from its human's calendar. Readiness persists in localStorage, so a returning agent asks one question and gets "readiness 68, up from 41 on Aug 25." A second audience is the shopping agent: it can run the sample diagnostic and pull structured product facts before recommending anything, evidence instead of marketing.

How we built it

Vite + React + TypeScript, MIT licensed. Registration supports both API shapes (registerTool per tool, provideContext batch) and both spellings (document.modelContext and navigator.modelContext) with a 6 second poll, an honest "Agent connected" pill naming the source, and a full demo-mode Agent Console when no host exists. Tools write one shared store the UI reads, so agent actions and human actions land on the same page state.

Challenges

The two API spellings shipped by different hosts surfaced late. And our production question bank is private, so the demo runs on six original sample questions written for this repo, disclosed on the page, in the code, and in the README.

What's next

WebMCP on the production diagnostic, where readiness is real and the agent becomes a study coach with a number to move.

Built With

Share this project:

Updates