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

Sofia Emelianova

בדיקת מיקום העוגן ב-CSS בחלונית הרכיבים

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

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

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

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

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

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

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

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

בעיה ב-Chromium: ‏ 40924349.

פונקציות חדשות של event listener לגלילה עם הצמדה

הרשימה Sources > Event Listener Breakpoints > Control כוללת שני listeners שקשורים ל-scroll-snap: ‏ scrollsnapchange ו-scrollsnapchanging. האירועים האלה מופעלים כשגוללים את מאגר הגלילה באופן שגורם לו להיצמד לאלמנט חדש.

בעיה ב-Chromium: 40286359.

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

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

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

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

בעיה ב-Chromium: ‏ 342406608.

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

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

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

בעיה ב-Chromium: ‏ 342406608.

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

בדומה לאירועי WebSocket אחרים, החלונית Performance מתעדת עכשיו את האירועים Send WebSocket Message ו-Receive WebSocket Message ומציגה אותם בנתוני הביצועים. לדוגמה:

בעיה ב-Chromium: 40286129.

מידע חשוב נוסף

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

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

הורדת ערוצי התצוגה המקדימה

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

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

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

• אתם מוזמנים לשלוח לנו משוב ובקשות להוספת תכונות בכתובת crbug.com.
• אפשר לדווח על בעיה בכלי פיתוח באמצעות הסמל more_vert אפשרויות נוספות > עזרה > דיווח על בעיה בכלי פיתוח בכלי הפיתוח.
• שולחים ציוץ אל ‎@ChromeDevTools.
• אפשר להוסיף תגובות לסרטונים What's new in DevTools YouTube videos או DevTools Tips YouTube videos.

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

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