מה חדש בכלי הפיתוח (Chrome 115)

שיפורים ברכיבים

תג חדש של רשת משנה בשירות CSS

בחלונית Elements מופיע תג חדש subgrid עבור subgrid. התכונה הזו היא כרגע ניסיונית ב-Chrome Canary.

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

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

בעיה ב-Chromium: ‏ 1442536.

הסבר קצר על ספציפיות של בורר

בקטע Elements (רכיבים) > Styles (סגנונות), מעבירים את העכבר מעל שם של סלקטור כדי לראות את משקל הספציפיות שלו בתיאור הכלים.

בעיה ב-Chromium: ‏ 1204932.

ערכים של מאפייני CSS בהתאמה אישית בתיבות מידע קצר

בקטע Elements (רכיבים) > Styles (סגנונות), מעבירים את העכבר מעל שם של מאפיין CSS בהתאמה אישית כדי לראות את הערך שלו בתיאור קצר.

צוות כלי הפיתוח רוצה להודות ל-一丝 ול-Suyan על השיפור הזה.

בעיה ב-Chromium: ‏ 1380779.

שיפורים במקורות

הדגשת תחביר CSS

בחלונית Sources מוצגים הנתונים הבאים לגבי קובצי CSS שעברו עיבוד מראש, כמו SASS,‏ SCSS ו-LESS:

• הדגשת תחביר.
• תמיכה בעורכים מוטבעים. העורכים האלה דומים לאלה שמופיעים בElements > Styles, לדוגמה, Color Picker ו-Easing Editor.

בעיות ב-Chromium: ‏ 1302261, ‏ 1392085.

קיצור דרך להגדרת נקודות עצירה מותנות

עכשיו אפשר להגדיר נקודות עצירה מותנות מהר יותר באמצעות קיצור דרך. כדי לפתוח את תיבת הדו-שיח של נקודת עצירה, לוחצים לחיצה ארוכה על Command (ב-MacOS) או על Control (ב-Windows או ב-Linux) ולוחצים על מספר השורה בעמודה הימנית של מקורות > עורך.

בעיה ב-Chromium: ‏ 1405767.

אפליקציה > הקלות במעקב אחר עזיבה מהדף הראשון

הניסוי Bounce Tracking Mitigations ב-Chrome מאפשר לזהות ולמחוק את הנתונים של אתרים שנראה שמבצעים מעקב באתרים שונים באמצעות הטכניקה של מעקב אחר ניתוב מחדש. בחלונית Application > Background Services נוספה כרטיסייה חדשה, Bounce Tracking Mitigations, שמאפשרת להפעיל ידנית אמצעים לצמצום מעקב אחרי קפיצות ולראות רשימה של האתרים שהמצבים שלהם נמחקו.

כדאי לנסות את תכונת האבטחה הזו:

1. חסימת קובצי Cookie של צד שלישי ב-Chrome. עוברים אל > הגדרות > פרטיות ואבטחה > קובצי Cookie ונתונים נוספים מאתרים > חסימת קובצי Cookie של צד שלישי ומפעילים את האפשרות.
2. ב-chrome://flags, מגדירים את הניסוי Bounce Tracking Mitigations לערך Enabled With Deletion.
3. בודקים את דף ההדגמה הזה, פותחים את Application (אפליקציה) > Background Services (שירותים ברקע) > Bounce Tracking Mitigations (אמצעים למניעת מעקב אחר נטישה), לוחצים על קישור נטישה בדף, מחכים (10 שניות) עד ש-Chrome יתעד את הנטישה ולוחצים על Force run (הפעלה מאולצת) כדי למחוק את הסטטוס באופן מיידי.

בנוסף, בכרטיסייה בעיות מוצגת אזהרה לגבי מחיקת המצב הקרובה.

בעיה ב-Chromium: 1432303.

Lighthouse 10.2.0

בחלונית Lighthouse מופעלת עכשיו גרסה Lighthouse 10.2.0. הדבר הכי חשוב הוא שבבדיקה של Largest Contentful Paint מוצגת טבלה עם חישובים של שלבים עבור ויסות מהירות מדומה וויסות מהירות בכלי הפיתוח. אפשר גם לעיין ברשימת השינויים המלאה.

כדי ללמוד את היסודות של השימוש בחלונית Lighthouse בכלי הפיתוח, אפשר לעיין במאמר Lighthouse: אופטימיזציה של מהירות האתר.

בעיה ב-Chromium: ‏ 772558.

התעלמות מסקריפטים של תוכן כברירת מחדל

האפשרות הגדרות > רשימת התעלמות > סקריפטים של תוכן שהוחדרו על ידי תוספים מופעלת עכשיו כברירת מחדל.

כשההגדרה הזו מופעלת:

• Debugger מתעלם מסקריפטים כאלה ולא עוצר בחריגים שנוצרים מהם.
• בחלונית Sources > Call Stack (מקורות > מחסנית קריאות) המערכת מדלגת על פריימים שהיא מתעלמת מהם. כדי להשבית את הדילוג כאן, מסמנים את התיבה הצגת מסגרות שכלולות ברשימת קטעי הקוד להתעלמות.
• המסוף מכווץ מסגרות שהמערכת מתעלמת מהן בנתוני מעקב אחר מחסנית. כדי להרחיב, לוחצים על הצגת עוד N מסגרות, וכדי לכווץ שוב, לוחצים על הצגת פחות.

בנוסף, הטקסט בתיבות הסימון ברשימת ההתעלמות ברור יותר.

בעיות ב-Chromium: 1440958, ‏ 1364501.

רשת > הדפסה מעוצבת של תגובות כברירת מחדל

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

בנוסף, קובצי SVG מקבלים הדגשה של התחביר.

בעיות ב-Chromium: 1382752, ‏ 1385374.

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

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

• ‫ הגדרות > מכשירים: נוסף Facebook for Android v407 on Pixel 6 לרשימת מחרוזות הסוכן.
• רשת: נוסף מקש הקיצור ניקוי יומן הרשת (1444991):
  • ‫MacOS: ‏ Command + K
  • ‫Windows/Linux: ‏ Control + L
• הוסרה האפשרות בתפריט הנפתח Recorder > Recording N > Performance insights panel (1414773).
• גיליונות סגנונות שלא נטענו מוסתרים עכשיו מעץ הניווט (1386059).
• ביצועים: תוקנה הצגה שגויה של טראק האינטראקציות שניתן להרחיב (1432510).
• רכיבים: גיליונות סגנונות שלא נטענו מסומנים עכשיו בקו תחתון גלי (1440626).
• Debugger לא נכנס אוטומטית ל-WebAssembly כשאין פלאגין לשפה הרלוונטית (1443342).
• הקיצור להזזת הסמן מילה אחת בכל פעם שוחזר לקובצי CSS במקורות > עורך (1241848):
  • ‫MacOS: ‏ Alt + חץ
  • Windows/Linux: ‏ Ctrl + חץ

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

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

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

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

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

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

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