אם אתם משתמשים ב-Chrome מגרסה 111 ואילך, יכול להיות שכבר שמתם לב ששינינו את העיצוב של סרגל הצד של נקודות העצירה. ב-Chrome 113, סרגל הצד החדש מחליף לחלוטין את העיצוב הישן. המטרה שלנו בעיצוב החדש הייתה לשפר את תהליך העבודה של נקודות העצירה באמצעות:
סקירה כללית טובה יותר של כל נקודות העצירה שהוגדרו. קל יותר לגשת לתהליכי עבודה נפוצים של משתמשים עם נקודות עצירה, והם אינטואיטיביים יותר. הצגת תכונות מגניבות של נקודות עצירה (breakpoint) קיימות.
בפוסט הזה נניח שכבר ניסיתם לנפות באגים באמצעות נקודות עצירה. אם עדיין לא השתמשתם בנקודות עצירה, כדאי לעיין בסקירה הכללית הזו על נקודות עצירה ולקרוא מידע נוסף על האופן שבו אפשר להשתמש בנקודות עצירה כדי לנפות באגים בקוד.
עכשיו נראה מה כולל העיצוב החדש ואיך אפשר להשתמש בסרגל הצד החדש. חשוב לדעת שהעיצוב החדש מתמקד בשיפור הנוחות והגישה לתכונות הקיימות, במקום בהוספת תכונות חדשות.
השהיה בחריגות כדי לבדוק למה הקוד מחזיר שגיאה
האם הקוד שלכם גורם להפעלת חריגה? אל דאגה! כלי הפיתוח של Chrome מאפשרים להשהות חריגות כדי לעצור את הביצוע בנקודה שבה החריגה הושלכה. כך תוכלו לחקור את הנסיבות שבהן מתרחשת השגיאה בקוד ולהבין אותן טוב יותר. אתם יכולים לבחור אם להשהות את הבדיקה במקרה של חריגות שנתפסות, במקרה של חריגות שלא נתפסות או בשני המקרים. לשם כך, מסמנים את התיבות המתאימות בסרגל הצד.
ניהול נקודות העצירה: מרחיבים קבוצות רלוונטיות של נקודות עצירה ומכווצים קבוצות אחרות כדי להתמקד בנתונים הרלוונטיים
נקודות העצירה יכולות להיות מפוזרות בכמה קבצים. בסרגל הצד של נקודות העצירה, נקודות העצירה מקובצות לפי הקובץ שאליו הן שייכות. כדי להתמקד רק באלה שחשובים לסשן ניפוי הבאגים הנוכחי, מרחיבים את הקבוצות הרלוונטיות של נקודות העצירה ולוחצים על סמל הקובייה כדי לכווץ את הקבוצות הנותרות.
ניהול נקודות העצירה: לחיצה אחת כדי לעבור לקוד, להסיר נקודות עצירה או להפעיל או להשבית אותן
סרגל הצד של נקודות העצירה מאפשר לבצע משימות נפוצות בלחיצה אחת. הנה סקירה כללית של הדרכים שבהן אפשר ...
עוברים למיקום של נקודת העצירה בעורך הקוד. הסרה של נקודת עצירה אחת או של כל נקודות העצירה בקובץ. הפעלה או השבתה של נקודת עצירה אחת או של כל נקודות העצירה בקובץ.
והכול בלחיצה אחת! כמובן, האפשרויות האלה זמינות גם בתפריט ההקשר:
לוחצים על קטע הקוד של נקודת העצירה כדי לעבור למיקום שלה.
רוצה לבדוק איפה בקוד הגדרת את נקודת העצירה ולנתח את הקוד שמסביב? פשוט לוחצים על קטע הקוד של נקודת העצירה בסרגל הצד, והמיקום של הקוד ייפתח בעורך הקוד.
כדי להסיר נקודה אחת או את כל נקודות העצירה בקובץ, לוחצים על לחצן ההסרה.
מעבירים את העכבר מעל נקודת עצירה או מעל קבוצת נקודות עצירה כדי להציג לחצן הסרה. לחיצה על הלחצן מסירה נקודת עצירה אחת או את כל נקודות העצירה בקובץ.
השבתה של נקודת עצירה (breakpoint) אחת או של כל נקודות העצירה בקובץ
מסמנים או מבטלים את הסימון של התיבה לצד נקודת העצירה כדי להפעיל או להשבית אותה.
כדי להפעיל או להשבית את כל נקודות העצירה בקובץ, מעבירים את העכבר מעל קבוצת נקודות העצירה ומסמנים או מבטלים את הסימון של התיבה שמופיעה לצד שם הקובץ.
כדאי להשתמש בתכונות הפחות מוכרות של נקודות העצירה: נקודות עצירה מותנות ונקודות רישום ביומן
עריכת תנאי נקודת העצירה או שינוי היומן של נקודות הרישום (logpoint) על ידי עריכת נקודת העצירה
כדי לערוך תנאי או יומן של נקודת עצירה, מעבירים את העכבר מעל נקודת העצירה ולוחצים על הלחצן עריכה שמופיע. תיפתח תיבת דו-שיח שבה אפשר לשנות את סוג נקודת העצירה ואת הפרטים שלה.
לחלופין, אפשר לבחור את השורה של נקודת העצירה בקוד ולסמן אותה. לאחר מכן, מקלידים Control+Alt+b ב-Linux ו-Command+Alt+b ב-Mac כדי לפתוח את תיבת הדו-שיח לעריכת נקודת העצירה.
אפשר גם לבדוק במהירות את היומן של התנאי או של נקודת ההתחברות ליומן על ידי החזקת העכבר מעל נקודת העצירה בחלונית הצדדית:
סיכום
מטרת העיצוב החדש של סרגל הצד של נקודות העצירה היא להקל על ניפוי הבאגים באמצעות נקודות עצירה. החשוב ביותר: המטרה שלנו הייתה ליצור מבנה מסודר יותר, ולאפשר גישה ופירוש קלים יותר. אנחנו מקווים שהשיפורים האלה יעזרו לך בסשן ניפוי הבא.
אם יש לכם הצעות לשיפורים נוספים, אתם יכולים לדווח על באג.
הורדת הערוצים לתצוגה מקדימה
מומלץ להשתמש ב-Chrome Canary, ב-Dev או ב-Beta כדפדפן הפיתוח שמוגדר כברירת מחדל. ערוצי התצוגה המקדימה האלה מעניקים לכם גישה לתכונות העדכניות ביותר של DevTools, מאפשרים לכם לבדוק ממשקי API מתקדמים לפלטפורמות אינטרנט ולמצוא בעיות באתר לפני שהמשתמשים שלכם יעשו זאת.
יצירת קשר עם צוות כלי הפיתוח ל-Chrome
אתם יכולים להשתמש באפשרויות הבאות כדי לדון בתכונות החדשות, בעדכונים או בכל דבר אחר שקשור ל-DevTools.
- אתם יכולים לשלוח לנו משוב ובקשות להוספת תכונות בכתובת crbug.com.
- מדווחים על בעיה בכלי הפיתוח באמצעות הסמל אפשרויות נוספות > עזרה > דיווח על בעיה בכלי הפיתוח ב-DevTools.
- שולחים ציוץ אל @ChromeDevTools.
- אפשר להשאיר תגובות בסרטונים של מה חדש בכלי הפיתוח ב-YouTube או בסרטונים של טיפים לשימוש בכלי הפיתוח ב-YouTube.