WebMCP Flight Booking Simulator

Registers callable tools on document.modelContext for browser extensions, Chrome Prompt API, or Gemini.

document.modelContext active ← Back to article
Skyline Flights Target Web Application
Available flights
Declarative Form Tool toolautosubmit <form toolname="check_flight_status">
Submit form or trigger from agent to inspect SubmitEvent.agentInvoked idle
Ask the Browser Agent Built-in Agent
How the agent connects: WebMCP (document.modelContext) exposes tool schemas on the page. An agent (this bar, Chrome's Model Context Tool Inspector extension, or Chrome's LanguageModel Prompt API) reads getTools() and calls executeTool().
Where do AI API details come from in WebMCP?

WebMCP itself does not store LLM API keys on the website. The browser agent connects in one of 3 ways:

  • 1. Built-in Simulator (Default): Parses natural language prompts locally without an API key.
  • 2. Chrome WebMCP Inspector Extension: Reads document.modelContext directly and uses the Gemini API key configured in the extension.
  • 3. Live Gemini API (Optional below): Paste a Gemini API key to call gemini-2.5-flash directly with getTools() schemas.
document.modelContext.getTools()
executeTool(search_flights, input) 

              

            

          


          
          

            

              ModelContext Events & Output
              
            

            

              

            

          

        

      

    


    
    
      

        consequentialHint: true
        Confirm Agent Action
      

      

        The browser agent is requesting to execute book_flight, which is marked as a consequential action with real-world side effects.