כלי הפיתוח ל-Chrome לסוכנים מאפשר לסוכן להתחיל סשן בדפדפן ולהתקין תוספים ל-Chrome או ליצור איתם אינטראקציה באמצעות שרת MCP. כך סוכן התכנות יכול לשלוט במחזור החיים של התוסף: להתקין, לטעון מחדש ולהפעיל פעולות.
במקום לטעון ידנית תוסף לא ארוז, ללחוץ על כפתור הטעינה מחדש בדף ניהול התוספים בכל פעם שמשנים את הקוד ולהפעיל ידנית את התוסף כדי לבדוק אותו, אפשר להורות לסוכן ה-AI לנהל את כל התהליך באופן אוטונומי. כך אפשר לגשר על הפער בין יצירת קוד סטטי לבין בדיקה של תוסף פעיל.
אתם יכולים להשתמש בכלי ההרחבות כדי:
- התקנת תוספים: התקנת תוסף ל-Chrome לא ארוז מנתיב של ספרייה מקומית.
- הצגת רשימת תוספים ל-Chrome: אחזור רשימה של כל התוספים המותקנים ל-Chrome, כולל השם, המזהה, הגרסה והסטטוס שלהם (מופעלים או מושבתים).
- טעינה מחדש של תוספים: טעינה מחדש של תוסף Chrome לא ארוז לפי המזהה שלו כדי להחיל שינויים בקוד באופן מיידי.
- הפעלת פעולות: הפעלת פעולת ברירת המחדל של תוסף לפי המזהה שלו, כמו פתיחת תפריט או הפעלת פעולה של סקריפט ברקע (ראו chrome.action במסמכי ה-API).
- הסרת תוספים: הסרת תוסף ל-Chrome מסשן הדפדפן לפי המזהה שלו.
דרישות מוקדמות
לפני שמשתמשים בכלי התוסף, צריך לוודא שיש לכם:
- דגל ניסיוני: הקטגוריה Extensions לא פעילה כברירת מחדל ב-DevTools for Agents. צריך להגדיר את שרת ה-MCP עם הדגל
--categoryExtensions. - תוספים מסוג unpacked: כלים כמו
install_extensionדורשים נתיב מוחלט לתיקיית התוסף מסוג unpacked, ולכן הם אידיאליים לפיתוח מקומי. גישה לקבצים בתיקיית התוסף: השרת יכול לקרוא רק קבצים בתיקיות הבסיס של סביבת העבודה שלו. אלה השורשים שלקוח ה-MCP מספק, כמו ספריית הפרויקט. אם הלקוח לא מספק שורשים, השרת יכול לגשת רק לספרייה הזמנית של מערכת ההפעלה. ב-macOS, הספרייה הזו לא
/tmp. אם תיקיית התוסף נמצאת מחוץ לתיקיות הבסיס האלה, הפעולהinstall_extensionתיכשל עם שגיאתAccess denied. כדי לאפשר תיקייה נוספת, מוסיפים את הדגל--filesystemRoot(כינוי--workspace) לארגומנטים של השרת:"args": ["chrome-devtools-mcp@latest", "--categoryExtensions", "--filesystemRoot=/path/to/extensions"]פרטים נוספים זמינים במאמר איך מאפשרים גישה לקבצים מחוץ לספרייה הזמנית.
תרחישים לדוגמה לשימוש בכלים של תוספים ל-Chrome
אפשר לתת לסוכן הוראות לנהל את מחזור החיים של התוסף בזמן הפיתוח ותיקון הבאגים.
הערה: השלבים של סוכן לביצוע פעולות הם דוגמאות להתנהגות פוטנציאלית. יכול להיות שהסוכן שלכם יפעל אחרת.
איטרציה וטעינה מחדש של תוסף במהירות
טעינה מחדש של תוסף באופן ידני אחרי כל שינוי בקובץ מאטה את הפיתוח. מנחים את הנציג להחיל תיקון קוד ולטעון מחדש את התוסף באופן מיידי כדי לאמת את ההתנהגות החדשה בלי התערבות ידנית.
פרומפט לדוגמה:
אתם יכולים להשתמש בגישה כללית:
Verify the extension has access to the active tab.
אפשר גם להוסיף פרטים:
Update the manifest.json to include the "activeTab" permission. Then, reload the extension with ID 'abc123xyz' and trigger its default action to ensure it works.
דוגמה להרצת סוכן: הסוכן עורך את הקובץ manifest.json במערכת הקבצים שלכם. לאחר מכן, הוא מפעיל את הכלי reload_extension באמצעות המזהה שסופק.
בסוף, הוא קורא לכלי trigger_extension_action כדי להפעיל את התוסף ולוודא שלא נזרקות שגיאות הרשאה במסוף.
בדיקת פעולת ברירת המחדל של תוסף בדף יעד
לעתים קרובות צריך לבדוק איך סקריפט תוכן או פעולת תוסף יוצרים אינטראקציה עם אתר ספציפי. כדי להפוך את התהליך הזה לאוטומטי, אפשר להנחות את הסוכן לנווט לאתר, להתקין את התוסף ולהפעיל אותו.
פרומפט לדוגמה:
אתם יכולים להשתמש בגישה כללית:
Test my extension on example.com and verify it works correctly.
או לפרט יותר:
Navigate to example.com, install the unpacked extension located at '/Users/dev/my-extension', and trigger the extension action. Check the console logs to verify the content script executed correctly.
דוגמה להפעלת נציג: הנציג מנווט לכתובת ה-URL המטורגטת באמצעות navigate_page. לאחר מכן, הוא משתמש ב-install_extension עם הנתיב המוחלט שסופק. אחרי שהתוסף נטען, הוא מפעיל את trigger_extension_action כדי לדמות קליק של משתמש. לבסוף, הוא משתמש ב-list_console_messages כדי לאשר שסקריפט התוכן פעל והפיק את הפלט הצפוי.
אימות התוספים המותקנים וניקוי
במהלך בדיקות אוטומטיות, יכול להיות שתצטרכו לוודא שהתוסף נטען בצורה נכונה עם הגרסה הנכונה, או להסיר אותו כדי להבטיח מצב נקי לבדיקה הבאה.
פרומפט לדוגמה:
Uninstall 'My Test Extension' from the browser.
דוגמה להפעלת נציג: הנציג משתמש בכלי list_extensions כדי לאחזר את רשימת התוספים המותקנים והמטא-נתונים שלהם. הוא מנתח את הפלט כדי לזהות את המזהה שמשויך ל-"My Test Extension". לאחר מכן, הוא משתמש בכלי uninstall_extension עם המזהה הזה כדי להסיר אותו בבטחה מהדפדפן.
יצירת תוסף חדש ובדיקה שלו
כדי ליצור תוסף חדש ל-Chrome מאפס, בדרך כלל צריך ליצור קבצים סטנדרטיים ולטעון ידנית את הספרייה הלא ארוזה לדפדפן כדי לבדוק אותו. כדי לדלג על ההגדרה הידנית הזו, אתם יכולים להורות לסוכן ליצור את הקוד הראשוני, לטעון את התוסף ולאמת את הפונקציונליות הבסיסית שלו, מקצה לקצה, בשלב אחד.
פרומפט לדוגמה:
Build a Chrome extension that turns the page background gray when I click its icon. Save the files to a 'gray-bg-ext' folder in my project, navigate to example.com, load the extension, and verify that it works.
דוגמה להפעלה של הנציג: הנציג יוצר קובץ manifest.json בסיסי של Manifest V3 ו-service worker שפועל ברקע ומאזין לאירוע chrome.action.onClicked. לאחר מכן הוא עובר לדף הבדיקה, מפעיל את install_extension ומשתמש ב-trigger_extension_action כדי לדמות קליק של משתמש. לבסוף, הוא בודק את ה-DOM או מצלם צילום מסך כדי לוודא שהרקע הפך לאפור, וכך מוכיח שהקוד הסטנדרטי פועל.