Video wird geladen...

Video konnte nicht geladen werden

Zur Startseite

I created a small tool to automatically set breakpoints in Chrome using the CDP (Chrome DevTools Protocol). It’s still in beta, but I’m actively working on a complete version..

m4ll0k's profile picture

m4ll0k

7,181 subscribers

12,165 Aufrufe • vor 1 Jahr •via X (Twitter)

Wissenschaft & TechnologieBildungNachrichten & Politik
LIVE

Anya Rossi• Live Now

Private livecam show

4 Kommentare

Profilbild von Ryan Barnett
Ryan Barnettvor 1 Jahr

@MtnBer fyi

Profilbild von r3ddr4g0n
r3ddr4g0nvor 1 Jahr

Pretty cool bro!

Profilbild von TheRedTea🇲🇦🍉
TheRedTea🇲🇦🍉vor 1 Jahr

I had the same idea but I didn't know how to do it nor I gave it time to know how to do it. I was thing of a javascript extention that will do this.

Profilbild von younesnakata
younesnakatavor 1 Jahr

nice

Ähnliche Videos

Introducing developer mode for browser use in Chrome and the Codex in-app browser. Codex can use the Chrome DevTools Protocol (CDP) to debug browser issues by profiling JavaScript performance and inspecting console output, network traffic, and page state.
1:27

Introducing developer mode for browser use in Chrome and the Codex in-app browser. Codex can use the Chrome DevTools Protocol (CDP) to debug browser issues by profiling JavaScript performance and inspecting console output, network traffic, and page state.

OpenAI Developers

365,188 Aufrufe • vor 5 Tagen

Connect your agents directly to Chrome DevTools. 🛠️ The new Chrome DevTools MCP server allows agents to inspect the DOM and debug console errors in real-time using Gemini CLI or any compatible agent. Check out the documentation on GitHub →
1:01

Connect your agents directly to Chrome DevTools. 🛠️ The new Chrome DevTools MCP server allows agents to inspect the DOM and debug console errors in real-time using Gemini CLI or any compatible agent. Check out the documentation on GitHub →

Google for Developers

22,793 Aufrufe • vor 5 Monaten

Want to debug device-controlled CSS parallax effects without using a device? Simulate device orientation in Chrome DevTools 👇
0:27

Want to debug device-controlled CSS parallax effects without using a device? Simulate device orientation in Chrome DevTools 👇

jhey ʕ•ᴥ•ʔ

272,683 Aufrufe • vor 2 Jahren

Chrome DevTools MCP in Cursor
0:30

Chrome DevTools MCP in Cursor

Alex Sidorenko

37,649 Aufrufe • vor 5 Monaten

I’m extremely pleased to announce the release of Scroll-Driven Animations Debugger, a Chrome DevTools extension to visualize and debug Scroll-Driven Animations. 🔗 Get the extension from the Chrome Web Store and start inspecting
1:54

I’m extremely pleased to announce the release of Scroll-Driven Animations Debugger, a Chrome DevTools extension to visualize and debug Scroll-Driven Animations. 🔗 Get the extension from the Chrome Web Store and start inspecting

Bramus

40,932 Aufrufe • vor 2 Jahren

Codex now works directly in Chrome on macOS and Windows. It’s even better at working with apps and sites in Chrome, and now works in parallel across tabs in the background without taking over your browser. To get started, install the Chrome plugin in the Codex app.
0:52

Codex now works directly in Chrome on macOS and Windows. It’s even better at working with apps and sites in Chrome, and now works in parallel across tabs in the background without taking over your browser. To get started, install the Chrome plugin in the Codex app.

OpenAI

2,492,883 Aufrufe • vor 1 Monat

AI assistance in Chrome DevTools is here with Chrome 131! 🚀 Using Gemini, it helps you debug styling issues, understand layouts, and get AI-generated fixes for CSS bugs. Learn more →
0:24

AI assistance in Chrome DevTools is here with Chrome 131! 🚀 Using Gemini, it helps you debug styling issues, understand layouts, and get AI-generated fixes for CSS bugs. Learn more →

Google for Developers

17,235 Aufrufe • vor 1 Jahr

Announcing our public preview of Chrome DevTools MCP! Experience the full power of DevTools in your AI coding agent → With Chrome DevTools MCP, your AI agent can run performance traces, inspect the DOM, & perform real-time debugging of your web pages.
0:32

Announcing our public preview of Chrome DevTools MCP! Experience the full power of DevTools in your AI coding agent → With Chrome DevTools MCP, your AI agent can run performance traces, inspect the DOM, & perform real-time debugging of your web pages.

