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

תכונת תצוגה מקדימה: חלונית סקירה כללית חדשה של CSS

בחלונית החדשה סקירה כללית של שירותי CSS תוכלו לזהות שיפורי CSS פוטנציאליים בדף. פותחים את החלונית סקירה כללית של CSS ולוחצים על Capture Overview (צילום סקירה כללית) כדי ליצור דוח על שירות ה-CSS של הדף.

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

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

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

החלונית 'סקירה כללית של CSS'

בעיה ב-Chromium: 1254557

חוויית העריכה וההעתקה של אורך ה-CSS שוחזרה ומשופרת

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

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

אם נתקלת בבעיות, אפשר לדווח עליהן בכתובת goo.gle/length-feedback.

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

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

עדכונים בכרטיסיית העיבוד

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

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

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

פותחים את תפריט הפקודה, מריצים את הפקודה הצגת רינדור ומגדירים את התפריט הנפתח Emuate Media Medias-contrast (התאמה של תכונת מדיה של CSS).

בעיה ב-Chromium: 1139777

יצירת אמולציה של תכונת העיצוב הכהה האוטומטי של Chrome

בעזרת כלי הפיתוח אפשר לבצע אמולציה של עיצוב כהה אוטומטי כדי לראות בקלות איך הדף נראה כשעיצוב כהה אוטומטי של Chrome מופעל.

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

פותחים את תפריט הפקודות, מריצים את הפקודה הצגת הרינדור ומגדירים את התפריט הנפתח Emuate Auto-Dark mode (המצב הכהה האוטומטי).

יצירת אמולציה של תכונת העיצוב הכהה האוטומטי של Chrome

בעיה ב-Chromium: 1243309

העתקת הצהרות כ-JavaScript בחלונית 'סגנונות'

בתפריט ההקשר הוספנו שתי אפשרויות חדשות, כדי שתוכלו להעתיק בקלות כללי CSS כמאפייני JavaScript. מקשי הקיצור האלה שימושיים במיוחד למפתחים שעובדים עם ספריות CSS-in-JS.

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

למשל, הדוגמה שלמטה תעתיק את paddingLeft: '1.5rem' ללוח.

העתקת ההצהרה כ-JavaScript

בעיה ב-Chromium: 1253635

כרטיסייה חדשה של 'מטען ייעודי (payload)' בחלונית 'רשת'

צריך להשתמש בכרטיסייה החדשה מטען ייעודי (payload) בחלונית רשת כשבודקים בקשת רשת עם מטען ייעודי (payload). בעבר, פרטי המטען הייעודי (Payload) היו זמינים בכרטיסייה כותרות.

הכרטיסייה 'מטען ייעודי (payload)' בחלונית 'רשת'

בעיה ב-Chromium: 1214030

שופרה התצוגה של המאפיינים בחלונית 'מאפיינים'

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

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

הצגת המאפיינים בחלונית 'מאפיינים'

בעיה ב-Chromium: 1226262

עדכוני מסוף

אפשרות להסתיר שגיאות CORS במסוף

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

במסוף, לוחצים על סמל Settings (הגדרות) ומבטלים את הסימון בתיבה Show CORS errors in console.

אפשרות להסתיר שגיאות CORS במסוף

בעיה ב-Chromium: 1251176

תצוגה מקדימה והערכה מתאימות של Intl במסוף

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

אובייקטים בינלאומיים במסוף

בעיה ב-Chromium: 1073804

דוחות קריסות אסינכרוניים עקביים

במסוף מתבצע עכשיו דיווח על דוחות הקריסות של async לגבי פונקציות של async, בהתאם למשימות אסינכרוניות אחרות, בהתאם למה שמוצג במקבץ Call Stack.

דוחות קריסות אסינכרוניים

בעיה ב-Chromium: 1254259

שמירת סרגל הצד של המסוף

סרגל הצד של המסוף יישאר כאן. בגרסה 94 של Chrome הודענו על ההוצאה משימוש של סרגל הצד של Console ואנחנו מבקשים ממפתחים לתת משוב וחששות.

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

סרגל הצד של המסוף

בעיות ב-Chromium: 1232937, 1255586

חלונית מטמון של אפליקציה שהוצאה משימוש בחלונית Application

החלונית מטמון של אפליקציה בחלונית האפליקציה הוסרה כי התמיכה ב-AppCache הוסרה מ-Chrome ומדפדפנים אחרים המבוססים על Chromium.

בעיה ב-Chromium: 1084190

[ניסיוני] חלונית חדשה של Reporting API בחלונית Application

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

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

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

מידע נוסף על Reporting API זמין במאמר הזה.

החלונית Reporting API בחלונית Application

בעיה ב-Chromium: 1205856

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

כדאי להשתמש ב-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