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

הפסקה הדרגתית של שימוש בקובצי Cookie של צד שלישי

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

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

בעיה ב-Chromium: 1466310.

ניתוח קובצי ה-Cookie של האתר בעזרת כלי הניתוח של 'ארגז החול לפרטיות'

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

כדי לנתח את קובצי ה-cookie:

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

למידע נוסף על אופן השימוש בכלי הניתוח של 'ארגז החול לפרטיות' (PSAT), אפשר לעיין במאמרים הבאים:

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

מידע נוסף זמין במאמר בעיות בדיווח.

דף מוצר משופר של התעלמות

דפוס ברירת המחדל של החרגה של node_modules

הגרסה הזו מפעילה את הביטוי הרגולרי שמוגדר כברירת מחדל בתור כלל החרגה מותאם אישית ב הגדרות > רשימת המתעלמים. כדי לעזור לך להתמקד רק בקוד, הכלי לניפוי באגים ידלג עכשיו על סקריפטים מ-/node_modules/ ומ-/bower_components/ כברירת מחדל. אפשר להשבית את הכלל הזה בכל שלב בהגדרות.

בעיה ב-Chromium: 1496301.

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

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

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

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

1. לפתיחת כלי הפיתוח > מקורות, מוסיפים את התיקייה hidden לרשימת ההתעלמות ומסמנים השהיה בחריגים שזוהו.
2. בדף, בקטע 'Caught' של התרחישים השונים, לוחצים על הלחצנים השונים ורואים שההפעלה מושהית במקרים שהוזכרו.

כדי להשהות את ההפעלה בחריגים שזוהו ו/או בחריגים שלא זוהו (כשהם מסומנים) בקריאות אסינכרוניות, הכלי לניפוי באגים מחפש גורמים מטפלים בדחייה בהבטחות שונות. החל מהגרסה הזו, הכלי לניפוי באגים כבר לא צופה שחריגה תזוהה על ידי Promise.finally(), בדומה לאופן שבו הבלוק try...finally לא מזהה חריגים.

בעיות ב-Chromium: 1489312, 1291064.

השם של x_google_ignoreList השתנה במפות המקור לשם ignoreList

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

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

למידע נוסף על מפות מקור:

• מהן מפות מקור
• ניפוי באגים בקוד המקורי במקום שנפרסו עם מפות מקור

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

עכשיו אפשר לעבור בין קלט מגע וקלט עכבר במהלך ניפוי באגים מרחוק בכרטיסיית Chrome. לדוגמה, כשמריצים מופע של Chrome עם ה---remote-debugging-port=<port> ומתחברים ליעד הרשת הזה דרך chrome://inspect/#devices.

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

בעיה ב-Chromium: 1410433.

בחלונית הרכיבים מוצגות עכשיו כתובות URL של צמתים #document

כדי לאפשר לכם לנפות באגים ב-iframes בקלות, בחלונית רכיבים מוצג עכשיו documentURL ליד #document צמתים.

בעיה ב-Chromium: 1376976.

מדיניות אפקטיבית של Content Security בחלונית האפליקציות

עכשיו אתם יכולים לראות את הפרטים של Content Security Policy (CSP) של מסגרת שנבדקה. כדי להציג את הפרטים, עוברים אל Application > Frames, בוחרים מסגרת וגוללים למטה אל הקטע Content Security Policy (CSP).

בעיה ב-Chromium: 1424714.

ניפוי באגים משופר באנימציה

בכרטיסייה אנימציות אפשר:

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

בעיות ב-Chromium: 1492460, 1489721.

'האם הקוד הזה מהימן?' תיבת דו-שיח ב'מקורות' ואזהרת XSS עצמית במסוף

האפשרות הצגת אזהרה לגבי Self-XSS במהלך הדבקת הקוד ניסוי מופעלת כברירת מחדל. Self-XSS (self-cross-site scripting) היא מתקפה שמטרתה להדביק קוד זדוני בכלי הפיתוח, ומאפשרת לתוקפים לשלוט בחשבונות האינטרנט ובמידע האישי שלכם.

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

בעיה ב-Chromium: 345205.

נקודות עצירה (breakpoint) של פונקציות event listener בעובדי אינטרנט וב-worklets

כשמגדירים נקודת עצירה של אירוע בקטע מקורות > Event ListenerBakpoints

בעיה ב-Chromium: 1445175.

תג המדיה החדש עבור <audio> ו-<video>

עכשיו אפשר להפעיל את תג המדיה החדש לרכיבי <audio> ו-<video> בחלונית רכיבים. כשלוחצים על התג, עוברים לחלונית מדיה, כדי שתוכלו לנפות באגים באלמנטים האלה.

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

בעיה ב-Chromium: 1448214.

השם של הטעינה מראש השתנה ל'טעינה ספקולטיבית'

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

בעיה ב-Chromium: 1478888.

Lighthouse גרסה 11.2.0

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

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

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

בעיות ב-Chromium: 772558.

שיפורי נגישות

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

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

בעיות ב-Chromium: 1488645, 1484918.

פרטים שונים

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

• ביצועים: תוקן אינדיקטור ה-LCP שחסר לפעמים בהקלטה (1487136).
• טעינות ספקולטיביות: תוקנו כתובות ה-URL המלאות של יעדים בתפריט הנפתח שבחלונית רשת (1471020).
• כיסוי:
  • כיסוי קבוע של שורה אחת לקוד מודפס (1464974).
  • פרטי הכיסוי עודכנו עכשיו בטעינה מחדש של הדף (1494457).
• המסוף:
  • תוקנה בחירת טקסט חלקית בהודעות (1487449).
  • תוקן ההבהוב של התפריט הנפתח של ההשלמה האוטומטית (1487453).
  • סוגריים נתמכים בנתיבים של קריסות ובכתובות URL בדוחי קריסות (1473926).
• מקורות: תמיכה בהדגשת תחביר של מילת המפתח using מסוג TypeScript (1490515).
• בתפריט פתיחה מהירה מוצגות עכשיו שיטות פרטיות (1492957).
• Application > (אפליקציה) שירותי רקע: סרגל הפעולות העליון כולל עכשיו טקסט בזמן שינוי הגודל (1487276).
• Elements (רכיבים) > סגנונות:
  • תוקנה הרזולוציה של משתני ה-CSS שעברו בירושה לרכיבים נבחרים (1492162).
  • כשמשביתים נכס CSS, התגובות שלו מוסרות כדי לתקן מעברי תחביר (1101224).
• רשת: העמודה עדיפות מציגה עכשיו הסבר קצר עם מידע על העדיפות הראשונית (אותו דבר מוצג כשמסמנים את האפשרות שורות של בקשות גדולות) (1495735).
• מוציאים משימוש:
  • ההגדרה פורמט צבע הושבתה בגרסאות קודמות ועכשיו היא הוסרה.
  • האפשרות 'מחיקת כל השינויים מברירת המחדל' במקורות הוסרה עכשיו עקב שימוש מועט לאחר ייעול השינויים (1473681).

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

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

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

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

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

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

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