ניפוי באגים משופר ב-WebAssembly בכלי הפיתוח ל-Chrome

Ingvar Stepanyan
Ingvar Stepanyan

רקע

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

צילום מסך של התמיכה בניפוי באגים ב-WebAssembly שהייתה מוגבלת בעבר בכלי הפיתוח ל-Chrome.

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

פתרון עקיף זמני

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

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

עם זאת, מפות המקור תוכננו לפורמטים של טקסט עם מיפויים ברורים למושגים ולערכים של JavaScript, ולא לפורמטים בינאריים כמו WebAssembly עם שפות מקור שרירותיות, מערכות סיווג וזיכרון לינארי. כתוצאה מכך, השילוב היה 'האקי', מוגבל ולא נתמך באופן נרחב מחוץ ל-Emscripten.

מזינים את DWARF

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

עדיין יש כמה תכונות ספציפיות ל-WebAssembly שצריך להוסיף כדי להגיע לתאימות מלאה, אבל קומפילרים כמו Clang ו-Rust כבר תומכים בהעברת נתוני DWARF במודולים של WebAssembly, מה שמאפשר לצוות DevTools להתחיל להשתמש בהם ישירות ב-DevTools.

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

במקום זאת, פשוט צריך להורות למהדר לכלול את פרטי ניפוי הבאגים, כמו שאתם עושים בדרך כלל בפלטפורמות אחרות. לדוגמה, ב-Clang וב-Emscripten אפשר לעשות זאת על ידי העברת הדגל -g במהלך הידור:

  clang -g …sources… -target wasm32 -o out.wasm

  emcc -g …sources… -o out.js

אפשר להשתמש באותו דגל -g ב-Rust:

  rustc -g source.rs --target wasm32-unknown-unknown -o out.wasm

לחלופין, אם אתם משתמשים ב-Cargo, המידע על תוצאות ניפוי הבאגים ייכלל כברירת מחדל:

  cargo build --target wasm32-unknown-unknown

השילוב החדש של כלי הפיתוח עם DWARF כבר כולל תמיכה במעבר על הקוד, בהגדרת נקודות עצירה (breakpoint) ובפתרון דוחות קריסות בשפות המקור.

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

העתיד

עם זאת, עדיין יש הרבה עבודה לעשות. לדוגמה, מבחינת הכלים, Emscripten‏ (Binaryen) ו-wasm-pack‏ (wasm-bindgen) עדיין לא תומכים בעדכון של פרטי DWARF על הטרנספורמציות שהם מבצעים. בשלב הזה, הם לא ייהנו מהשילוב הזה.

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

  • פתרון של שמות של משתנים
  • סוגי הדפסה יפה
  • הערכת ביטויים בשפות המקור
  • …ועוד הרבה יותר!

עדכונים נוספים יפורסמו בקרוב.

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

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

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

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