گردش کار کدنویسی هوش مصنوعی خود را با Chrome DevTools for agents 1.0 ساده کنید

منتشر شده: ۱۹ مه ۲۰۲۶

ابزارهای کدنویسی هوش مصنوعی در نوشتن کد فوق‌العاده قدرتمند هستند، اما اغلب از اجرای آن جدا هستند. آن‌ها می‌توانند یک برنامه وب پیچیده تولید کنند، اما نمی‌توانند رفتار آن را مشاهده کنند یا خروجی آن را در یک مرورگر زنده بررسی کنند.

Chrome DevTools برای عامل‌ها، قابلیت مشاهده‌ی لازم برای تأیید، اشکال‌زدایی و بهینه‌سازی کد را به صورت بلادرنگ در اختیار عامل کدنویسی شما قرار می‌دهد. چند ماه پیش برای اولین بار آن را نمایش دادیم و اکنون مفتخریم اعلام کنیم که Chrome DevTools برای عامل‌ها اکنون به عنوان یک نسخه پایدار ۱.۰ در دسترس است.

عامل خود را به مرورگر وصل کنید

ابزارهای توسعه کروم برای نمایندگان به نماینده شما اجازه می‌دهد تا سایت شما را مانند یک کاربر واقعی تجربه کند. این نسخه پایدار شامل چندین روش برای شما و نماینده شما برای ارتباط با کروم است:

  • سرور پروتکل زمینه مدل (MCP) : سروری که مدل‌های زبان بزرگ (LLM) را به قابلیت‌های اشکال‌زدایی DevTools متصل می‌کند.
  • رابط خط فرمان (CLI) : یک جایگزین کارآمد برای توکن که به عامل‌ها اجازه می‌دهد اقدامات را در قالب اسکریپت‌ها دسته‌بندی کنند.
  • مهارت‌های عامل : دستورالعمل‌های تخصصی که به عامل شما نحوه و زمان استفاده از ابزارهای خاص برای کارهایی مانند دسترسی‌پذیری یا اشکال‌زدایی عملکرد را آموزش می‌دهند.

اشکال‌زدایی، شبیه‌سازی و حسابرسی خودکار

با انتشار نسخه ۱.۰، کدنویس شما اکنون می‌تواند وظایف اشکال‌زدایی پیشرفته‌ای را که قبلاً دستی انجام می‌شدند، انجام دهد.

خودکارسازی ممیزی‌های کیفیت

نماینده شما اکنون می‌تواند ممیزی‌های Lighthouse را برای ارزیابی کیفیت وب‌سایت اجرا کند . این ابزار می‌تواند مشکلات مربوط به دسترسی، سئو، بهترین شیوه‌ها و مرور عامل‌محور را شناسایی کند. این مانند داشتن یک linter است که زمان اجرا را درک می‌کند. به عنوان یک دروازه کیفیت، نماینده کدنویسی شما را به متخصصی تبدیل می‌کند که مسدودکننده‌های بحرانی را قبل از رسیدن به مرحله تولید، شناسایی می‌کند.

شبیه‌سازی تجربیات کاربری در دنیای واقعی

نماینده شما می‌تواند از DevTools برای آزمایش نحوه نمایش و عملکرد یک سایت در دستگاه‌های مختلف یا در مکان‌های مختلف با استفاده از ابزارهای شبیه‌سازی استفاده کند. این ابزار می‌تواند اندازه پنجره‌ها را تغییر دهد، موقعیت‌های جغرافیایی را شبیه‌سازی کند و سرعت شبکه و CPU را برای شبیه‌سازی شرایط دنیای واقعی تنظیم کند. به این ترتیب، نماینده شما می‌تواند رفتارهای خاص موبایل، مانند منوهای همبرگری را بدون نیاز به تغییر دستی اندازه مرورگر شما، آزمایش کند.

توسعه و اشکال‌زدایی افزونه‌های کروم

همچنین می‌توانید به نماینده خود اجازه دهید نه تنها در توسعه افزونه‌های کروم به شما کمک کند، بلکه آنها را اشکال‌زدایی (دیباگ) نیز بکند. نماینده شما می‌تواند مستقیماً افزونه‌ها را نصب، بارگذاری مجدد و فعال کند. این به خودکارسازی چرخه مکرر "ذخیره و به‌روزرسانی" در طول توسعه کمک می‌کند. همچنین می‌تواند به اسکریپت‌های پس‌زمینه و صفحات افزونه‌ها دسترسی پیدا کند تا به شما در رفع اشکالات در تنظیمات پیچیده‌تر مرورگر کمک کند.

ابزارهای اشکال‌زدایی و آزمایش WebMCP

