הפעלה חוזרת שלב אחרי שלב במכשיר ההקלטה
עכשיו אפשר להגדיר נקודת עצירה ולנגן מחדש את מסלול המשתמש שלב אחר שלב בחלונית מכשיר ההקלטה.
כדי להגדיר נקודת עצירה, לוחצים על הנקודה הכחולה שליד שלב. מפעילים מחדש את תהליך העבודה של המשתמש. ההפעלה מחדש תיפסק לפני ביצוע השלב. מכאן אפשר להמשיך את ההפעלה מחדש, לבצע שלב או לבטל את ההפעלה מחדש.
בעזרת התכונה הזו תוכלו לראות בקלות את תהליך העבודה של המשתמשים ולפתור באגים.
מידע נוסף זמין במאמר מאמרי עזרה בנושא התכונות של Recorder.
בעיה ב-Chromium: 1257499
תמיכה באירוע של העברת העכבר מעל לחלונית של מכשיר ההקלטה
Recorder תומך עכשיו בהוספת שלב של העברת העכבר מעל (החזקה מעל) באופן ידני בהקלטה.
בדמונה הזו מוצג תפריט קופץ בהעברת העכבר מעליו. מנסים לתעד מסלול משתמש ולוחצים על פריט תפריט.
אם תפעילו מחדש את תהליך השימוש עכשיו, הוא ייכשל כי הכלי להקלטת אירועים לא מתעד אירועי העברת העכבר מעל לפריט באופן אוטומטי במהלך ההקלטה. כדי לפתור את הבעיה, מוסיפים שלב באופן ידני כדי להעביר את העכבר מעל הבורר לפני שלוחצים על פריט התפריט.
בעיה ב-Chromium: 1257499
Largest Contentful Paint (LCP) בחלונית 'תובנות לגבי הביצועים'
LCP הוא מדד חשוב שמתמקד במשתמשים ומשמש למדידת מהירות הטעינה שחושבים שהיא קיימת. עכשיו אפשר למצוא את הנתיבים הקריטיים ואת הסיבות העיקריות לזמן הטעינה של רכיב התוכן הכי גדול (LCP).
בהקלטת הביצועים, לוחצים על תג ה-LCP בציר הזמן. בחלונית פרטים אפשר לראות את הציון של LCP, ללמוד איך לתקן משאבים שמאטים את LCP ולראות את הנתיב הקריטי של משאב ה-LCP.
במאמר תובנות לגבי ביצועים מוסבר איך לקבל תובנות פרקטיות ולשפר את ביצועי האתר בעזרת הלוח.
בעיה ב-Chromium: 1326481
זיהוי הבזקים של טקסט (FOIT, FOUT) כסיבות אפשריות לשינויים בפריסה
בחלונית תובנות לגבי ביצועים, המערכת מזהה עכשיו הצגה קצרה של טקסט בלתי נראה (FOIT) והצגה קצרה של טקסט ללא עיצוב (FOUT) כגורמים אפשריים לשינויים בפריסה.
כדי לראות את הסיבות האפשריות לשינוי בפריסה, לוחצים על צילום מסך בעמודה שינויים בפריסה.
במאמר אופטימיזציה של הטעינה והעיבוד של WebFont מוסבר איך למנוע שינויי פריסה.
בעיות ב-Chromium: 1334628, 1328873
רכיבי handler של פרוטוקולים בחלונית Manifest
עכשיו אפשר להשתמש בכלי הפיתוח כדי לבדוק את רישום ה-handlers של פרוטוקול כתובת ה-URL באפליקציות מסוג Progressive Web App (PWA).
רישום גורמי ה-handler של פרוטוקול כתובת ה-URL מאפשר לאפליקציות PWA מותקנות לטפל בקישורים שמשתמשים בפרוטוקול ספציפי (למשל magnet, web+example) כדי לספק חוויה משולבת יותר.
עוברים לקטע Protocol Handlers (מנהלי פרוטוקולים) באמצעות החלונית Application (אפליקציה) > Manifest (מניפסט). כאן אפשר לראות ולבדוק את כל הפרוטוקולים הזמינים.
לדוגמה, אפשר להתקין את הדמו הזה של PWA. בקטע Protocol Handlers (מנהלי פרוטוקול), מקלידים 'americano' ולוחצים על Test protocol (בדיקת פרוטוקול) כדי לפתוח את דף הקפה באפליקציית ה-PWA.
בעיות ב-Chromium: 1300613
תג השכבה העליונה בחלונית הרכיבים
אתם יכולים להשתמש בתג של השכבה העליונה כדי להבין את המושג של השכבה העליונה ולראות באופן חזותי איך התוכן בשכבה העליונה משתנה.
הרכיב <dialog> הפך לאחרונה ליציב בכל הדפדפנים. כשפותחים תיבת דו-שיח, היא מועברת לשכבה העליונה. תוכן ברמה העליונה מוצג מעל כל התוכן האחר.
בהדגמה הזו, לוחצים על Open dialog (פתיחת תיבת דו-שיח).
כדי להציג באופן חזותי את הרכיבים של השכבה העליונה, כלי הפיתוח מוסיפים מאגר של השכבה העליונה (#top-layer) לעץ DOM. הוא מופיע אחרי תג הסוגר </html>.
כדי לעבור מאלמנט הקונטיינר של השכבה העליונה לאלמנט העץ של השכבה העליונה, לוחצים על הלחצן reveal (חשיפת) לצד האלמנט או הרקע שלו בקונטיינר של השכבה העליונה.
לצד רכיב העץ של השכבה העליונה (לדוגמה, רכיב תיבת הדו-שיח), לוחצים על התג שכבה עליונה כדי לעבור לקונטיינר של השכבה העליונה.
בעיה ב-Chromium: 1313690
צירוף מידע על ניפוי באגים ב-Wasm בזמן הריצה
עכשיו אפשר לצרף מידע על תוצאות ניפוי הבאגים של DWARF ל-Wasm במהלך זמן הריצה. בעבר, בחלונית מקורות הייתה תמיכה רק בקישור של מפות מקור לקובצי JavaScript ו-Wasm.
פותחים קובץ Wasm בחלונית מקורות. לוחצים לחיצה ימנית בעורך ובוחרים באפשרות Add DWARF debugging info… (הוספת מידע על ניפוי באגים בפורמט DWARF) כדי לצרף מידע על ניפוי באגים על פי דרישה.
בעיה ב-Chromium: 1341255
תמיכה בעריכה בזמן אמת במהלך ניפוי באגים
עכשיו אפשר לערוך את הפונקציה העליונה בסטאק בלי להפעיל מחדש את מנתח הבאגים.
ב-Chrome 104, כלי הפיתוח מחזירים את התכונה restart frame. עם זאת, לא ניתן לערוך את הפונקציה שבה אתם מושהים כרגע. מפתחים נוהגים לעצור פונקציה ולערוך אותה בזמן ההשהיה.
בעקבות העדכון הזה, מנתח הבאגים מפעיל מחדש את הפונקציה באופן אוטומטי עם ההגבלות הבאות:
- אפשר לערוך רק את הפונקציה העליונה ביותר במצב השהיה
- אין קריאה רפלקטיבית לאותה פונקציה בהמשך הסטאק
בעיה ב-Chromium: 1334484
הצגה ועריכה של כללי @scope at בחלונית הסגנונות
עכשיו אפשר להציג ולערוך את כללי ה-@scope at-rule של CSS בחלונית Styles.
כללי ה-at @scope הם חלק ממפרט רמה 6 של CSS Cascading and Inheritance. הכללים האלה מאפשרים למפתחים להגדיר את ההיקף של כללי הסגנון ב-CSS.
פותחים את דף ההדגמה הזה ובודקים את היפר-הקישור ברכיב <div class=”dark-theme”>. בחלונית Styles, בודקים את כללי at-rule של @scope. לוחצים על הצהרת הכלל כדי לערוך אותה.