Chrome for Developers

1,041,402 Aufrufe • vor 8 Monaten

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
1:01

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,294 Aufrufe • vor 8 Monaten

Art history, but make it interesting. Ask Gemini in Chrome to explain a subject like it’s your favorite series 🍿 Try it yourself: Just click the Gemini icon in the corner of Chrome
0:21

Art history, but make it interesting. Ask Gemini in Chrome to explain a subject like it’s your favorite series 🍿 Try it yourself: Just click the Gemini icon in the corner of Chrome

Chrome

47,905 Aufrufe • vor 7 Monaten

Just published a command that lets you inspect Safari websites / WebViews with Chrome DevTools in a single command: ~ / npx inspect-webkit
0:41

Just published a command that lets you inspect Safari websites / WebViews with Chrome DevTools in a single command: ~ / npx inspect-webkit

Evan Bacon 🥓

17,716 Aufrufe • vor 1 Monat

Wow, it actually *is* DOM (See me using Chrome DevTools to inspect the DOM) HTML is <canvas> is going to open a new era of web UIs
0:37

Wow, it actually *is* DOM (See me using Chrome DevTools to inspect the DOM) HTML is <canvas> is going to open a new era of web UIs

Steren

733,844 Aufrufe • vor 25 Tagen

The upcoming Picture-in-Picture API that Chrome is pushing is soo promising! 🤩 Nuxt DevTools will be able to pop up as a separate window soon!
0:20

The upcoming Picture-in-Picture API that Chrome is pushing is soo promising! 🤩 Nuxt DevTools will be able to pop up as a separate window soon!

Anthony Fu 🦋 @antfu.me

316,390 Aufrufe • vor 3 Jahren

New RoSeal feature: Added support for custom/hex skin colors in the website's Avatar Editor. Out now on Chrome and Firefox. (current version on Firefox is a little buggy). Chrome: Firefox: #Roblox #RobloxDev
0:23

New RoSeal feature: Added support for custom/hex skin colors in the website's Avatar Editor. Out now on Chrome and Firefox. (current version on Firefox is a little buggy). Chrome: Firefox: #Roblox #RobloxDev

julia | i made roseal

53,171 Aufrufe • vor 2 Jahren

I made a chrome extension that displays the $KAS amount next to the $USD value on most websites where goods are being sold. Aside from not working too well on Amazon, it works so effortlessly. I’m working on a safari extension too but it’s much harder. I personally think it’s really cool seeing the $KAS prices on Zillow. Let me know what you guys think 🔥
1:18

I made a chrome extension that displays the $KAS amount next to the $USD value on most websites where goods are being sold. Aside from not working too well on Amazon, it works so effortlessly. I’m working on a safari extension too but it’s much harder. I personally think it’s really cool seeing the $KAS prices on Zillow. Let me know what you guys think 🔥

₿ЯT 𐤊 🐈📈

31,279 Aufrufe • vor 11 Monaten

Improving Chrome DevTools debugging with AI: a quick overview of new features we recently shipped.
2:42

Improving Chrome DevTools debugging with AI: a quick overview of new features we recently shipped.

Addy Osmani

14,800 Aufrufe • vor 1 Jahr

Stop guessing & start debugging responsive styles automatically with Chrome DevTools MCP→ Learn how a coding agent can find a visual bug on a specific device size, analyze the source code, update the CSS, & verify the fix with a live browser screenshot.
0:22

Stop guessing & start debugging responsive styles automatically with Chrome DevTools MCP→ Learn how a coding agent can find a visual bug on a specific device size, analyze the source code, update the CSS, & verify the fix with a live browser screenshot.

Chrome for Developers

19,286 Aufrufe • vor 8 Monaten

In Chrome DevTools, AI via Gemini can now help you understand what the problem is and how to fix it, straight from the Console!
0:30

In Chrome DevTools, AI via Gemini can now help you understand what the problem is and how to fix it, straight from the Console!

Addy Osmani

154,063 Aufrufe • vor 2 Jahren

I slapped together this quick chrome extension to embed the Spatie tinker package in DevTools. It feels like a native PHP console tab 🤩 Extension below 👇 if you want to use it as well.
0:21

I slapped together this quick chrome extension to embed the Spatie tinker package in DevTools. It feels like a native PHP console tab 🤩 Extension below 👇 if you want to use it as well.

Tony Lea

41,585 Aufrufe • vor 1 Jahr