Loading video...

Video Failed to Load

There was a problem loading this video. This could be due to a temporary network issue or the video might be unavailable.

I just built this CRACKED Cursor MCP extension that makes your IDE fully aware of all the logs in your browser. Was struggling with a few issues recently and kept having to copy/paste logs but with this tool you can: ✅ Check all console logs + errors ✅ Analyze... show more

Ted Werbel

14,665 subscribers

179,882 views • 1 year ago •via X (Twitter)

Science & Technology Education Health & Wellness

Anya Rossi• Live Now

Private livecam show

10 Comments

Matt Figdore2 years ago

This is the biggest productivity cheat code right now. Kiss reading documents goodbye. You can get an instant summary of any document with this tool.

Alex1 year ago

This is cool as hell Ted. A real problem yet solved by Cursor itself. Now if we can only do it for the terminal log for backend errors!

Ted Werbel1 year ago

Great idea.. maybe I'll build another MCP too exactly for this 🤔

Brandon Macer1 year ago

first time i've seen a non-trivial custom mcp implementation. beautiful work. excellent walkthrough too.

Ted Werbel1 year ago

Appreciate the kind words! Really enjoyed building this 😄

Mat Silverstein1 year ago

This is awesome. Can't believe I'm the first star on this repo. Should be the 10,000th.

Phat T. Pham1 year ago

ooh I like this. So you can ask it how to make a certain request faster and optimize. Love this

Ted Werbel1 year ago

OHH, you got me thinking... would be cool to integrate a performance analysis tool into this! I'll see what I can do to make this possible 🦾

Dan Mac1 year ago

nice Ted this is v helpful

Ted Werbel1 year ago

Thanks, I think so too! I was super tired of copy/pasting logs all the time and having to truncate long logs to avoid context window limits... This tool handles all the truncation for you so it saves me a TON of time here n there 😄

Related Videos

This MCP tool for Cursor will literally save you HOURS of debugging 🔥🦾 With BrowserTools v1.2 you can… ✅ Analyze all browser logs w/ deep reasoning ✅ Capture + auto-paste screenshots into Cursor ✅ Run accessibility, SEO + web app audits ✅ Fully optimize your NextJS app for SEO ✅ Make changes to a selected element Watch the full video for installation steps + check my bio to access our docs 👇 BIG thanks to Emil for implementing the auditing capabilities!! If you have any ideas or feature requests, please reply down below and we’ll add them to the backlog 🙌

This MCP tool for Cursor will literally save you HOURS of debugging 🔥🦾 With BrowserTools v1.2 you can… ✅ Analyze all browser logs w/ deep reasoning ✅ Capture + auto-paste screenshots into Cursor ✅ Run accessibility, SEO + web app audits ✅ Fully optimize your NextJS app for SEO ✅ Make changes to a selected element Watch the full video for installation steps + check my bio to access our docs 👇 BIG thanks to Emil for implementing the auditing capabilities!! If you have any ideas or feature requests, please reply down below and we’ll add them to the backlog 🙌

Ted Werbel

78,784 views • 1 year ago

You can now automate your browser from inside Cursor or Windsurf. No more copy-pasting logs or screenshots. I recorded a full video showing how to set up Browser MCP and use it to debug like a pro. Watch it here ↓

You can now automate your browser from inside Cursor or Windsurf. No more copy-pasting logs or screenshots. I recorded a full video showing how to set up Browser MCP and use it to debug like a pro. Watch it here ↓

Prajwal Tomar

142,268 views • 1 year ago

Introducing the Clips chrome extension - the easiest way to send bug reports to agents with video, transcript, and browser debug info captured automatically. 100% free and open source. If you are like me and get tired of manually typing instructions to agents, attaching screenshots, pasting debug logs, and all of that, this might be your new favorite tool. With the Clips chrome extension, you can just click the Clips icon, hit record, and start talking. Visually demonstrate your issue, go through the flow, point out what’s broken. Clips will capture everything on your screen, plus network requests, browser logs, client errors, and all the details around them. And it redacts sensitive information. Then it gives you a link you can send to humans so they can play it and take a look. Or, more importantly, just give it to your agents by just pasting the URL to them. The link has special metadata for agents so just from the URL, the agent can pull all information from the clip automatically. No plugin or MCP server required. That means it can "see and hear" what’s in the video - read the transcript, grab snapshots at any timestamp, and inspect the logs and network requests that were shared with it. So whether you want to quickly demo an issue and send all that context to an agent, or get better bug reports from teammates, recording and sending Clips makes that super easy. Unlike expensive apps like Loom, this is all 100% free and open source. The framework that powers this, plus a bunch of other free applications, is open source too. You can just sign up and use it, or fork it and customize it to your needs. This, in my opinion, is the future of software. Rather than bloated SaaS that charges you a ton of money and still doesn’t even have the things you need, we get free open source canonical apps that you can fork and customize in any way you want. I'll link to all this stuff in the replies. If you try it, let me know your feedback.

