פורסם: 23 בספטמבר 2025
היום אנחנו משיקים גרסת טרום-השקה (Preview) ציבורית של שרת חדש של פרוטוקול הקשר של מודל כלי הפיתוח ל-Chrome (MCP), שמאפשר להשתמש ביכולות של כלי הפיתוח ל-Chrome בכלי עזר מבוססי-AI לכתיבת קוד.
לסוכני קידוד יש בעיה בסיסית: הם לא יכולים לראות מה הקוד שהם יוצרים עושה בפועל כשהוא פועל בדפדפן. הם בעצם מתכנתים עם כיסוי עיניים.
השרת של Chrome DevTools MCP משנה את זה. עוזרי תכנות מבוססי-AI יכולים לנפות באגים בדפי אינטרנט ישירות ב-Chrome, וליהנות מהיכולות של כלי הפיתוח לניפוי באגים ומהתובנות לגבי הביצועים. כך הם יוכלו לזהות ולתקן בעיות בצורה מדויקת יותר.
כך זה עובד:
מה זה Model Context Protocol (MCP)?
Model Context Protocol (MCP) הוא תקן קוד פתוח לחיבור מודלים גדולים של שפה (LLM) לכלים חיצוניים ולמקורות נתונים. שרת ה-MCP של כלי הפיתוח של Chrome מוסיף יכולות ניפוי באגים לסוכן ה-AI שלכם.
לדוגמה, שרת ה-MCP של כלי הפיתוח ל-Chrome מספק כלי שנקרא performance_start_trace. כשמטילים על מודל שפה גדולה (LLM) לחקור את הביצועים של האתר שלכם, הוא יכול להשתמש בכלי הזה כדי להפעיל את Chrome, לפתוח את האתר ולהשתמש בכלים למפתחים של Chrome כדי לתעד את נתוני הביצועים. לאחר מכן, מודל ה-LLM יכול לנתח את עקבות הביצועים כדי להציע שיפורים פוטנציאליים. באמצעות פרוטוקול ה-MCP, שרת ה-MCP של כלי הפיתוח ל-Chrome יכול להוסיף יכולות חדשות לניפוי באגים לסוכן הקידוד שלכם, כדי לשפר את היכולת שלו לבנות אתרים.
במסמכי התיעוד של MCP יש מידע נוסף על אופן הפעולה של MCP.
למה אפשר להשתמש בו?
הנה כמה דוגמאות להנחיות שאפשר לנסות בעוזר הדיגיטלי מבוסס-AI שתבחרו, כמו Gemini CLI.
אימות שינויים בקוד בזמן אמת
אפשר ליצור תיקון באמצעות סוכן ה-AI, ואז לאמת באופן אוטומטי שהפתרון פועל כמצופה באמצעות כלי ה-MCP של כלי הפיתוח ל-Chrome.
הנחיה שאפשר לנסות:
Verify in the browser that your change works as expected.
אבחון שגיאות ברשת ובמסוף
הסוכן יכול לנתח בקשות רשת כדי לגלות בעיות ב-CORS או לבדוק יומני קונסולה כדי להבין למה תכונה מסוימת לא פועלת כצפוי.
הנחיה שאפשר לנסות:
A few images on localhost:8080 are not loading. What's happening?
סימולציה של התנהגות המשתמשים
אפשר לנווט, למלא טפסים וללחוץ על לחצנים כדי לשחזר באגים ולבדוק תהליכי משתמש מורכבים – והכול תוך כדי בדיקת סביבת זמן הריצה.
הנחיה שאפשר לנסות:
Why does submitting the form fail after entering an email address?
ניפוי באגים בבעיות שקשורות לעיצוב ולפריסה בשידור חי
אפשר לבקש מסוכן ה-AI להתחבר לדף פעיל, לבדוק את ה-DOM ואת ה-CSS ולקבל הצעות קונקרטיות לפתרון בעיות מורכבות בפריסה, כמו רכיבים שגולשים מהמסגרת, על סמך נתונים פעילים מהדפדפן.
הנחיה שאפשר לנסות:
The page on localhost:8080 looks strange and off. Check what's happening there.
אוטומציה של ביקורות ביצועים
מנחים את נציג ה-AI להריץ מעקב אחר ביצועים, לנתח את התוצאות ולבדוק בעיות ספציפיות בביצועים, כמו ערכי LCP גבוהים.
הנחיה שאפשר לנסות:
Localhost:8080 is loading slowly. Make it load faster.
במסמכי העזר של הכלי מפורטת רשימה של כל הכלים הזמינים.
שנתחיל?
כדי לנסות את זה, מוסיפים את רשומת ההגדרה הבאה ללקוח ה-MCP:
{
"mcpServers": {
"chrome-devtools": {
"command": "npx",
"args": ["chrome-devtools-mcp@latest"]
}
}
}
כדי לבדוק אם זה עובד, מריצים את ההנחיה הבאה בסוכן התכנות:
Please check the LCP of web.dev.
פרטים נוספים זמינים במאמרי העזרה בנושא MCP בכלים למפתחים ב-Chrome ב-GitHub.
הצטרפו לפעילות
אנחנו בונים את Chrome DevTools MCP בהדרגה, החל מגרסת התצוגה המקדימה הציבורית שאנחנו משיקים היום. אנחנו מחפשים באופן פעיל משוב מכם ומהקהילה לגבי היכולות שכדאי לנו להוסיף בהמשך. בין אם אתם מפתחים שמשתמשים בעוזרי תכנות מבוססי-AI, או ספקים שיוצרים את הדור הבא של כלי פיתוח מבוססי-AI, התובנות שלכם חשובות לנו מאוד. אם משהו חסר או לא עובד, אתם מוזמנים לפתוח בעיה ב-GitHub.