בדיקות

בדיקות יחידה (unit testing) של התבניות המותאמות אישית של Google Tag Manager עוזרות לך לאמת את הפונקציונליות של התבניות. אפשר ליצור קבוצה של בדיקות לכל תבנית שיכול לפעול בלי שיהיה צורך לפרוס את התג, מה שמאפשר לבדוק באופן קבוע את התנהגות התבנית שלך במהלך הפיתוח. כל בדיקה יכולה לספק ערכי קלט לדוגמה, קריאות לפונקציות מדומה והצהרה על התנהגות הקוד.

מגבלות

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

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

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

  2. לוחצים על שדות.

  3. לוחצים על הוספת שדה ובוחרים באפשרות קלט טקסט. נותנים לשדה text1 שם ומגדירים את השם המוצג שלו כ-"Text 1".

  4. בכרטיסייה Code (קוד), מחליפים את קוד ברירת המחדל בקוד ה-JavaScript הזה ב-sandbox:

    let input = data.text1;
    return input.toUpperCase();
    
  5. לוחצים על בדיקות כדי לפתוח את כרטיסיית הבדיקה.

  6. לוחצים על Add Test (הוספת בדיקה) ומשנים את שם הבדיקה מ-"Untitled test 1" (לבדיקה ללא שם ל-"Dandles string").

  7. יש ללחוץ על סמל ההרחבה () כדי לחשוף את עורך ה-JavaScript שבארגז החול (sandbox) של הבדיקה. החלפת הקוד ב-JavaScript שבארגז החול:

    // Call runCode to run the template's code with a lowercase string
    let variableResult = runCode({text1: 'this is a test'});
    // Validate that the result of runCode is an uppercase string.
    assertThat(variableResult).isEqualTo('THIS IS A TEST');
    

    הבדיקה הזו מעבירה את המחרוזת 'this is a test' למשתנה מאמתת שהמשתנה מחזיר את הערך הצפוי של 'THIS IS A TEST'. ה-API runCode משמש להרצת קוד התבנית בכרטיסייה Code (קוד). הארגומנט של runCode הוא אובייקט שמשמש כנתונים גלובליים. ה-API של assertThat מחזיר אובייקט שיכול לשמש לטעינת טענות נכונות (assertions) באופן שוטף לגבי ערך של נושא.

  8. לוחצים על הגיבו כדי להפעיל בדיקות כדי להריץ את הבדיקה. פלט הבדיקה יופיע במסוף.

    הלחצן ⚠ Run Tests מריץ את כל הבדיקות המופעלות בתבנית, לפי הסדר שמוצג. כדי לשנות את הסדר, לוחצים על סמל הגרירה (⠿). אפשר להפעיל או להשבית בדיקה באופן זמני. לשם כך, לוחצים על העיגול שמימין לשם הבדיקה. כדי להריץ בדיקה בודדת, לוחצים על הלחצן ► שמופיע כשמעבירים את העכבר מעל הבדיקה.

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

  9. לוחצים שוב על הוספת בדיקה כדי להוסיף בדיקה שנייה. משנים את שם הבדיקה מ-"Untitled test 2" ל-"Handles undefined".

  10. אפשר ללחוץ על הבדיקה כדי להרחיב אותה ולחשוף את עורך JavaScript שבארגז החול. מזינים JavaScript בארגז חול בעורך:

    let variableResult = runCode({});
    assertThat(variableResult).isEqualTo(undefined);
    
  11. יש ללחוץ על שייצרו בדיקות כדי להריץ את כל הבדיקות בבת אחת. פלט הבדיקה יופיע במסוף.

    הבדיקה handlers undefined אמורה להיכשל. מזל טוב, מצאת באג!

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

    const getType = require('getType');
    
    let input = data.text1;
    if (getType(input) !== 'string') {
      return input;
    }
    return input.toUpperCase();
    

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

  13. לוחצים על בדיקות כדי לחזור לרשימת מקרי הבדיקה.

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

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