Chrome DevTools for agentها مجموعهای از ابزارها است که قدرت Chrome DevTools را به گردشهای کاری کدنویسی هوش مصنوعی شما میآورد. با نصب Chrome DevTools for agentها، به موارد زیر دسترسی پیدا میکنید:
- سرور MCP : عامل هوش مصنوعی شما را با استفاده از پروتکل متنباز Model Context به یک نمونه مرورگر زنده متصل میکند.
- رابط خط فرمان توسعهدهندگان کروم (Chrome DevTools CLI) : رابطی برای تعامل مستقیم با مرورگر از طریق ترمینال شما.
- مهارتهای عامل : دستورالعملهای تخصصی که به عامل شما یاد میدهد چگونه چندین ابزار را برای کارهای پیچیدهای مانند دسترسیپذیری یا اشکالزدایی عملکرد هماهنگ کند.
در زمینه توسعه وب، Chrome DevTools برای عاملها، قابلیتهای اشکالزدایی را در عامل هوش مصنوعی شما ادغام میکند.
برای مثال، یک عامل میتواند از این ابزارها برای ثبت و ارزیابی ردیابی عملکرد، تجزیه و تحلیل عملکرد یک وبسایت و شناسایی بهبودهای بالقوه استفاده کند. فراتر از توسعه وب، DevTools برای عاملها همچنین به عامل شما اجازه میدهد تا به جای بازیابی HTML استاتیک، وب زنده را مرور کند.
راهاندازی
این راهنما به شما نشان میدهد که چگونه Chrome DevTools را برای عاملها تنظیم کنید تا به عامل کدنویسی شما کمک کند تا یک مرورگر کروم زنده را کنترل و بررسی کند.
از بسته chrome-devtools-mcp برای کنترل و بررسی یک مرورگر کروم زنده از طریق عامل کدنویسی خود (مانند Gemini، Claude، Cursor یا Copilot) استفاده کنید. توجه داشته باشید که اگرچه Chrome DevTools برای عاملها مجموعه کاملی از ابزارها را ارائه میدهد، اما رابط خط فرمان (CLI) فقط از یک زیرمجموعه هدفمند برای اتوماسیون مبتنی بر پوسته پشتیبانی میکند.
IDEها و مدلهای پشتیبانیشده
Chrome DevTools برای عاملها از هر ابزار یا IDE که از پروتکل MCP پشتیبانی میکند، پشتیبانی میکند. این شامل Antigravity، Gemini CLI، Claude Code، Cursor، Copilot و موارد دیگر میشود.
ملاحظات امنیتی
از آنجا که نماینده شما قادر به مشاهده و تعامل با صفحاتی است که به آنها دسترسی دارد، اگر آن را به مرورگری با یک جلسه فعال و احراز هویت شده متصل کنید، میتواند به طور مؤثر از طرف شما عمل کند. از به اشتراک گذاشتن اطلاعات حساس یا شخصی که نمیخواهید با نمایندگان به اشتراک بگذارید، خودداری کنید.
پیشنیازها
قبل از نصب Chrome DevTools برای agentها، مطمئن شوید که محیط شما الزامات زیر را برآورده میکند:
برای تنظیم Chrome DevTools برای عاملها، روشی را انتخاب کنید که با محیط کدنویسی دلخواه شما مطابقت داشته باشد. در حالی که برخی از عاملها نیاز به نصب دستی دارند، برخی دیگر با ابزارهای از پیش یکپارچه شده ارائه میشوند.
ضد جاذبه
Chrome DevTools برای agentها به صورت پیشفرض با Antigravity 2.0 ارائه میشود. میتوانید بلافاصله با استفاده از sub-agent مرورگر، استفاده از آن را شروع کنید. سعی کنید از یک دستور اسلش مانند زیر استفاده کنید:
/browser Navigate to the Google homepage
برای دسترسی به مهارتهای تخصصی عامل، توصیه میکنیم افزونه DevTools را در مرحله ساخت با گوگل از راهاندازی اولیه یا در تنظیمات برنامه نصب کنید. برای اطلاعات بیشتر، مستندات Antigravity Browser Subagent را بررسی کنید.
نصب با استفاده از CLI
برای تنظیم Chrome DevTools برای نمایندگان، میتوانید از یک فایل پیکربندی JSON یا یک دستور CLI برای نصب مستقیم سرور در صورت پشتیبانی نماینده خود استفاده کنید. برخی از نمایندگان همچنین افزونهها یا پلاگینهای رسمی ارائه میدهند که شامل مهارتهای نماینده، دستورالعملهای تخصصی است که به نماینده شما در استفاده از ویژگیهای DevTools کمک میکند.
اگر عامل شما در اینجا فهرست نشده است، میتوانید نحوه نصب آن را در مخزن GitHub ابزار توسعه کروم برای عاملها (Chrome DevTools for Agents) بیابید.
برای افزودن Chrome DevTools برای عاملها به یک عامل خط فرمان، از دستورات CLI داخلی برای عامل خاص خود استفاده کنید:
رابط خط فرمان جمینی
افزونهی Gemini CLI که شامل بستهی MCP و مهارتهای همراه آن است را با استفاده از دستور زیر نصب کنید:
# Gemini extension (MCP+Skills)
gemini extensions install --auto-update https://github.com/ChromeDevTools/chrome-devtools-mcp
فقط بسته MCP را با دستور زیر نصب کنید:
# MCP only
gemini mcp add chrome-devtools npx chrome-devtools-mcp@latest
کلود کد
برای نصب Chrome DevTools برای نمایندگان به عنوان افزونه Claude Code، از دستورات اسلش زیر در Claude Code استفاده کنید. رجیستری بازار را اضافه کنید:
/plugin marketplace add ChromeDevTools/chrome-devtools-mcp
و افزونه را از رجیستری بازار نصب کنید:
/plugin install chrome-devtools-mcp@chrome-devtools-plugins
برای اطلاعات بیشتر به صفحه رسمی افزونه Chrome DevTools Claude مراجعه کنید.
کدکس
codex mcp add chrome-devtools -- npx chrome-devtools-mcp@latest
نصب با استفاده از پیکربندی JSON
برای سایر عاملهایی که از کلید پیکربندی mcpServers پشتیبانی میکنند، این ورودی را به صورت دستی اضافه کنید و مطمئن شوید که DevTools را برای عاملها از طریق npm i chrome-devtools-mcp نصب کردهاید.
{
"mcpServers": {
"chrome-devtools": {
"command": "npx",
"args": ["-y", "chrome-devtools-mcp@latest"]
}
}
}
نصب در سایر نمایندگان
برای پیکربندی برای عاملی که در فهرست نیست، به مخزن GitHub مربوط به Chrome DevTools MCP مراجعه کنید.
تنظیمات خود را آزمایش کنید
برای بررسی اینکه آیا همه چیز درست کار میکند، دستور زیر را در اپراتور خود وارد کنید:
Check the performance of https://developers.chrome.com
نماینده شما باید یک پنجره مرورگر باز کند و ردیابی عملکرد را ثبت کند.
عیبیابی تنظیمات شما
اگر عامل شما نتواند ابزارها را اجرا کند و به مهارتهای Chrome DevTools دسترسی داشته باشد، ممکن است سعی کند مشکل را به طور خودکار برطرف کند. اگر این اتفاق نیفتد، میتوانید صریحاً به عامل اطلاع دهید:
Use the Chrome DevTools troubleshooting skill to fix my setup.
یا میتوانید دقیقتر بگویید:
I'm having trouble with Chrome DevTools for agents. I tried to run [Tool Name]
but got the error: [Error Message]. I am on [OS Name]. Use the Chrome DevTools
troubleshooting skill to fix my setup.
پیکربندی پیشرفته
اینها برخی دیگر از راههایی هستند که نماینده شما میتواند از طریق مرورگر به آنها دسترسی پیدا کند.
حالت بدون سر را پیکربندی کنید
اگر میخواهید وظایف پسزمینه را بدون نمایش پنجره مرورگر انجام دهید، میتوانید کروم را در حالت بدون رابط کاربری (headless) اجرا کنید. پرچم --headless را به آرگومانهای سرور خود اضافه کنید:
{
"mcpServers": {
"chrome-devtools": {
"command": "npx",
"args": [
"-y",
"chrome-devtools-mcp@latest",
"--headless"
]
}
}
}
اتصال به یک جلسه مرورگر موجود
به طور پیشفرض، DevTools برای agentها یک نمونه جدید از کروم را شروع میکند. با این حال، میتوانید agent خود را با استفاده از پرچم --autoConnect به یک session مرورگر موجود متصل کنید. این امر به ویژه در صورتی مفید است که agent شما نیاز به بررسی مشکلی داشته باشد که پشت ورود به سیستم یا session ای که قبلاً شروع کردهاید، پنهان مانده است.
دو راه برای اتصال به یک جلسه موجود وجود دارد:
از اتصال خودکار استفاده کنید (کروم ۱۴۴+)
وقتی سرور Chrome DevTools MCP با گزینه --autoConnect پیکربندی شود، سرور MCP به یک نمونه فعال Chrome متصل شده و یک جلسه اشکالزدایی از راه دور درخواست میکند.
- در مرورگر کروم خود، برای فعال کردن اشکالزدایی از راه دور، به
chrome://inspect/#remote-debuggingبروید. پیکربندی MCP خود را بهروزرسانی کنید تا پرچم
--autoConnectرا شامل شود:{ "mcpServers": { "chrome-devtools": { "command": "npx", "args": ["chrome-devtools-mcp@latest", "--autoConnect"] } } }یک اعلان به نماینده خود ارسال کنید. کروم یک پنجره محاورهای نشان میدهد که از کاربر اجازه میدهد جلسه اشکالزدایی از راه دور را مجاز کند. روی «اجازه دادن» کلیک کنید.
اتصال دستی با استفاده از پورت اشکالزدایی از راه دور
اگر نمیتوانید از --autoConnect استفاده کنید (برای مثال، اگر عامل خود را در یک محیط sandbox اجرا میکنید)، میتوانید کروم را به صورت دستی با یک پورت اشکالزدایی راهاندازی کنید. در اینجا یک مثال (در macOS) آورده شده است:
مرورگر کروم را با پورت اشکالزدایی از راه دور فعال اجرا کنید. به دلایل امنیتی، باید یک دایرکتوری داده کاربر سفارشی نیز مشخص کنید.
/Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --remote-debugging-port=9222 --user-data-dir=/tmp/chrome-profile-stableبا استفاده از پارامتر
--browser-urlعامل خود را برای اتصال پیکربندی کنید:{ "mcpServers": { "chrome-devtools": { "command": "npx", "args": [ "chrome-devtools-mcp@latest", "--browser-url=http://127.0.0.1:9222" ] } } }