Tests

Les tests unitaires pour les modèles personnalisés Google Tag Manager vous permettent de valider le fonctionnement de vos modèles. Vous pouvez créer un ensemble de tests pour chaque modèle qui peut s'exécuter sans qu'il soit nécessaire de déployer votre balise, ce qui vous permet tester en permanence le comportement de votre modèle pendant le développement. Chaque test peut fournir des exemples de valeurs d'entrée, simuler des appels de fonction et valider le comportement du code.

Limites

  • Les tests unitaires ne vérifient pas les règles de validation, mais vous pouvez vérifier manuellement la validation à l'aide du bouton Exécuter le code.
  • Les vérifications d'autorisation ne sont pas effectuées sur les API simulées dans les tests unitaires.

Ce guide vous explique comment écrire des tests unitaires pour votre modèle personnalisé. Cet exemple crée un modèle de variable qui accepte une chaîne d'entrée et renvoie la version majuscule de cette chaîne.

  1. Créez un modèle de variable. Cliquez sur Modèles dans le panneau de navigation de gauche, puis sur Nouveau dans la section Modèles de variable.

  2. Cliquez sur Champs.

  3. Cliquez sur Ajouter un champ et sélectionnez Saisie de texte. Nommez le champ text1 et définissez le nom à afficher sur "Texte 1".

  4. Dans l'onglet Code, remplacez le code par défaut par ce JavaScript en bac à sable:

    let input = data.text1;
return input.toUpperCase();

  5. Cliquez sur Tests pour ouvrir l'onglet des tests.

  6. Cliquez sur Ajouter un test, puis remplacez le nom du test "Untitled test 1" (Test sans titre 1) par Handles strings".

  7. Cliquez sur l'icône Développer () pour afficher l'éditeur JavaScript en bac à sable du test. Remplacez le code par ce JavaScript de bac à sable:

    // 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');

    Ce test transmet la chaîne 'this is a test' à la variable et vérifie qu'elle renvoie la valeur attendue 'THIS IS A TEST'. L'API runCode permet d'exécuter le code du modèle dans l'onglet Code. L'argument de runCode est un objet utilisé comme ensemble de données global. L'API assertThat renvoie un objet qui peut être utilisé pour effectuer facilement des assertions sur la valeur d'un sujet.

  8. Cliquez sur ▶ Exécuter les tests pour lancer le test. Le résultat du test s'affiche dans la console.

    Le bouton ▶ Run Tests (Exécuter les tests) permet d'exécuter tous les tests activés dans le modèle, dans l'ordre indiqué. Pour modifier cet ordre, utilisez l'icône de déplacement (⠿). Vous pouvez activer ou désactiver temporairement un test en cliquant sur le cercle situé à gauche de son nom. Pour exécuter un seul test, cliquez sur le bouton ▶ qui apparaît lorsque vous passez la souris sur le test.

    La console affiche le nombre total de tests exécutés et le nombre de tests ayant échoué, le cas échéant. Dans ce cas, un seul test a été exécuté, et il devrait réussir.

  9. Cliquez à nouveau sur Add Test (Ajouter un test) pour ajouter un second test. Remplacez le nom du test Untitled test 2 par Handles undefined.

  10. Cliquez sur le test pour le développer et afficher l'éditeur JavaScript dans un bac à sable. Saisissez le code JavaScript de bac à sable dans l'éditeur:

    let variableResult = runCode({});
assertThat(variableResult).isEqualTo(undefined);

  11. Cliquez sur ▶ Exécuter les tests pour exécuter tous les tests en même temps. Le résultat du test s'affiche dans la console.

    Le test Handles undefined doit échouer. Félicitations, vous avez trouvé un bug !

  12. Cliquez sur Code pour revenir en arrière et modifier le code JavaScript de bac à sable du modèle. Mettez à jour le code JavaScript de bac à sable comme suit:

    const getType = require('getType');

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

    Le code mis à jour respecte la bonne pratique qui consiste à valider la variable input avant de l'utiliser.

  13. Cliquez sur Tests pour revenir à la liste des scénarios de test.

  14. Cliquez sur ▶ Exécuter des tests pour exécuter à nouveau tous les scénarios de test. Cette fois, le test Handles undefined devrait réussir.

  15. Cliquez sur Save (Enregistrer), puis fermez l'éditeur de modèles.