תאריך פרסום: 23 בספטמבר 2025
היום אנחנו משיקים תצוגה מקדימה ציבורית של שרת חדש של פרוטוקול הקשר של מודלים (MCP) בכלי הפיתוח ל-Chrome, שמאפשר להשתמש ביכולות של כלי הפיתוח ל-Chrome בעוזרים מבוססי-AI לכתיבת קוד.
לסוכני קידוד יש בעיה בסיסית: הם לא יכולים לראות מה הקוד שהם יוצרים עושה בפועל כשהוא פועל בדפדפן. הם בעצם מתכנתים עם כיסוי עיניים.
שרת ה-MCP של כלי הפיתוח ל-Chrome משנה את זה. עוזרי תכנות מבוססי-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 MCP בהדרגה, החל מגרסת התצוגה המקדימה הציבורית שאנחנו משיקים היום. אנחנו מחפשים באופן פעיל משוב מכם ומהקהילה לגבי היכולות שכדאי לנו להוסיף בהמשך. בין אם אתם מפתחים שמשתמשים בעוזרי תכנות מבוססי-AI או ספקים שיוצרים את הדור הבא של כלי פיתוח מבוססי-AI, התובנות שלכם חשובות לנו מאוד. אם משהו חסר או לא עובד, אתם מוזמנים לפתוח בעיה ב-GitHub.