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

תכונות חדשות לקובצי Cookie

ניפוי באגים והסיבה לחסימת קובץ cookie

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

הכרטיסייה 'קובצי Cookie'.

הכרטיסייה Cookies (קובצי Cookie).

  • קובצי cookie של בקשה בצהוב לא נשלחו דרך החוט. כברירת מחדל, המדדים האלה מוסתרים. לוחצים על הצגה קובצי cookie של בקשה שסוננו כדי להציג אותם.
  • קובצי Cookie של תגובה צהובים נשלחו דרך החוט אבל לא אוחסנו.
  • מעבירים את העכבר מעל מידע נוסף. מידע כדי להבין למה קובץ cookie נחסם.
  • רוב הנתונים בטבלאות בקשת קובצי cookie וקובצי cookie של תגובות מגיעים בכותרות ה-HTTP של המשאב. הנתונים של Domain, Path ו-Expiration/Max-Age מגיעים פרוטוקול כלי הפיתוח ל-Chrome.

בעיות ב-Chromium #856777, #993843

הצגת ערכים של קובצי Cookie

לוחצים על שורה בחלונית קובצי ה-cookie כדי להציג את הערך של קובץ ה-cookie הזה.

הצגת הערך של קובץ cookie.

הצגת הערך של קובץ cookie.

בעיה ב-Chromium #462370

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

שאילתת המדיה prefers-color-scheme מאפשרת לכם להתאים את הסגנון של האתר לסגנון של המשתמש העדפות. לדוגמה, אם שאילתת המדיה prefers-color-scheme: dark היא True, המשמעות היא המשתמש הגדיר את מערכת ההפעלה שלו למצב כהה והוא מעדיף ממשקי משתמש במצב כהה.

פותחים את תפריט הפקודה, מריצים את הפקודה הצגת רינדור ומגדירים את Emulate מדיה של CSS להשתמש בתפריט הנפתח עם העדפת צבעים לניפוי באגים בprefers-color-scheme: dark prefers-color-scheme: light סגנונות.

העדפה לערכת צבעים: כהה

כאשר prefers-color-scheme: dark מוגדר (תיבה אמצעית), החלונית 'סגנונות' (תיבה ימנית) מציגה את ה-CSS מוחלת כששאילתת המדיה מוגדרת כ-True ואזור התצוגה מציג את הסגנונות של המצב הכהה (התיבה השמאלית).

אפשר גם לדמות את prefers-reduced-motion: reduce באמצעות תכונת המדיה של CSS התפריט הנפתח 'העדפה לצמצום תנועה' לצד התפריט הנפתח הדמיה של תכונת מדיה של CSS העדפה לערכת צבעים התפריט הנפתח.

בעיה ב-Chromium #1004246

אמולציה של אזור הזמן

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

עדכונים לגבי הקוד

בעזרת הכרטיסייה 'כיסוי' תוכלו למצוא קטעי JavaScript ו-CSS שאינם בשימוש.

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

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

הכרטיסייה 'כיסוי'.

הכרטיסייה 'כיסוי'.

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

נתוני כיסוי בחלונית 'מקורות'.

נתוני כיסוי בחלונית 'מקורות'. שורה 8 היא דוגמה לקוד שלא נמצא בשימוש. שורה 11 היא דוגמה בקוד שנעשה בו שימוש.

בעיות ב-Chromium #1003671, #1004185

ניפוי באגים בסיבה לבקשה למשאב רשת

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

הכרטיסייה 'יוזם'.

הכרטיסייה יוזם.

בעיות ב-Chromium 963183, 842488

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

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

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

בעיה ב-Chromium #977394

מקשי קיצור חדשים לניווט בסמן

אפשר להקיש על Control+P בחלוניות ה'מסוף' או 'מקורות' כדי להעביר את הסמן לשורה שלמעלה. מקישים על כדי להזיז את הסמן לשורה שלמטה, אפשר להקיש על Control+N.

בעיה ב-Chromium #983874

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

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

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

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

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

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

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