משתמשים בנקודות עצירה כדי להשהות את קוד ה-JavaScript. במדריך הזה מוסבר על כל סוג של נקודת עצירה שזמינה ב-DevTools, ומוסבר מתי כדאי להשתמש בכל סוג ואיך מגדירים כל סוג. במאמר תחילת העבודה עם ניפוי באגים ב-JavaScript בכלי הפיתוח ל-Chrome מופיע מדריך אינטראקטיבי לתהליך ניפוי הבאגים.
סקירה כללית על הזמנים שבהם כדאי להשתמש בכל סוג של נקודת עצירה
הסוג הידוע ביותר של נקודת עצירה הוא נקודת עצירה בשורת קוד. עם זאת, הגדרת נקודות עצירה בשורת קוד יכולה להיות לא יעילה, במיוחד אם אתם לא יודעים בדיוק איפה לחפש או אם אתם עובדים עם בסיס קוד גדול. כדי לחסוך זמן בניפוי באגים, כדאי לדעת איך ומתי משתמשים בסוגי נקודות העצירה האחרים.
| סוג נקודת העצירה (breakpoint) | כדאי להשתמש באפשרות הזו אם רוצים ... |
|---|---|
| Line-of-code | השהיה באזור מדויק בקוד. |
| שורת קוד מותנית | השהיה באזור מדויק בקוד, אבל רק כשתנאי אחר מתקיים. |
| Logpoint | הוספת הודעה למסוף בלי להשהות את הביצוע. |
| DOM | השהיה בקוד שמשנה או מסיר צומת DOM ספציפי או את הצמתים המשניים שלו. |
| XHR | השהיה כאשר כתובת URL של XHR מכילה תבנית מחרוזת. |
| מעקב אחר אירועים | השהיה של הקוד שפועל אחרי הפעלת אירוע, כמו click. |
| חריג | משהים את שורת הקוד שמפעילה חריגה שזוהתה או חריגה שלא זוהתה. |
| פעולה | השהיה בכל פעם שמופיעה קריאה לפונקציה ספציפית. |
| Trusted Type | השהיה בהפרות של סוגים מהימנים. |
נקודות עצירה בשורת קוד
כדאי להשתמש בנקודת עצירה בשורת קוד כשאתם יודעים מהו אזור הקוד המדויק שצריך לבדוק. DevTools תמיד מושהה לפני ששורת הקוד הזו מבוצעת.
כדי להגדיר נקודת עצירה בשורת קוד ב-DevTools:
- לוחצים על החלונית מקורות.
- פותחים את הקובץ שמכיל את שורת הקוד שרוצים להפסיק בה.
- עוברים לשורת הקוד.
- משמאל לשורת הקוד מופיעה העמודה של מספר השורה. לוחצים עליו. סמל כחול מופיע בחלק העליון של העמודה של מספר השורה.