Kopilotti WebMCP turns a fictional car storefront into a 24/7 digital sales channel—not a chatbot. Car shopping is repetitive enough for an agent, but consequential enough that a human must stay in control of the commercial outcome.

WebMCP is a strong fit because the page exposes the safe parts of the journey—search, comparison, condition review, draft preparation, and approved evaluation—as explicit, schema-constrained tools. The agent calls those capabilities directly instead of scraping the page or guessing at controls. Every action updates the same visible workspace and activity log the person can inspect, which makes the experience clearer, more reliable, and easier to correct.

Together, the person and agent can move a sales conversation forward outside dealership opening hours. The agent can find vehicles, compare factual fields, retrieve condition facts, and prepare a €90,000 non-binding discussion draft independently. It cannot cross the consequential boundary by itself: approval for deterministic evaluation is a page-native human action that is never registered as a tool. A scripted .click() has no effect. After approval, a fixed public policy evaluates €90,000 against the fictional €95,000 asking price as exactly 9,473 basis points, returns COUNTER at €92,150, and resists an agent policy-override attempt. The resulting JSON receipt records the policy and approval evidence with binding: false and transmittedToDealer: false.

The implementation uses five narrowly scoped WebMCP tools—search_vehicles, compare_vehicles, get_vehicle_condition, prepare_price_discussion, and evaluate_price_discussion—over fictional in-memory inventory. WebMCP and manual controls call the same application functions, while the activity log labels the real invocation source as webmcp, manual, or human-ui. When a browser does not expose WebMCP, a persistent readiness banner immediately offers the complete, honestly labeled manual path rather than presenting the application as broken.

Inspiration

Car shopping is a useful test case for agentic browsing: the research is repetitive, the facts are structured and the commercial consequences matter. A useful agent should accelerate the research without silently gaining authority to negotiate, contact a dealer or create a transaction.

Kopilotti WebMCP explores that boundary. The browser agent gets explicit, schema-constrained tools. Every result appears in the same workspace the person sees, and the final commercial action remains outside the agent's authority.

What it does

The demo registers five WebMCP tools:

search_vehicles filters and sorts a fictional six-vehicle inventory. compare_vehicles returns a factual side-by-side comparison without choosing a winner. get_vehicle_condition selects a vehicle and displays its versioned condition facts. prepare_price_discussion creates a pending, local and non-binding discussion draft. evaluate_price_discussion evaluates only the exact draft that received page-native human approval and creates a machine-checkable receipt.

Approval is deliberately absent from the WebMCP tool surface. The page also contains a numbered manual fallback for browsers that do not expose WebMCP; it uses the same application functions and labels each invocation honestly as manual.

How we built it

The project is a dependency-free static web app using semantic HTML, modern CSS and JavaScript modules. WebMCP tools are registered with document.modelContext.registerTool() and include bounded JSON Schemas, descriptive titles, explicit annotations and abort-signal handling.

Tool execution calls small, independently tested domain functions and then updates the visible UI. A page-native approval gate binds the human action to the current draft context. The public demo policy produces deterministic ACCEPT, COUNTER or ESCALATE results and an in-memory JSON receipt. There are no production APIs, external data sources, customer records or hidden production pricing rules.

Why WebMCP matters here

Visual automation would have to infer search controls, card layouts and state transitions. WebMCP gives the agent stable named capabilities with typed inputs and clear safety boundaries. The user can watch the same workspace change after each tool call, making the process observable and correctable.

Safety and responsible design

All vehicle data is fictional. No tool accepts personal data. Search and comparison are explicitly read-only. Preparing a price discussion creates only pending local UI state. No tool can grant human approval, set or override policy, submit an offer, contact a dealer or create a transaction. Evaluation runs only after page-native human approval and produces a non-binding, unsent demo receipt. The repository contains no proprietary Kopilotti Sales decision logic or production data.

Challenges

The main design challenge was making price evaluation genuinely useful without allowing the agent to authorize itself. The solution was a reversible drafting step, a page-native approval action that is absent from the tool manifest, context-bound validation and a deterministic receipt.

What we learned

Agent-native design is not just adding an API to a page. The tool contract, the visible UI and the authority model must agree. A narrow tool with an honest description can be more useful than a broad tool that leaves the user uncertain about what the agent actually did.

What's next

Test the tool contracts against additional WebMCP-capable agents. Expand manual assistive-technology and cross-browser regression coverage. Explore dealer-approved, explicitly confirmed handoffs without giving the model pricing authority.

Built with

WebMCP, JavaScript, HTML, CSS, Node.js test runner

AI-assisted development disclosure

Development was AI-assisted with OpenAI Codex. Product scope, trust-boundary decisions, verification and submission remain human-directed. This open challenge build is separate from the private production Kopilotti Sales engine and contains none of its source code, data or private pricing rules.

Built With

Share this project:

Updates

Submission history