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

Jecelyn Yeen

כלים חדשים ליצירת אורך CSS

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

בחלונית סגנונות, מחפשים מאפיין CSS באורך (למשל height, padding).

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

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

עדיין תוכל לערוך את ערך היחידה כטקסט - פשוט לוחצים על הערך ומתחילים לערוך.

בעיות ב-Chromium: 1126178, 1172993

הסתרה של בעיות בכרטיסייה 'בעיות'

עכשיו אפשר להסתיר בעיות ספציפיות בכרטיסייה 'בעיות' כדי להתמקד רק בבעיות שחשובות לך.

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

הסתרת תפריט הבעיות

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

חלונית בעיות מוסתרת

בעיה ב-Chromium: 1175722

שופרה התצוגה של הנכסים

כלי הפיתוח משפרים את הצגת הנכסים על ידי:

  • תמיד צריך להדגיש ולמיין את המאפיינים של עצמם קודם בחלונית המסוף, בחלונית Sources ובחלונית Properties.
  • צריך לשטח את הצגת המאפיינים בחלונית Properties (מאפיינים).

לדוגמה, קטע הקוד שבהמשך יוצר אובייקט URL link עם 2 נכסים משלו: user ו-access, ומעדכן את הערך של הנכס שעבר בירושה search.

/* example.js */

const link = new URL('https://goo.gle/devtools-blog');

link.user = { id: 1, name: 'Jane Doe' };
link.access = 'admin';
link.search = `?access=${link.access}`;

כדאי לנסות לרשום את link במסוף. נכסים שבבעלותכם מופיעים עכשיו מודגשים וממוינים ראשונים. בעזרת השינויים האלה, קל יותר לזהות נכסים מותאמים אישית, במיוחד נכסים של Web APIs (למשל URL), עם הרבה נכסים שעברו בירושה.

נכסים בבעלות מודגשים וממוינים ראשונים

חוץ מהשינויים האלה, המאפיינים בחלונית מאפיינים יהיו שטוחים גם עכשיו כדי לשפר את חוויית ניפוי הבאגים בנכסי DOM, במיוחד לרכיבי אינטרנט.

איחוד מאפיינים

בעיות ב-Chromium: 1076820, 1119900

Lighthouse גרסה 8.4 בחלונית Lighthouse

בחלונית Lighthouse פועלת עכשיו Lighthouse גרסה 8.4. עכשיו מערכת Lighthouse תזהה אם האלמנט המהירות שבה נטען רכיב התוכן הכי גדול (LCP) הייתה תמונה שנטענה באופן מדורג, ומומלץ להסיר ממנה את המאפיין loading.

פרטים נוספים על העדכונים זמינים במאמר מה חדש ב-Lighthouse 8.4.

ביקורת LCP שנטענה באופן מדורג בדוח Lighthouse

בעיה ב-Chromium: 772558

מיון קטעי המידע בחלונית 'מקורות'

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

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

מיון קטעי המידע בחלונית 'מקורות'

בעיה ב-Chromium: 1243976

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

עכשיו אפשר ללחוץ כדי לקרוא את נתוני הגרסה של כלי הפיתוח ב-6 שפות אחרות – רוסית, סינית, ספרדית, יפנית, פורטוגזית וקוריאנית דרך הכרטיסייה 'מה חדש'.

החל מגרסה 94 של Chrome, אפשר להגדיר את השפה המועדפת בכלי הפיתוח. אם מצאת בעיות בתרגומים, תוכל לעזור לנו לשפר אותם על ידי דיווח על בעיה בתרגום דרך אפשרויות נוספות > עזרה > דיווח על באג בתרגום.

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

בעיות ב-Chromium: 1246245, 1245481

ממשק משתמש משופר לתפריט הפקודות של כלי הפיתוח

האם היה קשה לחפש קובץ בתפריט הפקודה? חדשות טובות, ממשק המשתמש של תפריט הפקודה משופר!

פותחים את תפריט הפקודה כדי לחפש קובץ עם מקשי הקיצור Control+P ב-Windows וב-Linux, או Command+P ב-MacOS.

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

תפריט הפקודה

בעיה ב-Chromium: 1201997

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

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

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

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

  • אפשר לשלוח לנו הצעה או משוב דרך crbug.com.
  • כדי לדווח על בעיה בכלי הפיתוח, לוחצים על אפשרויות נוספות   עוד   > עזרה > דיווח על בעיות בכלי הפיתוח בכלי הפיתוח.
  • שליחת ציוץ אל @ChromeDevTools.
  • נשמח לשמוע מה חדש בסרטונים ב-YouTube של כלי הפיתוח או בסרטונים ב-YouTube שקשורים לכלי פיתוח.

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

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

Chrome 127

Chrome 126

Chrome 125

Chrome 124

Chrome 123

Chrome 122

Chrome 121

Chrome 120

Chrome 119

Chrome 118

Chrome 117

Chrome 116

Chrome 115

Chrome 114

Chrome 113

Chrome 112

Chrome 111

Chrome 110

Chrome 109

Chrome 108

Chrome 107

Chrome 106

Chrome 105

Chrome 104

Chrome 103

Chrome 102

Chrome 101

Chrome 100

Chrome 99

Chrome 98

Chrome 97

Chrome 96

Chrome 95

Chrome 94

Chrome 93

Chrome 92

Chrome 91

Chrome 90

Chrome 89

Chrome 88

Chrome 87

Chrome 86

Chrome 85

Chrome 84

Chrome 83

Chrome 82

Chrome 82 בוטל.

Chrome 81

Chrome 80

Chrome 79

Chrome 78

Chrome 77

Chrome 76

Chrome 75

Chrome 74

Chrome 73

Chrome 72

Chrome 71

Chrome 70

Chrome 68

Chrome 67

Chrome 66

Chrome 65

Chrome 64

Chrome 63

Chrome 62

Chrome 61

Chrome 60

Chrome 59