ניפוי באגים מרחוק עם תוכן חי במכשיר Android ממחשב Windows , Mac או Linux. הזה במדריך תלמדו איך:
- אפשר להגדיר את מכשיר Android לניפוי באגים מרחוק ולגלות אותו ממכונת הפיתוח.
- בדיקה של תוכן בשידור חי במכשיר Android וניפוי באגים ממכונת הפיתוח.
- הקלטת תוכן ממכשיר Android במכונה של כלי פיתוח במכונת הפיתוח.
שלב 1: מכירים את מכשיר Android
תהליך העבודה שבהמשך מתאים לרוב המשתמשים. אפשר לעיין בקטע פתרון בעיות: כלי הפיתוח לא מזהים את Android device לקבלת עזרה נוספת.
- פותחים את המסך אפשרויות למפתחים במכשיר Android. למידע נוסף, אפשר לעיין בקטע הגדרה של מפתח במכשיר אפשרויות.
- בוחרים באפשרות הפעלה של ניפוי באגים ב-USB.
- פותחים את Chrome במחשב הפיתוח.
- לעבור אל
chrome://inspect#devices. צריך לוודא שהאפשרות
Discover התקני USB מופעלת.
מחברים את מכשיר Android ישירות למכשיר הפיתוח באמצעות כבל USB.
אם מחברים את המכשיר בפעם הראשונה, הוא יוצג במצב 'אופליין' ובהמתנה לאימות.
במקרה כזה, מאשרים את הבקשה להפעלת ניפוי הבאגים במסך המכשיר.
אם מופיע שם הדגם של מכשיר Android, המשמעות היא שכלי הפיתוח יצרו בהצלחה את החיבור למכשיר.
ממשיכים לשלב 2.
פתרון בעיות: כלי הפיתוח לא מזהים את מכשיר Android
יש לוודא שהחומרה מוגדרת בצורה נכונה:
- אם משתמשים במפצל USB, כדאי לנסות לחבר את מכשיר Android ישירות למחשב הפיתוח. במקום זאת.
- מנסים לנתק את כבל ה-USB בין מכשיר Android למכשיר הפיתוח. לאחר מכן ולחבר אותו בחזרה. אפשר לעשות זאת בזמן שהמסכים של מכשירי Android ומכשירי הפיתוח לא נעולים.
- מוודאים שכבל ה-USB פועל. אמורה להיות לך אפשרות לבדוק קבצים במכשיר Android ממכונת הפיתוח שלך.
מוודאים שהתוכנה מוגדרת בצורה נכונה:
- אם במחשב הפיתוח שלך פועלת Windows, נסה להתקין באופן ידני את מנהלי ההתקנים של ה-USB עבור מכשיר Android. ראו התקנת מנהלי התקנים של USB של OEM (יצרן ציוד מקורי).
- עבור חלק מהשילובים של מכשירי Windows ו-Android (במיוחד Samsung) נדרשת הגדרה נוספת. צפייה מכשירי כלי הפיתוח ל-Chrome לא מזהים את המכשיר כשהוא מחובר לחשמל.
אם ההודעה לאפשר ניפוי באגים ב-USB לא מופיעה במכשיר Android, נסו לבצע את הפעולות הבאות:
- מנתקים את כבל ה-USB ומחברים אותו מחדש בזמן שכלי הפיתוח נמצאים בתהליך הפיתוח ומסך הבית של Android מופיע. במילים אחרות, לפעמים ההנחיה לא מוצגת כאשר המסכים של מכשיר Android או של מכשיר הפיתוח נעולים.
- עדכון הגדרות התצוגה של מכשיר ה-Android ומכונת הפיתוח, כך שאף פעם לא ללכת לישון.
- הגדרת מצב USB ב-Android ל-PTP. פרטים נוספים מופיעים בקטע Galaxy S4 לא מציג את תיבת הדו-שיח 'אישור ניפוי באגים ב-USB' תיבה.
- בוחרים באפשרות ביטול הרשאות לניפוי באגים ב-USB במסך אפשרויות למפתחים. מכשיר Android כדי לאפס אותו למצב רענן.
אם מוצאים פתרון שלא מוזכר בקטע הזה, או בקטע מכשירי כלי הפיתוח ל-Chrome לא זיהוי מכשיר כשהוא מחובר לחשמל,יש להוסיף תשובה לשאלה הזו ב-Stack Overflow או לפתוח במאגר Developer.chrome.com!
שלב 2: ניפוי באגים בתוכן במכשיר Android ממכונת הפיתוח
- פותחים את Chrome במכשיר Android.
ב-
chrome://inspect/#devicesבמחשב הפיתוח מופיע שם הדגם של מכשיר ה-Android, ואחריו המספר הסידורי שלו. מתחת לזה אפשר לראות את גרסת Chrome שפועלת במכשיר. שמספר הגרסה מופיע בסוגריים.
בתיבת הטקסט כרטיסייה פתוחה עם כתובת URL, מזינים כתובת URL ולוחצים על פתיחה. הדף ייפתח בכרטיסייה חדשה במכשיר ה-Android.
לכל כרטיסייה מרוחקת ב-Chrome יש קטע משלה ב
chrome://inspect/#devices. בקטע הזה תוכלו לבצע אינטראקציה עם הכרטיסייה. אם יש אפליקציות שמשתמשות ב-WebView, מופיע גם קטע שמיועד לכל אחת מהאפליקציות האלה. בדוגמה הזו יש רק כרטיסייה אחת פתוחה.לוחצים על בדיקה לצד כתובת ה-URL שפתחתם עכשיו. תיפתח מכונה חדשה של כלי פיתוח.
גרסת Chrome שפועלת במכשיר ה-Android קובעת את הגרסה של כלי הפיתוח שתיפתח במחשב הפיתוח. לכן, אם במכשיר Android פועלת גרסה ישנה מאוד של Chrome, יכול להיות שהמופע של כלי הפיתוח יהיה שונה ממה שאתם רגילים אליו.
פעולות נוספות: השהיה, מיקוד, טעינה מחדש או סגירה של כרטיסייה
מתחת לכתובת ה-URL מופיע תפריט שבעזרתו אפשר להשהות, להתמקד, לטעון מחדש או לסגור כרטיסייה.
בדיקת רכיבים
עוברים לחלונית Elements (רכיבים) במכונה של כלי הפיתוח, ומעבירים את העכבר מעל רכיב כדי להדגיש אותו. אזור התצוגה של מכשיר Android.
אפשר גם להקיש על אלמנט במסך של מכשיר Android כדי לבחור אותו בחלונית Elements.
לוחצים על בחירת רכיב 
במופע של כלי הפיתוח, ואז מקישים על הרכיב במסך של מכשיר Android. לתשומת ליבך: האפשרות בחירת רכיב מושבתת אחרי הנגיעה הראשונה, לכן צריך להפעיל אותה מחדש בכל פעם שרוצים להשתמש בתכונה.
הקלטת המסך של מכשיר Android אל מכונת הפיתוח
לוחצים על הצגה או הסתרה של Screencast
כדי לראות
התוכן של מכשיר Android במופע של כלי הפיתוח.
תוכלו לבצע פעולות בהקלטת המסך בכמה דרכים:
- קליקים מתורגמים להקשות ומפעילים אירועי מגע מתאימים במכשיר.
- ההקשות במחשב נשלחות למכשיר.
- כדי לדמות תנועת צביטה, לוחצים לחיצה ארוכה על מקש Shift בזמן הגרירה.
- כדי לגלול, משתמשים במשטח המגע או בגלגל העכבר או מחליקים עם סמן העכבר באמצעות מצביע העכבר.
כמה הערות לגבי הקלטות מסך:
- בהקלטות מסך מוצג רק תוכן הדף. חלקים שקופים בהקלטת המסך מייצגים את המכשיר ממשקים, כמו סרגל הכתובות של Chrome, שורת הסטטוס של Android או המקלדת של Android.
- הקלטות מסך משפיעות לרעה על קצב הפריימים. השבתה של הקלטת מסך בזמן מדידה של גלילות או אנימציות כדי לקבל תמונה מדויקת יותר של ביצועי הדף.
- אם המסך של מכשיר Android ננעל, התוכן של הקלטת המסך ייעלם. ביטול הנעילה של מסך של מכשיר Android כדי להמשיך באופן אוטומטי בהקלטת המסך.
ניפוי באגים באופן ידני דרך Android Debug Bridge (adb)
במקרים נדירים, שיטה חלופית לניפוי באגים מרחוק עשויה להיות שימושית. לדוגמה, תוכלו להתחבר ישירות אל פרוטוקול Chrome DevTools (CDP) של Chrome ב-Android.
כדי לעשות זאת, אפשר להשתמש ב-Android Debug Bridge (adb):
- חשוב לוודא שהפעלתם אפשרויות למפתחים ואת ניפוי באגים ב-USB במכשיר Android.
- פותחים את Chrome במכשיר Android.
מחברים את מכשיר Android למכונת הפיתוח באמצעות:
- כבל USB (ישר).
- לחלופין, אפשר להתחבר ל-Wi-Fi באמצעות adb.
בשורת הפקודה של מחשב הפיתוח, מריצים את הפקודה
adb devices -lובודקים אם המכשיר מופיע ברשימה.מעבירים את שקע ה-CDP במכשיר ליציאה המקומית של המחשב, לדוגמה
9222. כדי לעשות זאת, מריצים את:adb forward tcp:9222 localabstract:chrome_devtools_remoteלאחר החיבור, חשוב לראות את הפרטים הבאים:
http://localhost:9222/jsonמפרטת אתpageהיעדים.http://localhost:9222/json/versionחושף את נקודת הקצה (endpoint) של היעדbrowser, כפי שמצוין במסמכי התיעוד של CDP.- השדה
chrome://inspect/#devicesמאוכלס, גם אם ההגדרה Discover של התקני USB לא מסומנת.
דרכים לפתרון בעיות:
- מסמכי תיעוד בנושא
adb לחלופין, אפשר לקרוא מדריכים ישנים יותר: