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

Sofia Emelianova

Jecelyn Yeen

שינוי כותרות התגובות של הרשת

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

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

• כותרות של שיתוף משאבים בין מקורות (CORS)
• כותרות של Permissions-Policy
• כותרות של בידוד מרובי מקורות

כדי לשנות את הערך של כותרת, עוברים אל Network (רשת) > Headers (כותרות) > Response Headers (כותרות תגובה), מעבירים את העכבר מעל הערך של הכותרת, לוחצים על ועורכים אותו.

אפשר גם להוסיף כותרות מותאמות אישית.

כדי לערוך את כל ההחלפות במקום אחד, עורכים את הקובץ .headers במקורות > החלפות. אפשר גם ללחוץ על Add override rule כדי לבטל כמה בקשות באמצעות תווים כלליים (*).

בעיה ב-Chromium: ‏ 1288023.

שיפורים בניפוי הבאגים ב-Nuxt, ב-Vite וב-Rollup

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

• במעקב אחר המסוף, מתחת לקישור הצגת N מסגרות נוספות.
• בקטע מקורות > Call Stack, לוחצים על Show ignore-listed frames (הצגת מסגרות ברשימת ההתעלמות).

כדי להביא לכם את השיפורים האלה, הצוותים של כלי הפיתוח, Nuxt,‏ Vite ו-Rollup שיתפו פעולה כדי לאמץ את x_google_ignoreList התוסף למפת מקור:

• גרסה Nuxt 3.3
• Vite Server Options
• אפשרויות הגדרה של נכסי-על

צוות DevTools רוצה להודות לצוותים של Nuxt,‏ Vite ו-Rollup על כך שהם אפשרו את זה. אנחנו מעריכים את המאמצים ושיתוף הפעולה שלך, שהיו חיוניים להצלחת ההטמעה הזו. שוב תודה על התוכן שהוספת.

שיפורים ב-CSS בכרטיסייה Elements > Styles

מאפיינים וערכים לא תקינים ב-CSS

כדי לעזור לכם לאבחן בעיות ב-CSS מהר יותר, בחלונית Styles מופיע עכשיו קו חוצה על:

• הצהרת CSS שלמה (מאפיין וגם ערך) כשמאפיין ה-CSS לא תקין.
• רק הערך, אם מאפיין ה-CSS תקין אבל הערך לא תקין.

צוות כלי הפיתוח רוצה להביע את תודתו ל-Yisi(一丝) על השיפור הזה.

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

מאפיין הקיצור animation של CSS מכיל עכשיו קישורים לכללי ה-at @keyframes התואמים, כך שתוכלו לנווט מהר יותר בחלונית Styles.

בעיה ב-Chromium: ‏ 1420656.

הגדרה חדשה במסוף: השלמה אוטומטית בהקשה על Enter

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

כברירת מחדל, כדי לאשר הצעה להשלמה אוטומטית, אפשר להקיש על Tab או על Arrow right. כדי להפעיל השלמה אוטומטית גם עם Enter, מפעילים את האפשרות הגדרות > מסוף > אישור הצעה להשלמה אוטומטית בלחיצה על Enter.

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

בעיה ב-Chromium: 1276960.

הדגשה של קבצים שנוצרו בתפריט הפקודות

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

בעיה ב-Chromium: ‏ 1424345.

הוצאה משימוש של הכלי לניתוח ביצועים (profiler) של JavaScript: שלב שני

הצוות של כלי הפיתוח ל-Chrome תכנן כבר בגרסה Chrome 58 להוציא משימוש את JavaScript Profiler, ולעודד מפתחי Node.js ו-Deno להשתמש בחלונית Performance כדי ליצור פרופילים של ביצועי המעבד (CPU) ב-JavaScript.

בגרסה 113 של כלי הפיתוח מתחיל השלב השני של הוצאה משימוש של הכלי לניתוח ביצועים (profiler) של JavaScript, שמתבצעת בארבעה שלבים. בשלב הזה, עדיין אפשר לפתוח את החלונית, אבל ממשק המשתמש שלה כבר לא זמין.

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

בעיה ב-Chromium: 1354548.

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

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

• תוקן באג שגרם להדפסה מעוצבת בלוח מקורות לטפל בשמות משתנים עם תווים ב-Unicode בצורה שגויה (1425055).
• בכרטיסייה בעיות נוספה הודעה חדשה לגבי בעיות במילוי אוטומטי שקשורות לערכי HTML לא סטנדרטיים (1399414).

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

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

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

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

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

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

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