Utiliser des assertions JavaScript personnalisées dans des tests Browser

Docs > Surveillance Synthetic > Guides d'utilisation de la surveillance Synthetic > Utiliser des assertions JavaScript personnalisées dans des tests Browser

Présentation

Ce guide décrit la démarche à suivre pour tester une interface utilisateur (IU) à l’aide de code JavaScript personnalisé dans un test Browser. Les assertions JavaScript prennent en charge le code synchrone et asynchrone.

Pour créer une assertion à l’aide de code JavaScript personnalisé, procédez comme suit :

Cliquez sur Assertion et sélectionnez Test your UI with custom JavaScript.
Rédigez le corps de votre assertion.
Si vous le souhaitez, sélectionnez un élément cible dans votre IU.
Cliquez sur Apply.

Pour en savoir plus sur les assertions, consultez la section Étapes des tests Browser.

Vérifier qu’un élément n’est pas sur la page

Pour vérifier qu’un élément avec un ID spécifique n’est pas sur la page, utilisez return !document.getElementById("<ID_ÉLÉMENT>");.

Pour vérifier que des éléments ne sont pas sur la page et renvoyer le nombre d’éléments dans l’erreur de la console, ajoutez ce qui suit au corps de l’assertion :

var element = document.querySelectorAll("<SÉLECTEURS>");
if ( element.length > 0 ){
    console.error(element.length+"  "+"éléments existent");
} 
return element.length === 0;

Vos résultats de tests Browser contiennent des logs console.error.

Logs d'erreur de la console s'affichant dans l'onglet Errors & Warnings du volet latéral de l'étape d'un test

Vérifier qu’un bouton radio est coché

Pour vérifier qu’un bouton radio est coché, utilisez return document.querySelector("<SÉLECTEURS>").checked = true; dans le corps de l’assertion.

Définir la valeur d’un élément de stockage local spécifique

Pour définir la valeur d’un élément de stockage local spécifique, ajoutez ce qui suit au corps de l’assertion :

localStorage.setItem(keyName, keyValue);
return true

Par exemple, pour définir le nombre de millisecondes écoulées depuis la date January 1, 1970, 00:00:00 UTC sur « mytime », utilisez ce qui suit :

localStorage.setItem("mytime", Date.now());
return true

Vérifier que du texte figure dans un PDF affiché

Vous pouvez utiliser une bibliothèque externe pour tester le contenu d’un PDF affiché.

Pour charger des bibliothèques externes, utilisez le paramètre promise dans le corps de l’assertion :

Custom JavaScript

const script = document.createElement('script');
script.type = 'text/javascript';
// Charger une bibliothèque externe
script.src = "https://cdnjs.cloudflare.com/ajax/libs/pdf.js/2.11.338/pdf.min.js";
const promise = new Promise((r) => script.onload = r)
document.head.appendChild(script)

await promise

var loadingTask = pdfjsLib.getDocument("<URL_PDF>");
return await loadingTask.promise.then(function(pdf) {
    return pdf.getPage(1).then(function(page) {
        return page.getTextContent().then(function(content) {
            return content.items[0].str.includes("<CHAÎNE_CONTENU>")
        })
    })
});