מה חדש בכלי הפיתוח, Chrome 127

Sofia Emelianova
Sofia Emelianova

כדי לעזור לכם לנפות באגים בתכונה מיקום עוגן, הכרטיסייה סגנונות מקשרת עכשיו מזהי עוגן מפורשים ועוגנים משתמעים לצמתים שלהם.

הקוד לפני ואחרי הקישור של עוגנים מפורשים ועוגנים משתמעים.

בנוסף, ערך המאפיין popovertarget מקושר עכשיו לרכיב popover שלו ב-DOM.

לפני ואחרי קישור popovertarget לאלמנט ה-popover שלו.

שיפורים בחלונית המקורות

בגרסה הזו נוספו כמה שיפורים לחלונית מקורות.

שיפור התכונה 'אין להשהות כאן'

האפשרות 'אין להשהות כאן' מאפשרת למנוע מהכלי לניפוי באגים להשהות שוב ושוב באותה שורה. כך קל יותר לעבוד עם נקודות עצירה לא רלוונטיות שמופעל בהן אירוע שוב ושוב. הגרסה הזו משפרת את היכולת הזו, והיא פועלת עכשיו עבור:

  • חריגות או דחיות של הבטחות מפונקציות מובנות.
  • 'ביטול' של נקודות עצירה של DOM, אחזור/XHR והפרת CSP.
  • בניתוח של Wasm.

איך תהליך העבודה פועל:

בעיה ב-Chromium: ‏ 40924349.

פונקציות event listener חדשות לאירועי 'הצמדה לפס גלילה'

ברשימה מקורות > נקודות עצירה של רכיבי מעקב אירועים > אמצעי בקרה מתווספים שני רכיבי מעקב שקשורים ל-scroll-snap: scrollsnapchange ו-scrollsnapchanging. האירועים האלה מופעלים כשגוללים בתוך מאגר הגלילה באופן שגורם לו להיצמד לרכיב חדש.

לפני ואחרי הוספת פונקציות event listener שקשורות ל-scroll-snap.

בעיה ב-Chromium: 40286359.

שיפורים בחלונית 'רשת'

בגרסה הזו נוספו כמה שיפורים לחלונית רשת.

הגדרות קבועות מראש של הגבלת רוחב פס עודכנו

בחלונית Network (רשת) מתעדכנות הגדרות קבועות מראש של ויסות נתונים: Fast 4G (4G מהיר) חדש, Fast 3G (3G מהיר) ששמו שונה ל-Slow 4G (4G איטי) ו-Slow 3G (3G איטי) ששמו שונה ל-3G (3G). כך אפשר להתאים את הבדיקה טוב יותר להגדרות המוגדרות מראש של Lighthouse.

ההגדרות המוגדרות מראש של הגבלת רוחב הפס לפני ואחרי העדכון.

בעיה ב-Chromium: ‏ 342406608.

פרטי ה-Service Worker בשדות בהתאמה אישית בפורמט HAR

כשמייצאים את יומן הרשת לפורמט HAR, עכשיו אפשר לראות את המידע שקשור לשירותי ה-Workers, כולל תזמונים, כשדות בהתאמה אישית (עם קו תחתון בתחילת השם). לדוגמה, יכול להיות שתמצאו את השדות החדשים הבאים ביומן:

...
"response": {
  ...
  "_fetchedViaServiceWorker": true,
  "_responseCacheStorageCacheName": "V1",
  "_serviceWorkerResponseSource": "cache-storage"
}
...
"timings": {
  ...
  "_workerStart": -1,
  "_workerReady": -1,
  "_workerFetchStart": -1,
  "_workerRespondWithSettled": -1
}
...

בעיה ב-Chromium: ‏ 342406608.

שליחה וקבלה של אירועי WebSocket בחלונית 'ביצועים'

בדומה לאירועים אחרים של WebSocket, מעכשיו האירועים שליחת הודעת WebSocket וקבלה של הודעת WebSocket מתועדים בחלונית ביצועים ומוצגים בנתיב הביצועים. לדוגמה:

האירוע 'קבלה של הודעת WebSocket' שצולם בנתיב המעקב אחר הביצועים.

בעיה ב-Chromium: ‏ 40286129.

רגעי שיא שונים

ריכזנו כאן כמה מהתיקונים והשיפורים החשובים בגרסה הזו:

  • נגישות: קוראי מסך מקריאים עכשיו את תוכן ההודעות במסוף כשגוללים ביומן באמצעות מקשי החיצים למעלה ולמטה (344484979).
  • מקורות:
    • דף: אפשרות התפריט שמירה בשם שומרת עכשיו קבצים של מודולים של Wasm כקבצים בינאריים תקינים של Wasm במקום כטקסט Base64 (40784130).
    • Call stack: הסירה של הסיומת (async) מתיאורי מסגרת הקריאה האסינכרונית, שינוי ההדגשה שלהם מנטוי לעבה (343750870).
  • זיכרון: הסרנו את InternalNodes בגודל אפס, שהוא לא נחוץ, מסיכום של קובץ snapshot של אשכול (340200025).
  • רשת: תוקן באג שגרם לכך שלא ניתן היה להציג תצוגה מקדימה של תוכן התגובה בסטרימינג לבקשות שרק התחילו אבל עדיין לא קיבלו אירוע responseReceived (338340752).
  • ביצועים:
    • נתונים סטטיסטיים של הבורר: נוספה הסבר קצר על העמודה %-of-Slow-Path-Non-Matches (324282954).
    • מצב הגדרת מסלולים: הלחצן סיום הגדרת המסלולים הועבר לפינה השמאלית התחתונה (345256274).
  • מסוף: תוקנה באג שבו הוצגו כמה הודעות זהות במסוף כשמנווטים באמצעות המטמון לאחור/קדימה (40894153).
  • הגדרות: נוספו סמלי עזר לצד כל הכרטיסיות.

מורידים את הערוצים של התצוגה המקדימה.

מומלץ להשתמש ב-Chrome Canary, ב-Dev או ב-Beta כדפדפן הפיתוח שמוגדר כברירת מחדל. ערוצי התצוגה המקדימה האלה מעניקים לכם גישה לתכונות העדכניות ביותר של DevTools, מאפשרים לכם לבדוק ממשקי API מתקדמים לפלטפורמות אינטרנט ולמצוא בעיות באתר לפני שהמשתמשים שלכם יעשו זאת.

יצירת קשר עם צוות כלי הפיתוח ל-Chrome

אתם יכולים להשתמש באפשרויות הבאות כדי לדון בתכונות החדשות, בעדכונים או בכל דבר אחר שקשור ל-DevTools.

מה חדש בכלי הפיתוח

רשימה של כל מה שנדון בסדרה מה חדש ב-DevTools.