browser-harness מאפס. הכלי שמחבר את Claude Code לדפדפן שלכם, ב-5 שיעורים.
לפני שמתקינים, שווה להבין מה הכלי באמת עושה.
browser-harness מחבר את Claude Code לדפדפן שלכם. אתם מבקשים מ-Claude לעשות משהו באתר, והפעם הוא באמת יכול. רואה את העמוד, לוחץ, ממלא טפסים, ב-Chrome שלכם, עם החשבונות שכבר מחוברים בו.
זה לא רובוט שמדמה דפדפן. זה ה-Chrome האמיתי שלכם, רק שמישהו אחר אוחז עכשיו בעכבר.
שלושה דברים שמתחברים. שניים מהם כבר יש לכם.
יש לכם דברים שאתם עושים בדפדפן שוב ושוב, באותו זמן בכל יום. כמה דוגמאות:
אתם לא צריכים לדעת:
מה כן? תדעו לבקש מ-Claude מה אתם רוצים, בעברית. זה הכל.
אפילו ההתקנה היא בעצם ניסוי קטן ב-browser-harness. אתם לא תתקינו, Claude יתקין.
ב-GitHub של browser-harness כתוב פרומפט אחד מוכן. אתם פשוט תעתיקו אותו, תדביקו ל-Claude Code, ותלחצו Enter. הוא יקרא את ההוראות, יוריד את הקוד, יתקין את כל מה שצריך, ויחבר את עצמו לדפדפן שלכם.
במהלך התהליך הוא עלול לבקש מכם דבר אחד או שניים: לבחור פרופיל ב-Chrome, או ללחוץ על Allow בחלון שיקפוץ. נעבור על שניהם למטה.
זה הפרומפט הרשמי מהריפו של browser-harness. תעתיקו את הכל, מהמילה הראשונה עד האחרונה:
Set up https://github.com/browser-use/browser-harness for me. Read `install.md` first to install and connect this repo to my real browser. Then read `SKILL.md` for normal usage. Use `agent-workspace/agent_helpers.py` and `agent-workspace/domain-skills/` for task-specific edits. When you open a setup or verification tab, activate it so I can see the active browser tab. After it is installed, open this repository in my browser and, if I am logged in to GitHub, ask me whether you should star it for me as a quick demo that the interaction works — only click the star if I say yes. If I am not logged in, just go to browser-use.com.
פתחו את Claude Code. אם הוא עדיין לא פתוח, בטרמינל הקלידו claude ו-Enter. הדביקו את הפרומפט ולחצו Enter.
מה תראו? משהו כזה:
› reading install.md... › cloning repository... ✓ cloned to ~/Developer/browser-harness › running uv tool install -e . ... ✓ browser-harness installed globally › starting browser bootstrap... ! waiting for Chrome to enable remote debugging › please tick the checkbox in the new tab
אם הוא ביקש בדרך אישורים לקבצים, אשרו. זה תקין. הוא מתקין כלים, ואלה הקבצים שלו בלבד.
בנקודה מסוימת Claude יפתח לכם טאב חדש בדפדפן בכתובת chrome://inspect/#remote-debugging. צריך פעולה אחת מכם:
זה כל מה שצריך מכם. ברגע שסימנתם פעם אחת, Chrome יזכור את ההגדרה לתמיד. בפעמים הבאות אפילו לא תפתחו את הטאב הזה.
אחרי שסימנתם, חזרו ל-Claude. תוך כמה שניות הוא יצליח להתחבר. כדי לוודא שהכל באמת עובד, בקשו ממנו:
״תריץ browser-harness --doctor ותראה לי את הפלט.״
הפלט אמור להיראות בערך ככה, עם הרבה ✓ ירוקים:
$ browser-harness --doctor ✓ browser-harness installed ✓ chrome connected on port 9222 ✓ daemon healthy ✓ ready
רואים ירוק? סיימתם. המכונה שלכם מוכנה.
בודקים שזה באמת עובד. מבקשים מ-Claude לפתוח טאב ולספר לנו מה הוא רואה.
פתחו את Claude Code, וכתבו לו (כן, פשוט בעברית):
״תפתח לי טאב חדש ב-https://news.ycombinator.com ותספר לי מה הכותרת הראשונה בעמוד.״
תוך שניות, אתם תראו 3 דברים קורים בזה אחר זה:
אם הדפדפן שלכם פתוח, תראו את הטאב נפתח לעיניכם. אם הוא ממוזער, Claude יעיר אותו.
הסימן הזה הוא הדרך שלכם לדעת בדיוק על איזה טאב Claude שולט עכשיו. אם תראו אותו, תדעו שזה הטאב שלו.
הוא קרא את העמוד וענה משהו כמו: "הכותרת הראשונה היא: 'Show HN: ...'". משימה הושלמה.
אתם לא צריכים לדעת את זה. באמת. אבל אם אתם סקרנים, הינה מה ש-Claude בעצם הריץ:
# claude wrote this. you didn't. browser-harness <<'PY' new_tab("https://news.ycombinator.com") wait_for_load() print(page_info()) PY
זה המבנה של browser-harness. השורה הראשונה פותחת מסגרת, בפנים פקודות פייתון שאומרות לדפדפן מה לעשות, והשורה האחרונה סוגרת. בין השורות יש פונקציות מוכנות כמו new_tab או page_info.
עכשיו תנסו משהו קצת יותר מורכב. תעתיקו ותדביקו ל-Claude:
״תפתח את הריפו github.com/browser-use/browser-harness, ותגיד לי כמה כוכבים יש לפרויקט.״
זה מה שיקרה: Claude יפתח טאב, ייקח צילום מסך של העמוד, יסתכל איפה כתוב מספר הכוכבים ויחזיר לכם תשובה. הוא בעצם קורא את הדף כמו שאתם הייתם קוראים אותו.
זו הדרך שבה browser-harness בנוי. בשיעור הבא נכנס לעומק שלה: הרגל הזהב של צילום, לחיצה ווידוא.
הרעיון המרכזי מאחורי הכלי. שלושה שלבים שפותרים את רוב המשימות בדפדפן.
תחשבו רגע איך אתם משתמשים בדפדפן. אתם לא קוראים HTML, ולא מסתכלים על שמות של כפתורים בקוד. אתם רואים בעיניים איפה כפתור "הוסף לעגלה", ולוחצים שם.
browser-harness עובד בדיוק ככה: צילום מסך → לחיצה על נקודה → צילום מסך כדי לוודא.
Claude לוקח צילום מסך של הטאב הפעיל. עכשיו יש לו תמונה כמו שלכם.
הוא מסתכל על התמונה, מוצא את הכפתור (או השדה, או הקישור), ולוחץ על הקואורדינטה הזו במסך.
אחרי הלחיצה, צילום מסך נוסף. אם הוא רואה שהמצב השתנה, מצוין. אם לא, הוא ינסה אחרת.
הדרך השנייה (ה"מקצועית") לדבר עם דפים היא דרך selectors: שמות פנימיים של אלמנטים בקוד ה-HTML. בעולם של מתכנתים, זו הייתה הדרך הסטנדרטית. הבעיה היא שהיא שבירה.
תלויים בקוד ה-HTML של האתר. כשהאתר משתנה, הקוד שלכם נשבר. שמות אוטומטיים (class_a8b2c) משתנים בכל deploy.
אם אתם רואים את הכפתור בעיניים, Claude יכול ללחוץ עליו. גם אם הקוד מתחת השתנה. גם אם השם של ה-class מטורף.
אתם תיתנו ל-Claude את המשימה, והוא יבצע אותה בלולאה הזו אוטומטית:
״תיכנס ל-github.com/browser-use/browser-harness ותעשה star לריפו (אני מחובר ל-GitHub).״
מה Claude עושה בפועל:
שימו לב כמה זה דומה למה שאתם הייתם עושים. ההבדל היחיד: אתם השתמשתם בעכבר, Claude משתמש בקואורדינטות.
יש מקרים בודדים שצילום לא יעבוד:
בכל המקרים האלה Claude יודע להחליט לבד מתי לרדת ל-DOM (הקוד) ומתי להישאר בצילום. זו ההחלטה שלו, לא שלכם.
בוחרים משימה אחת אמיתית. בונים אותה, שומרים, ובפעם הבאה Claude מריץ אותה בשבילכם.
זה שלב חשוב. תבחרו משימה אחת אמיתית מהחיים שלכם, לא דוגמה תיאורטית. משהו שאתם עושים שוב ושוב. כמה דוגמאות:
בחרתם אחד? יופי. נבנה אותו יחד. אנחנו ננחה דרך דוגמה אחת. הצעדים זהים לכל משימה.
הדוגמה שלנו: "תביא לי את 3 הכותרות החמות מ-Hacker News עם קישור לכל אחת." תחליפו את זה במשימה שלכם.
שלב 1. תיאור ראשוני ל-Claude. פתחו צ'אט חדש ב-Claude Code, ותגידו לו במדויק מה אתם רוצים:
״תפתח את https://news.ycombinator.com, תיקח את 3 הכותרות הראשונות בעמוד עם הקישור של כל אחת, ותדפיס לי אותן.״
Claude יפתח את האתר, יקרא, ויחזיר משהו כמו:
✓ opened https://news.ycombinator.com 3 הכותרות הראשונות: 1. Show HN: A new way to ship code https://news.ycombinator.com/item?id=... 2. The bitter lesson of agent harnesses https://browser-use.com/posts/... 3. Why we still use vim in 2026 https://example.com/...
שלב 2. מבקשים לשמור את זה כקובץ שאפשר להריץ שוב. זה הצעד שהופך את הניסיון לאוטומציה אמיתית:
״תשמור את זה כסקריפט בתיקיית האוטומציות, כדי שאוכל להריץ אותו שוב מתי שארצה. תוסיף הערה שמסבירה מה האוטומציה עושה.״
Claude ייצור לכם את הקובץ עם הקוד שעבד כרגע. בפעם הבאה שתרצו את אותה משימה, תוכלו להגיד לו "תריץ לי את הסקריפט שיצרת מקודם" והוא יעשה את הכל מחדש.
שלב 3 (אופציונלי). עשרים שניות של תרומה לכלי. אם המשימה שלכם הייתה על אתר ספציפי (LinkedIn, Amazon, Hacker News וכו'), תגידו ל-Claude:
״תכתוב סקיל קצר על האתר הזה ותשמור אותו עם שאר הסקילים של browser-harness, כדי שיידע להתחיל מהר יותר בפעם הבאה.״
זה לא חובה. אבל ככה הכלי משתפר. כל משתמש שמלמד אותו על אתר חדש מקל על המשתמש הבא.
עכשיו יש לכם בידיים אוטומציה שעובדת, ואת הידע איך לבנות עוד עשרה כמוה. תתחילו קטן: דבר אחד שאתם עושים שוב ושוב. אחרי השני, זה יהיה ממכר.