Verifica dell’interfaccia utente testing-your-ui

NOTE
A partire da AEM 6.5, il framework di test dell’interfaccia utente hobbes.js è diventato obsoleto. Adobe non prevede di apportare ulteriori miglioramenti e consiglia ai clienti di utilizzare l’automazione Selenium.
Vedere Funzioni obsolete e rimosse.

L’AEM fornisce un framework per automatizzare i test per l’interfaccia utente dell’AEM. Utilizzando il framework, puoi scrivere ed eseguire test dell’interfaccia utente direttamente in un browser web. Il framework fornisce un’API JavaScript per la creazione di test.

Il framework di test dell'AEM utilizza Hobbes.js, una libreria di test scritta in JavaScript. Il framework Hobbes.js è stato sviluppato per testare l'AEM come parte del processo di sviluppo. Il framework è ora disponibile per l’uso pubblico per testare le applicazioni AEM.

NOTE
Per informazioni complete sull'API, consulta la documentazione di Hobbes.js.

Struttura delle prove structure-of-tests

Quando si utilizzano test automatizzati all’interno dell’AEM, è importante comprendere i seguenti termini:

Azione
Un'azione Azione è un'attività specifica in una pagina Web, ad esempio la selezione di un collegamento o di un pulsante.
Caso di prova
Un test case è una situazione specifica che può essere costituita da una o più azioni.
Suite di test
Una Suite di test è un gruppo di Casi di test correlati che insieme sottopongono a test un caso d'uso specifico.

Esecuzione dei test executing-tests

Visualizzazione delle suite di test viewing-test-suites

Apri la console di test per visualizzare le suite di test registrate. Il pannello Test contiene un elenco di suite di test e dei relativi test case.

Passa alla console Strumenti tramite Navigazione globale > Strumenti > Operazioni > Test.

chlimage_1-63

All’apertura della console, le suite di test sono elencate a sinistra insieme a un’opzione per eseguirle tutte in sequenza. Lo spazio a destra mostrato con uno sfondo a quadretti è un segnaposto per la visualizzazione del contenuto della pagina durante l’esecuzione dei test.

chlimage_1-64

Esecuzione di una singola suite di test running-a-single-test-suite

Le suite di test possono essere eseguite singolarmente. Quando si esegue una suite di test, la pagina cambia quando vengono eseguiti i casi di test e le relative azioni e i risultati vengono visualizzati dopo il completamento del test. Le icone indicano i risultati.

Un’icona di spunta indica che il test è stato superato:

Icona segno di spunta.

Un’icona "X" indica un test non riuscito:

Icona test non riuscito indicata da una X allinterno di un cerchio.

Per eseguire una suite di test:

  1. Nel pannello Test, fate clic sul nome del test case che desiderate eseguire per espandere i dettagli delle azioni.

    chlimage_1-65

  2. Fare clic su Esegui test.

    Immagine del pulsante Esegui test, indicata da un puntatore a destra allinterno di un cerchio.

  3. Il segnaposto viene sostituito con il contenuto della pagina durante l’esecuzione del test.

    chlimage_1-66

  4. Rivedi i risultati del test case toccando o facendo clic sulla descrizione per aprire il pannello Risultato. Toccando o facendo clic sul nome del test case nel pannello Risultato vengono visualizzati tutti i dettagli.

    chlimage_1-67

Esecuzione di più test running-multiple-tests

Le suite di test vengono eseguite in sequenza nell’ordine in cui compaiono nella console. Puoi approfondire un test per visualizzare i risultati dettagliati.

chlimage_1-68

  1. Nel pannello Test fare clic sul pulsante Esegui tutti i test o sul pulsante Esegui test sotto il titolo della suite di test che si desidera eseguire.

    Immagine del pulsante Esegui tutti i test e del pulsante Esegui test, indicata da un puntatore a destra allinterno di un cerchio.

  2. Per visualizzare i risultati di ogni test case, fare clic sul titolo del test case. Facendo clic sul nome del test nel pannello Risultato vengono visualizzati tutti i dettagli.

    chlimage_1-69

Creazione e utilizzo di una suite di test semplice creating-and-using-a-simple-test-suite

La procedura seguente illustra la creazione e l'esecuzione di una suite di test utilizzando il contenuto We.Retail, ma è possibile modificare facilmente il test per utilizzare una pagina Web diversa.

Per informazioni dettagliate sulla creazione di suite di test personalizzate, consulta la documentazione API Hobbes.js.

  1. Apri CRXDE Lite. (https://localhost:4502/crx/de)

  2. Fare clic con il pulsante destro del mouse sulla cartella /etc/clientlibs e scegliere Crea > Crea cartella. Digitare myTests per il nome e fare clic su OK.

  3. Fare clic con il pulsante destro del mouse sulla cartella /etc/clientlibs/myTests e scegliere Crea > Crea nodo. Utilizzare i valori delle proprietà seguenti e fare clic su OK:

    • Nome: myFirstTest
    • Tipo: cq:ClientLibraryFolder
  4. Aggiungi le seguenti proprietà al nodo myFirstTest:

    table 0-row-3 1-row-3 2-row-3
    Nome Tipo Valore
    categories Stringa[] granite.testing.hobbes.tests
    dependencies Stringa[] granite.testing.hobbes.testrunner
    note note
    NOTE
    Solo AEM Forms
    Per testare i moduli adattivi, aggiungi i seguenti valori alle categorie e alle dipendenze. Ad esempio:
    categorie: granite.testing.hobbes.tests, granite.testing.hobbes.af.commons
    dipendenze: granite.testing.hobbes.testrunner, granite.testing.hobbes.af
  5. Fare clic su Salva tutto.

  6. Fare clic con il pulsante destro del mouse sul nodo myFirstTest e scegliere Crea > Crea file. Denomina il file js.txt e fai clic su OK.

  7. Nel file js.txt immettere il testo seguente:

    code language-none
    #base=.
    myTestSuite.js
    
  8. Fare clic su Salva tutto e quindi chiudere il file js.txt.

  9. Fare clic con il pulsante destro del mouse sul nodo myFirstTest e scegliere Crea > Crea file. Denomina il file myTestSuite.js e fai clic su OK.

  10. Copiare il codice seguente nel file myTestSuite.js, quindi salvare il file:

    code language-none
    new hobs.TestSuite("Experience Content Test Suite", {path:"/etc/clientlibs/myTests/myFirstTest/myTestSuite.js"})
       .addTestCase(new hobs.TestCase("Navigate to Experience Content")
          .navigateTo("/content/we-retail/us/en/experience/arctic-surfing-in-lofoten.html")
       )
       .addTestCase(new hobs.TestCase("Hover Over Topnav")
          .mouseover("li.visible-xs")
       )
       .addTestCase(new hobs.TestCase("Click Topnav Link")
          .click("li.active a")
    );
    
  11. Passa alla console Test per provare la tua suite di test.

recommendation-more-help
19ffd973-7af2-44d0-84b5-d547b0dffee2