ما همچنین قابلیت دید عمیقی را به نسخه آزمایشی WebMCP (پروتکل زمینه مدل وب) اضافه می‌کنیم تا به شما در پیاده‌سازی این API جدید کمک کنیم.

به جای اینکه عامل شما برای استنباط برنامه‌ای برای پیمایش DOM به سیگنال‌ها متکی باشد، می‌تواند مستقیماً با ابزارهای ساختاریافته‌ای که شما با استفاده از WebMCP در اختیار دارید، تعامل داشته باشد. این امر توسعه، آزمایش و اشکال‌زدایی این ابزارها را آسان‌تر می‌کند: عامل شما می‌تواند آنها را فهرست کند، از نظر برنامه‌نویسی فراخوانی کند و صحت آنها را در لحظه تأیید کند. این امر فرآیند افزودن پشتیبانی WebMCP به سایت شما و آزمایش آن را ساده‌تر می‌کند.

تشخیص و اشکال‌زدایی نشت حافظه

ما همچنین ابزارهای اختصاصی برای تجزیه و تحلیل حافظه اضافه کرده‌ایم. اکنون عامل شما می‌تواند از حافظه موقت (heap snapshots) برای شناسایی نشتی‌های حافظه، مانند گره‌های DOM جدا شده، عکس بگیرد. با استفاده از مهارت‌های تخصصی اشکال‌زدایی نشتی حافظه، عامل به عنوان یک متخصص عملکرد عمل می‌کند تا به شما در حفظ سرعت و کارایی برنامه‌تان کمک کند.

جلسات را با اتصال خودکار تحویل دهید

شما می‌توانید زمینه مرورگر فعلی خود را با یک عامل به اشتراک بگذارید ، به جای اینکه عامل، نمونه مرورگر سندباکس شده خود را باز کند (که معمولاً DevTools برای عامل‌ها به آنها اجازه دسترسی به مرورگر را می‌دهد). این روش برای اشکال‌زدایی مواردی که نیاز به ورود دارند، مانند یک داشبورد احراز هویت شده، که در آن می‌خواهید عامل هوش مصنوعی بدون نیاز به احراز هویت مجدد شما، تحقیقات فنی را بر عهده بگیرد، عالی است.

نمایش وضعیت داخلی با ابزارهای توسعه‌دهندگان شخص ثالث

ابزارهای توسعه‌دهندگان شخص ثالث به برنامه وب شما اجازه می‌دهند تا جزئیات وضعیت داخلی و اجزای آن را مستقیماً با عوامل هوش مصنوعی به اشتراک بگذارد. این ابزارها با فراهم کردن دسترسی به داده‌هایی که معمولاً از تحلیل‌های استاندارد پنهان هستند، زمینه‌ای را که عوامل برای درک منطق پیچیده نیاز دارند، در اختیار آنها قرار می‌دهند. این امر منجر به ارائه پیشنهادهای اشکال‌زدایی دقیق‌تر بر اساس نحوه رفتار واقعی برنامه در مرورگر می‌شود.

شروع کنید

می‌توانید نسخه پایدار را با استفاده از npm نصب کنید یا آن را مستقیماً در agent مورد نظر خود پیکربندی کنید:

ضد جاذبه

Chrome DevTools برای agentها به صورت پیش‌فرض با Antigravity 2.0 ارائه می‌شود. می‌توانید بلافاصله با استفاده از sub-agent مرورگر، استفاده از آن را شروع کنید. سعی کنید از یک دستور اسلش مانند زیر استفاده کنید:

/browser Navigate to the Google homepage

برای دسترسی به مهارت‌های تخصصی عامل، توصیه می‌کنیم افزونه DevTools را در مرحله ساخت با گوگل از راه‌اندازی اولیه یا در تنظیمات برنامه نصب کنید. برای اطلاعات بیشتر، مستندات Antigravity Browser Subagent را بررسی کنید.

رابط خط فرمان جمینی

برای نصب بسته MCP و مهارت‌ها به عنوان افزونه، از دستور زیر استفاده کنید:

$ gemini extensions install --auto-update https://github.com/ChromeDevTools/chrome-devtools-mcp

کلود کد

برای نصب Chrome DevTools برای نمایندگان به عنوان افزونه Claude Code، از دستورات اسلش زیر در Claude Code استفاده کنید. رجیستری بازار را اضافه کنید:

/plugin marketplace add ChromeDevTools/chrome-devtools-mcp

و افزونه را از رجیستری بازار نصب کنید:

/plugin install chrome-devtools-mcp@chrome-devtools-plugins

برای راهنماهای دقیق‌تر و مثال‌های بیشتر، به مستندات Chrome DevTools for agents ما مراجعه کنید. همچنین می‌توانید کد منبع را در GitHub بررسی کنید.