Introducing the Clips chrome extension - the easiest way to send bug reports to agents with video, transcript, and browser debug info captured automatically. 100% free and open source. If you are like me and get tired of manually typing instructions to agents, attaching screenshots, pasting debug logs, and all of that, this might be your new favorite tool. With the Clips chrome extension, you can just click the Clips icon, hit record, and start talking. Visually demonstrate your issue, go through the flow, point out what’s broken. Clips will capture everything on your screen, plus network requests, browser logs, client errors, and all the details around them. And it redacts sensitive information. Then it gives you a link you can send to humans so they can play it and take a look. Or, more importantly, just give it to your agents by just pasting the URL to them. The link has special metadata for agents so just from the URL, the agent can pull all information from the clip automatically. No plugin or MCP server required. That means it can "see and hear" what’s in the video - read the transcript, grab snapshots at any timestamp, and inspect the logs and network requests that were shared with it. So whether you want to quickly demo an issue and send all that context to an agent, or get better bug reports from teammates, recording and sending Clips makes that super easy. Unlike expensive apps like Loom, this is all 100% free and open source. The framework that powers this, plus a bunch of other free applications, is open source too. You can just sign up and use it, or fork it and customize it to your needs. This, in my opinion, is the future of software. Rather than bloated SaaS that charges you a ton of money and still doesn’t even have the things you need, we get free open source canonical apps that you can fork and customize in any way you want. I'll link to all this stuff in the replies. If you try it, let me know your feedback.

Steve (Builder.io)

60,533 views • 1 month ago

Announcing Chrome DevTools MCP! 🚀 Connect your AI coding agent to Chrome's powerful automation & debugging capabilities with ease. Key features: ✅ Reliable automation: It can programmatically handle clicks, form fills, dialogs, and page navigation with ease. ✅ Performance insights: Go beyond simple audits. Instruct your agent to record a performance trace and extract actionable insights to optimize your web apps. ✅ Advanced debugging: Empower your AI to analyze network requests, list console messages, take screenshots, and even evaluate scripts in the browser context. ✅ Browser emulation: Easily test different conditions by emulating CPU slowdowns, network throttling, or various screen sizes. Works well with modern web apps and believe this will unlock new workflows for automated testing, AI-driven debugging, and interactive web development. And there's much more to come!

Announcing Chrome DevTools MCP! 🚀 Connect your AI coding agent to Chrome's powerful automation & debugging capabilities with ease. Key features: ✅ Reliable automation: It can programmatically handle clicks, form fills, dialogs, and page navigation with ease. ✅ Performance insights: Go beyond simple audits. Instruct your agent to record a performance trace and extract actionable insights to optimize your web apps. ✅ Advanced debugging: Empower your AI to analyze network requests, list console messages, take screenshots, and even evaluate scripts in the browser context. ✅ Browser emulation: Easily test different conditions by emulating CPU slowdowns, network throttling, or various screen sizes. Works well with modern web apps and believe this will unlock new workflows for automated testing, AI-driven debugging, and interactive web development. And there's much more to come!

Addy Osmani

268,947 views • 10 months ago

How to add Chrome DevTools MCP to Claude Code (Bookmark this post to follow the setup later) This lets Claude debug your web apps in a real browser... performance traces, network inspection, console errors. Requirements: - Node.js 22+ - Chrome browser In the video below I show you: - How to install the MCP server - How to verify the DevTools tools are available - How to use it with a real performance trace

How to add Chrome DevTools MCP to Claude Code (Bookmark this post to follow the setup later) This lets Claude debug your web apps in a real browser... performance traces, network inspection, console errors. Requirements: - Node.js 22+ - Chrome browser In the video below I show you: - How to install the MCP server - How to verify the DevTools tools are available - How to use it with a real performance trace

Daniel San

52,315 views • 10 months ago

