קורן בן עזרא
SawyerHoodמה זה Dev Browser?
Dev Browser הוא כלי שורת פקודה שמאפשר ל-Claude לשלוט בדפדפן Chrome אמיתי בעזרת סקריפטים קצרים ב-JavaScript, יחד עם סקיל שמלמד אותו איך לעבוד איתו. הדפדפן נשאר פתוח בין פקודה לפקודה, ולכן Claude יכול לנווט, לבדוק מה יש בעמוד, לפעול ולוודא את התוצאה בלי להתחיל כל פעם מחדש.
הרבה משימות עסקיות מתחילות בדפדפן: לבדוק שהטופס באתר באמת שולח פנייה, לוודא שתהליך הרכישה בחנות עובד אחרי עדכון, לצלם את עמוד הבית בטלפון, או לאסוף מידע מכמה עמודים. Dev Browser נותן ל-Claude Code את היכולת לעשות את זה בעצמו, בדפדפן Chrome אמיתי ולא בסימולציה.
העיקרון פשוט. Claude כותב סקריפט קצר, הכלי מריץ אותו מול דפדפן שנשאר פתוח ברקע, והעמודים נשמרים בשם, כך שאפשר להמשיך מאותה נקודה בפקודה הבאה. במקום לקרוא HTML ארוך, Claude מקבל תמונת מצב קומפקטית של העמוד עם הפניות לכל כפתור ושדה, ולכן הוא פועל מהר וחוסך בהקשר. אפשר להפעיל דפדפן נפרד עם פרופיל משלו, או להתחבר לדפדפן שכבר פתוח אצלכם.
כדאי לדעת שיש כרגע שתי גרסאות. הגרסה היציבה שמתקבלת מ-npm היא 0.2.9, שמבוססת על Playwright, מריצה סקריפטים בארגז חול ותומכת גם ב-Windows. במקביל יצאה גרסת 1.0 כגרסת מבחן, שמבוססת על Puppeteer, מוסיפה שרת MCP ותומכת כרגע רק ב-macOS וב-Linux. ה-README בעמוד הראשי של הריפו מתאר את גרסת 1.0.
למי זה מתאים
- בעלי חנויות ואתרים שרוצים בדיקה אוטומטית של טפסים ותהליכי רכישה אחרי כל שינוי
- סוכנויות שמוסרות אתרים ללקוחות ורוצות בדיקת איכות מקצה לקצה לפני מסירה
- מפתחים שרוצים ש-Claude יבדוק בעצמו את מה שהוא בנה, במקום לנחש
- אנשי שיווק ומחקר שאוספים מידע מעמודים ציבוריים ומצלמים מסכים להשוואה
מה הוא עושה
עמודים שנשמרים בין פקודות
כל לשונית מקבלת שם ונשארת פתוחה, כך ש-Claude יכול להתחבר פעם אחת, לעבור בין שלבים ולבדוק תוצאה בלי לטעון הכל מחדש.
תמונת מצב קומפקטית של העמוד
במקום קוד HTML מלא, Claude מקבל עץ נגישות עם הפניות קצרות לכל רכיב, ויכול ללחוץ עליו ישירות. זה מהיר יותר וחוסך הרבה מההקשר של השיחה.
דפדפן נפרד או הדפדפן שלכם
אפשר להפעיל Chrome עם פרופיל ייעודי, גם במצב בלי חלון, או להתחבר ל-Chrome שכבר פתוח עם הלשוניות והחיבורים שלכם.
צילומי מסך ומילוי טפסים
צילום עמוד, מילוי שדות, לחיצה, המתנה לטעינה ובדיקה של מה שהופיע, בכל הפעולות המוכרות של Playwright או Puppeteer.
התקנת הסקיל מתוך הכלי
הפקודה dev-browser install-skill --claude כותבת את קובץ הסקיל שמתאים בדיוק לגרסה שמותקנת אצלכם, כך שההנחיות ל-Claude לא יוצאות מסנכרון.
שרת MCP בגרסת 1.0
בגרסת 1.0 אפשר לחבר את הכלי גם כשרת MCP, עם כלים להרצת סקריפט, רשימת עמודים ועצירת הדפדפן.
דוגמאות שימוש
מה כותבים ל-Claude אחרי ההתקנה, ומה מקבלים.
בדיקת טופס יצירת קשר
תיכנס לאתר שלי, תמלא את טופס יצירת הקשר בפרטי בדיקה, תשלח, ותגיד לי אם הופיעה הודעת תודה. צלם מסך של התוצאה.מה מקבלים: Claude פותח את האתר, ממלא ושולח, מחזיר צילום מסך ודיווח ברור אם השליחה הצליחה או נתקעה בשלב כלשהו.
בדיקת תהליך רכישה בחנות
אחרי העדכון של התבנית בחנות Shopify שלי, תבדוק שאפשר להוסיף מוצר לסל, לשנות כמות ולהגיע לעמוד התשלום. אל תבצע תשלום.מה מקבלים: מעבר שלב אחרי שלב עם צילומי מסך, ורשימה של כל שלב שנכשל או נראה שבור.
צילומי מסך למצגת ללקוח
צלם את עמוד הבית ואת עמוד השירותים של האתר שלי, פעם ברוחב של טלפון ופעם ברוחב של מחשב, ושמור את הקבצים בתיקייה screenshots.מה מקבלים: ארבעה צילומי מסך מסודרים בתיקייה, מוכנים לשיבוץ במצגת או בדוח.
איסוף מידע מעמוד ציבורי
תיכנס לעמוד הזה עם רשימת הסניפים של הרשת ותכין לי טבלה של שם סניף, כתובת ושעות פתיחה.מה מקבלים: טבלה מסודרת שנבנתה מתוך העמוד, עם הערה אם חלק מהמידע נטען רק אחרי גלילה או לחיצה.
מה צריך לפני שמתחילים
- Node.js ו-npm לצורך ההתקנה
- Google Chrome או Chromium, או הפקודה dev-browser install שמורידה דפדפן
- הגרסה היציבה (0.2.9) עובדת ב-macOS, ב-Linux וב-Windows. גרסת 1.0 תומכת כרגע רק ב-macOS וב-Linux מבוסס glibc
- Claude Code או סוכן אחר שמריץ פקודות בטרמינל
- אין צורך במפתח API ואין עלות
אין עדיין Claude Code? במדריך הזה יש התקנה צעד אחרי צעד.
איך מתקינים את Dev Browser.
יש 3 דרכים, ומספיקה אחת מהן. הראשונה הכי פשוטה.
הדרך הקלה: מדביקים בצ'אט של Claude Code
פותחים שיחה חדשה ב-Claude Code, מעתיקים את ההודעה ומדביקים. כש-Claude מבקש אישור להריץ, לוחצים Allow.
התקן בבקשה את Dev Browser: את הכלי מ-npm, את הדפדפן שהוא צריך ואת הסקיל שלו ל-Claude Code. הרץ את הפקודה הבאה ותגיד לי אם הכל עבר: npm install -g dev-browser && dev-browser install && dev-browser install-skill --claude && echo "הותקן ✓"
דרך הפלאגינים של Claude Code
מקלידים בצ'אט של Claude Code את שתי הפקודות, אחת אחרי השנייה. את שתי הפקודות מקלידים בעצמכם בחלון של Claude Code, ואחר כך צריך להפעיל אותו מחדש. ה-README מסמן את דרך ההתקנה הזו כישנה (Legacy) ומציג את שם השוק כ-sawyerhood/dev-browser, אבל לפי קובץ marketplace.json שם השוק הוא dev-browser-marketplace. הפלאגין מתקין רק את הסקיל, ולכן עדיין צריך להתקין את הכלי עצמו עם npm install -g dev-browser.
/plugin marketplace add sawyerhood/dev-browser
/plugin install dev-browser@dev-browser-marketplace
בטרמינל, ידנית
למי שמעדיף להריץ בעצמו. מעתיקים לטרמינל ומריצים.
npm install -g dev-browser dev-browser install dev-browser install-skill --claude
צריך להפעיל מחדש את Claude Code כדי שהסקיל ייטען. כדי ש-Claude לא יבקש אישור לכל פקודת דפדפן, אפשר להוסיף לקובץ ~/.claude/settings.json תחת permissions את הכלל "allow": ["Bash(dev-browser *)"], אבל רק בסביבה שסומכים עליה. מי שרוצה את גרסת 1.0 יכול להתקין אותה עם npm install -g dev-browser@next.
- מריצים dev-browser --help ומוודאים שמופיע מדריך השימוש
- מריצים ls ~/.claude/skills/dev-browser ומוודאים שיש שם SKILL.md
- מבקשים מ-Claude: "תיכנס ל-example.com ותגיד לי מה הכותרת של העמוד", ובודקים שהוא מריץ dev-browser ומחזיר את הכותרת
מריצים npm install -g dev-browser ואחר כך dev-browser install-skill --claude, כדי שגם הסקיל יתעדכן לגרסה החדשה של הכלי.
npm uninstall -g dev-browser && rm -rf ~/.claude/skills/dev-browser
איך משתמשים ביום יום
- מבקשים בשפה רגילה: "תיכנס ל...", "תלחץ על...", "תמלא את הטופס", "צלם מסך". הסקיל נטען לבד לפי הבקשה.
- לעבודה עם אתר שדורש התחברות, אפשר להפעיל את Chrome עם הפרופיל הייעודי של הכלי, להתחבר פעם אחת ידנית, ומשם Claude ממשיך מאותה לשונית.
- למשימות רקע אפשר לבקש מצב בלי חלון (headless), ולבדיקות שרוצים לראות בעיניים לבקש דפדפן גלוי.
- כשמשהו לא עובד, בקשו מ-Claude להריץ dev-browser --help. המדריך המובנה מתאים תמיד לגרסה המותקנת.
טיפים שימושיים
- חיבור לדפדפן האישי שלכם נותן ל-Claude גישה ללשוניות ולחשבונות שמחוברים בו, ולכן עדיף להשתמש בפרופיל נפרד לכל מה שלא דורש את החשבונות האישיים.
- לבדיקות של תהליך רכישה, כתבו במפורש "אל תבצע תשלום" ועבדו בסביבת בדיקה אם יש כזו.
- לפני איסוף מידע מאתר של מישהו אחר, בדקו את תנאי השימוש שלו, ואל תאספו מידע אישי על אנשים.
- בגרסת 1.0 הסקריפטים רצים בהקשר נפרד אבל לא בארגז חול מאובטח, ולכן לא מאשרים אוטומטית סקריפטים ממקור לא מוכר.
תקלות נפוצות
מופיעה ההודעה No Chrome found
ההתקנה מ-npm הסתיימה אבל הכלי לא רץ
Claude משתמש בפקודות שלא קיימות
Claude מבקש אישור על כל פעולה
שאלות ותשובות
מה ההבדל בין זה לבין סקרייפר?
איזו גרסה כדאי להתקין?
האם זה עולה כסף?
האם Claude יכול להתחבר לחשבונות שלי?
כמה פופולרי הפרויקט?
קרדיט ומקור. Dev Browser נכתב על ידי SawyerHood ונמצא ב-SawyerHood/dev-browser ברישיון MIT. את העמוד כתב קורן בן עזרא אחרי בדיקה של המאגר ושל פקודות ההתקנה (29.09.2026). מאגרים מתעדכנים, ולכן אם משהו השתנה, המאגר הוא המקור הקובע.
yfe404
obra
yusufkaraaslan