Browser MCP + Windsurf Editor: Complete MCP Integration

Browser MCP is a MCP server that Browser extension and MCP server that enables AI applications to automate web browser tasks locally. Connect AI apps to your browser to automate tests and tasks while maintaining privacy and avoiding bot detection..

When integrated with Windsurf Editor, you can:

• Access Browser MCP functionality through Windsurf Editor

This guide provides step-by-step instructions to set up Browser MCP in Windsurf Editor, including configuration, examples, and troubleshooting.

What You'll Achieve

After completing this setup:

• Browser MCP will be fully integrated and operational
• You can use Browser MCP tools directly in Windsurf Editor
• All Browser MCP capabilities will be available for your workflows

Prerequisites

Before starting, ensure you have:

• Windsurf Editor installed and configured
• Compatible operating system (Desktop App)

Installation

Step 1: Install Browser MCP

Configuration

Step 2: Configure Windsurf Editor

1. Locate your configuration file:

   • Windows: %USERPROFILE%\.codeium\windsurf\mcp_config.json
   • macOS: ~/.codeium/windsurf/mcp_config.json
   • Linux: ~/.codeium/windsurf/mcp_config.json

2. Add server configuration:

{
  "mcpServers": {
    "browser-mcp": {
      "command": "browser mcp",
      "args": []
    }
  }
}

Note: If Browser MCP requires environment variables, add them to the server configuration:
"env": {
  
}

3. Restart Windsurf Editor

Completely quit and restart Windsurf Editor to load the new configuration.

Examples

Once configured, you can use Browser MCP in Windsurf Editor:

Testing Your Setup

1. Launch Windsurf Editor
2. Verify Browser MCP is available in the tools list
3. Test basic Browser MCP functionality

Troubleshooting

Common Issues

Tools Not Appearing

Symptoms: Cascade does not see new tools, Hammer icon missing

Cause: Configuration syntax error or server failed to start.

Solution:

• Check the JSON configuration for syntax errors.
• Verify the command (e.g., npx, python) is in your system PATH.
• Check Windsurf logs for MCP connection errors.

Environment Variables

Symptoms: Authentication failed, Permission denied

Cause: Missing API keys in configuration.

Solution:

• Ensure env block is correctly defined inside the server config.
• Restart Windsurf after changing environment variables.

Browser MCP not appearing in Windsurf Editor

Symptoms: Server not listed, Tools not available

Cause: Configuration or installation issue

Solution:

• Verify configuration syntax
• Check Browser MCP installation
• Restart Windsurf Editor
• Check logs for error messages

Next Steps

Now that Browser MCP is integrated with Windsurf Editor:

• Explore all Browser MCP capabilities through Windsurf Editor
• Check out other MCP servers that work with Windsurf Editor
• Join the MCP community for tips and support
• Consider contributing to Browser MCP development

Need Help?

• Search for Browser MCP documentation
• Check the Windsurf Editor MCP guide
• Join the MCP community discussions