This Cursor Extension is awesome Accurate tweaking of UI was always a struggle, But stagewise allows you to bring full context to Cursor, just point and command: 1. Directly choose specific elements in browser 2. Send to Cursor with full context And it's open source

This Cursor Extension is awesome Accurate tweaking of UI was always a struggle, But stagewise allows you to bring full context to Cursor, just point and command: 1. Directly choose specific elements in browser 2. Send to Cursor with full context And it's open source

Jason Zhou

93,308 views • 1 year ago

We’re excited to launch OpenMemory MCP, a private memory for MCP-compatible clients powered by mem0 Today, most AI assistants and dev tools operate without memory. You plan your roadmap in Claude, implement tasks in Cursor, but none of them know what the other did. Each tool operates in isolation, and your context disappears as soon as the session ends. OpenMemory MCP solves this. Built on the open Model Context Protocol (MCP), OpenMemory MCP runs 100% locally and provides a persistent, portable memory layer for all your AI tools. It enables agents and assistants to read from and write to a shared memory, securely and privately. Key capabilities: ✅Works across MCP clients like Cursor, Claude Desktop, Windsurf, Cline and more ✅Provides standardized memory operations (add_memories, search_memory, list_memories, delete_all_memories) ✅Stores data on your machine, fully private ✅Offers a centralized dashboard for visibility and control ✅Simple Docker-based setup with no vendor lock-in If you're building on MCP, OpenMemory MCP is the easiest way to add persistent, private memory to your clients with zero cloud dependencies and full local control. We’ve put together a short demo to show how it works Check it out in the links below 👇

We’re excited to launch OpenMemory MCP, a private memory for MCP-compatible clients powered by mem0 Today, most AI assistants and dev tools operate without memory. You plan your roadmap in Claude, implement tasks in Cursor, but none of them know what the other did. Each tool operates in isolation, and your context disappears as soon as the session ends. OpenMemory MCP solves this. Built on the open Model Context Protocol (MCP), OpenMemory MCP runs 100% locally and provides a persistent, portable memory layer for all your AI tools. It enables agents and assistants to read from and write to a shared memory, securely and privately. Key capabilities: ✅Works across MCP clients like Cursor, Claude Desktop, Windsurf, Cline and more ✅Provides standardized memory operations (add_memories, search_memory, list_memories, delete_all_memories) ✅Stores data on your machine, fully private ✅Offers a centralized dashboard for visibility and control ✅Simple Docker-based setup with no vendor lock-in If you're building on MCP, OpenMemory MCP is the easiest way to add persistent, private memory to your clients with zero cloud dependencies and full local control. We’ve put together a short demo to show how it works Check it out in the links below 👇

Taranjeet

471,972 views • 1 year ago

If you're doing any type of frontend development, this 3 minute video might change your workflow forever. Previews in Windsurf is much more than just a convenient browser tab within your IDE. It also comes with the ability to directly send individual elements and console errors to Cascade, ensuring that context is properly injected and changes are made with precision, every time. What will you build this weekend?

If you're doing any type of frontend development, this 3 minute video might change your workflow forever. Previews in Windsurf is much more than just a convenient browser tab within your IDE. It also comes with the ability to directly send individual elements and console errors to Cascade, ensuring that context is properly injected and changes are made with precision, every time. What will you build this weekend?

Windsurf

90,969 views • 1 year ago

Setup MCP on Cursor with Google Docs in less than 2 mins!! I used Cursor to to create PRDs in Google Docs Here's how you can do it too: - Go to the MCP directory - Search for Google Docs and grab your sse url - Paste the url and set up MCP in Cursor - Use Cursor Agent to authenticate and create PRD Check out the 100+ tools available at

Setup MCP on Cursor with Google Docs in less than 2 mins!! I used Cursor to to create PRDs in Google Docs Here's how you can do it too: - Go to the MCP directory - Search for Google Docs and grab your sse url - Paste the url and set up MCP in Cursor - Use Cursor Agent to authenticate and create PRD Check out the 100+ tools available at

Soham

151,221 views • 1 year ago

Do This Now Or You Might Loose Your #Core Coins. Listen 👂. Before Your Copy And Paste The Link In Your MetaMask Browser, Please Watch The Full Video On My Instagram With The Below Link 👇 Use Link To Claim:

Do This Now Or You Might Loose Your #Core Coins. Listen 👂. Before Your Copy And Paste The Link In Your MetaMask Browser, Please Watch The Full Video On My Instagram With The Below Link 👇 Use Link To Claim:

Marjid Cryptonite

18,645 views • 3 years ago

Instead of a browser in your IDE, what if you brought your IDE to the browser? I’ve been Warping a chrome extension that brings your local agent session to your browser’s sidecar, lets you check on your cloud agent runs at a glance, and kick off agent runs. what do we think? using Aiden Bai’s react-grab library here 🙏

Instead of a browser in your IDE, what if you brought your IDE to the browser? I’ve been Warping a chrome extension that brings your local agent session to your browser’s sidecar, lets you check on your cloud agent runs at a glance, and kick off agent runs. what do we think? using Aiden Bai’s react-grab library here 🙏

sathvik

13,195 views • 2 months ago

Introducing Spur MCP! Our new MCP allows your AI providers to talk to Spur, and easily fix the bugs Spur finds. Spur can provide a high-level view of a test result, in-depth descriptions of test step results, Console Logs, Network Logs, and screenshots of each step execution. This gives your AI agents everything they need to resolve issues instantly. Our MCP will help you go from “something broke” to “here’s the fix” in record time 🛠️

Introducing Spur MCP! Our new MCP allows your AI providers to talk to Spur, and easily fix the bugs Spur finds. Spur can provide a high-level view of a test result, in-depth descriptions of test step results, Console Logs, Network Logs, and screenshots of each step execution. This gives your AI agents everything they need to resolve issues instantly. Our MCP will help you go from “something broke” to “here’s the fix” in record time 🛠️

Spur

17,278 views • 10 months ago

Don't waste your time building an Agentic Browser We built an chrome extension that does everything gpt atlas does and more - Can take actions and do things for you right in your own browser - Use 500+ tools like Gmail, Slack, Notion and more - Can be easily accessed in your sidebar Built with Composio Tool Router, Google AI Developers Gemini 2.5 Computer Use and AI SDK Completely free and open source link to the code:

Don't waste your time building an Agentic Browser We built an chrome extension that does everything gpt atlas does and more - Can take actions and do things for you right in your own browser - Use 500+ tools like Gmail, Slack, Notion and more - Can be easily accessed in your sidebar Built with Composio Tool Router, Google AI Developers Gemini 2.5 Computer Use and AI SDK Completely free and open source link to the code:

Karan Vaidya

73,051 views • 9 months ago

Building with AI can be hard, but I am here to solve your problem. You don't have to drown in endless YouTube tutorials. I’ve compiled a curated "Resource Bank" of everything you need to master AI development ,from foundational concepts to the best tool selections like Cursor and Claude. ✅ Categorized by difficulty ✅ Track your progress ✅ Stay updated with top AI voices Built in under 2 hours. Start your journey today! ⬇️ I’ve compiled a curated "Resource Bank" of everything you need to master AI development, from foundational concepts to the best tool selections like Cursor and Claude. ✅ Categorized by difficulty ✅ Track your progress ✅ Stay updated with top AI voices Built in under 2 hours. Start your journey today! ⬇️ Link to webapp:

Building with AI can be hard, but I am here to solve your problem. You don't have to drown in endless YouTube tutorials. I’ve compiled a curated "Resource Bank" of everything you need to master AI development ,from foundational concepts to the best tool selections like Cursor and Claude. ✅ Categorized by difficulty ✅ Track your progress ✅ Stay updated with top AI voices Built in under 2 hours. Start your journey today! ⬇️ I’ve compiled a curated "Resource Bank" of everything you need to master AI development, from foundational concepts to the best tool selections like Cursor and Claude. ✅ Categorized by difficulty ✅ Track your progress ✅ Stay updated with top AI voices Built in under 2 hours. Start your journey today! ⬇️ Link to webapp:

Dennis Obaro the UI/UX KING

18,439 views • 4 months ago

Just added visual editing for any coding agent. Works with your: ✅ Claude Code CLI ✅ Codex CLI ✅ GitHub Copilot ✅ Cursor CLI Make visual tweaks -> view diffs -> commit, all in the browser! Works with your app framework of choice: ✅ Next.js ✅ React (Vite) ✅ Svelte ✅ Angular ✅ Other frameworks (.NET, Ruby, etc.) So if you liked Cursor's visual editor, check us out! It's live today as a VS Code extension called 'Wuunu'.

