Introducing the Safari MCP server for web developers | WebKit

Introducing the Safari MCP server for web developers

Jul 1, 2026

by Saron Yitbarek

In Safari Technology Preview 247, we’re introducing the Safari MCP server — a Model Context Protocol server for web developers that makes your web development and debugging workflow faster and more powerful. We know agents are increasingly integral to the coding process and the Safari MCP server gives your agent the ability to know how your code actually renders in the browser by connecting it to a Safari browser window.

Any MCP-compatible client can connect to the Safari MCP server. By connecting your agent to a Safari browser window, your agent can emulate what your users experience, giving it the information it needs to debug more autonomously, like access to the DOM, network requests, screenshots, and console output.

It speeds up your debugging process and lets you stay in the comfort of your terminal, which means fewer rounds of hopping windows and typing prompts to debug your code.

The use cases

If you build for the web, then you know about the debugging dance. It usually goes something like this.

You see something wrong with your site in the browser. You open the console to hunt it down. You click into the styles tab. You see what’s broken. You go back to your code to fix it. Or maybe you take a screenshot, detail the problem to your agent, and let it do the fixing for you. Hopefully it gets it right, the bug is fixed, and you can move on.

But when it isn’t fixed, you go through the workflow again — Browser. Prompt. Agent.

And again and again, until you finally squash the bug.

Regardless of the browser or tools you use, the debugging workflow is a lot of clicks, tools, and window hopping to make a single fix, but it doesn’t have to be that way. If you’re already using agents in your development workflow, the Safari MCP server makes your debugging faster and more efficient.

The Safari MCP server enables your agent to do more debugging and troubleshooting on its own. Here are just a few examples of what it can help with:

Web development in Safari . The next time you develop in Safari, you’ll benefit from an upgraded workflow. Your agent already helps you with your code, now it can do even more by checking out how your code actually renders in Safari.

Improve compatibility with Safari. Testing in just one browser means missing potential bugs in another, giving those users a subpar experience. With the Safari MCP server, your agent can open your site in Safari, inspect computed styles, check layout, and compare it against what you expect without switching windows.

Analyze performance. See what parts of your site are slowing things down. The Safari MCP server lets your agent evaluate JavaScript on the page to surface performance metrics, like navigation timing and resource load times, so it can pinpoint what’s slowing your site down and work on the right fix.

Check for accessibility. The Safari MCP server lets your agent check for common accessibility issues like missing labels, improper ARIA attributes, and poor contrast, so you can catch problems that impact your users.

Verify any user state. Know that the page is working and looking as it should. Your agent can check the state of the form, query an element using a selector, confirm specific interactions, show different states of a checkout flow, and more. Spend less time on these manual checks and empower the agent to do it for you.

These are just a few of the use cases. However you decide to implement it, the Safari MCP server helps your agent do more for you and reduce all the back and forth that web development often requires. An easier workflow means more bugs squashed, happier users, and a better product.

The tools

Here are the available tools and what they do:

Tool<br>Description

browser_console_messages<br>Return buffered console logs for the current or specified tab

browser_dialogs<br>List and respond to browser dialogs (accept, dismiss, or input text for JS prompts)

close_tab<br>Close a browser tab by its handle

create_tab<br>Create a new browser tab, optionally loading a URL

evaluate_javascript<br>Execute JavaScript code within the page and return the result

get_network_request<br>Get full detail for a single recorded network request (headers, body, timing)

get_page_content<br>Extract text content of a page in various formats (markdown, HTML, JSON, etc.)

list_network_requests<br>List network request summaries (URL, method, status, timing) for the current tab

list_tabs<br>List all open browser tabs with their handles and URLs

navigate_to_url<br>Navigate to a URL and return the loaded page’s content

page_info<br>Get info about the current page: URL, title, and loading state

page_interactions<br>Perform DOM interactions in sequence: click, type, scroll, hover, keyPress, etc.

screenshot<br>Capture a screenshot of the current page as a PNG

set_emulated_media<br>Emulate a CSS media type (e.g. "print") for...