Just added visual editing for any coding agent. Works with your: ✅ Claude Code CLI ✅ Codex CLI ✅ GitHub Copilot ✅ Cursor CLI Make visual tweaks -> view diffs -> commit, all in the browser! Works with your app framework of choice: ✅ Next.js ✅ React (Vite) ✅ Svelte ✅ Angular ✅ Other frameworks (.NET, Ruby, etc.) So if you liked Cursor's visual editor, check us out! It's live today as a VS Code extension called 'Wuunu'.

Wesley

57,809 views • 7 months ago

Cursor now has a built-in web browser. You can say "start my app" and it will run the dev server in a terminal and then navigate the browser to localhost:3000. It can take screenshots of the page for iterating on design, and you can send DOM elements to the agent with prompts!

Cursor now has a built-in web browser. You can say "start my app" and it will run the dev server in a terminal and then navigate the browser to localhost:3000. It can take screenshots of the page for iterating on design, and you can send DOM elements to the agent with prompts!

Lee Robinson

216,183 views • 9 months ago

Introducing: Browser Use Skills 🛠️ [beta] Browser Agents are slow, non-deterministic, and expensive. Skills fix that. 🤯 You describe the workflow. We analyse the HTTP requests, reverse engineer the APIs, and turn them into tools calls your agents can use. ✅ 30s → 0.5s ✅ deterministic ✅ extremely cheap Want to run this at scale with Browser Use? DM me. Try it out for free 🔗↓

Introducing: Browser Use Skills 🛠️ [beta] Browser Agents are slow, non-deterministic, and expensive. Skills fix that. 🤯 You describe the workflow. We analyse the HTTP requests, reverse engineer the APIs, and turn them into tools calls your agents can use. ✅ 30s → 0.5s ✅ deterministic ✅ extremely cheap Want to run this at scale with Browser Use? DM me. Try it out for free 🔗↓

Gregor Zunic

60,510 views • 8 months ago

Starseed unifies the Solana ecosystem with fully customizable trading dashboards. Today we launched the $SEED token on Believe #launchcoin CA: AjLY1z4gQ9in2p1ccT7wK3E5ETPMzF5u7NzQYRjodBLV Experienced Solana traders might juggle dozens of fragmented tools and browser tabs, while noobs don’t even know where to begin. We built the tool we couldn’t find — it’s one website. With Starseed, you can: ✅ Open LP positions on Meteora ✅ Swap tokens instantly with Jupiter (🐱, 🐐) ✅ Analyze charts on GMGN.Ai ✅ Track volatile new launches ✅ And tailor it all with drag-and-drop widgets Your dashboard. Your rules. Just Starseed it.

Starseed unifies the Solana ecosystem with fully customizable trading dashboards. Today we launched the $SEED token on Believe #launchcoin CA: AjLY1z4gQ9in2p1ccT7wK3E5ETPMzF5u7NzQYRjodBLV Experienced Solana traders might juggle dozens of fragmented tools and browser tabs, while noobs don’t even know where to begin. We built the tool we couldn’t find — it’s one website. With Starseed, you can: ✅ Open LP positions on Meteora ✅ Swap tokens instantly with Jupiter (🐱, 🐐) ✅ Analyze charts on GMGN.Ai ✅ Track volatile new launches ✅ And tailor it all with drag-and-drop widgets Your dashboard. Your rules. Just Starseed it.

Starseed

26,109 views • 1 year ago

The below video is real. No cuts. Founders + CTOs use this, and comapre it to Cursor + Claude Artifacts but prefer it because: - you can edit the code in your favorite IDE (two-way github sync) - automatically knows what npm package to use - picks up errors and fixes them - fast (built with rust)

The below video is real. No cuts. Founders + CTOs use this, and comapre it to Cursor + Claude Artifacts but prefer it because: - you can edit the code in your favorite IDE (two-way github sync) - automatically knows what npm package to use - picks up errors and fixes them - fast (built with rust)

Anton Osika

453,394 views • 1 year ago

🔧 Let your coding agent identify and fix INP issues for you → With Chrome DevTools MCP, your coding agent can measure performance for specific user interactions to find and resolve slow UI responses - on its own with the help of the browser!

🔧 Let your coding agent identify and fix INP issues for you → With Chrome DevTools MCP, your coding agent can measure performance for specific user interactions to find and resolve slow UI responses - on its own with the help of the browser!

Chrome for Developers

16,705 views • 9 months ago