Esercitazione: Verifica del modulo adattivo

Questa esercitazione è un passaggio della serie Crea il tuo primo modulo adattivo . Si consiglia di seguire la serie in sequenza cronologica per comprendere, eseguire e illustrare il caso d’uso completo dell’esercitazione.

Una volta che il modulo adattivo è pronto, è importante testare l’adattivo prima di distribuirlo agli utenti finali. È possibile testare manualmente (test funzionale) ogni campo o automatizzare il test del modulo adattivo. Quando si dispone di più moduli adattivi, verificare manualmente ogni campo di tutti i moduli adattivi diventa un’attività scoraggiante.

AEM Forms fornire un framework di test, Calvin, per automatizzare il test dei moduli adattivi. Utilizzando il framework, puoi scrivere ed eseguire test di interfaccia utente direttamente in un browser web. Il framework fornisce API JavaScript per la creazione di test. Il test automatico consente di verificare l’esperienza di precompilazione di un modulo adattivo, inviare l’esperienza di un modulo adattivo, regole di espressione, da convalide, caricamento lento e interazioni con l’interfaccia utente. Questa esercitazione descrive i passaggi necessari per creare ed eseguire test automatizzati su un modulo adattivo. Al termine di questa esercitazione, potrai:

Passaggio 1: Creare una suite di test

Le suite di test dispongono di una raccolta di casi di test. Puoi avere più suite di test. È consigliabile disporre di una suite di test separata per ciascun modulo. Per creare una suite di test:

  1. Accedi AEM Forms istanza di authoring in come amministratore. Apri CRXDE Lite. Tocca AEM Logo > Strumenti > Generale > CRXDE Lite oppure apri l'URL https://localhost:4502/crx/de/index.jsp in un browser per aprire CRXDE Lite.

  2. Passa a /etc/clientlibs in CRXDE Lite. Fai clic con il pulsante destro del mouse sulla sottocartella /etc/clientlibs e fai clic su Crea > Crea nodo. Nel campo Name digitare WeRetailFormTestCases. Seleziona il tipo cq:ClientLibraryFolder e fai clic su OK. Crea un nodo. Puoi utilizzare qualsiasi nome al posto di WeRetailFormTestCases.

  3. Aggiungi le seguenti proprietà al nodo WeRetailFormTestCases e tocca Salva ALL.

    Proprietà Tipo Più Valore
    categorie Stringa Abilitato
    • granite.testing.hobbes.tests
    • granite.testing.calvin.tests
    dipendenze Stringa Abilitato
    • granite.testing.hobbes.testrunner
    • granite.testing.calvin
    • apps.testframework.all

    Assicurati che ogni proprietà venga aggiunta a una casella separata come mostrato di seguito:

    dipendenze

  4. Fai clic con il pulsante destro del mouse sul nodo WeRetailFormTestCases e fai clic su Crea > Crea file. Nel campo Nome, digita js.txt e fai clic su OK.

  5. Apri il file js.txt per la modifica, aggiungi il codice seguente e salva il file:

    #base=.
     init.js
    
  6. Crea un file, init.js, nel nodo WeRetailFormTestCases. Aggiungi il codice seguente al file e tocca Salva tutto.

    (function(window, hobs) {
        'use strict';
        window.testsuites = window.testsuites || {};
      // Registering the test form suite to the sytem
      // If there are other forms, all registration should be done here
        window.testsuites.testForm3 = new hobs.TestSuite("We retail - Tests", {
            path: '/etc/clientlibs/WeRetailFormTestCases/init.js',
            register: true
        });
     // window.testsuites.testForm2 = new hobs.TestSuite("testForm2");
    }(window, window.hobs));
    

    Il codice riportato sopra crea una suite di test denominata We retail - Tests.

  7. Apri AEM interfaccia utente di test (AEM > Strumenti > Operazioni > Test). La suite di test - We retail - Tests - è elencata nell'interfaccia utente.

    we-retail-test-suite

Passaggio 2: Crea un caso di test per precompilare i valori in un modulo adattivo

Un test case è un insieme di azioni per testare una funzionalità specifica. Ad esempio, la precompilazione di tutti i campi di un modulo e la convalida di alcuni campi per garantire l’immissione dei valori corretti.

Un’azione è un’attività specifica in un modulo adattivo, ad esempio fare clic su un pulsante. Per creare un caso di test e azioni per convalidare l’input dell’utente per ciascun campo modulo adattivo:

  1. In CRXDE lite, passa alla cartella /content/forms/af/create-first-adaptive-form . Fai clic con il pulsante destro del mouse sul nodo della cartella create-first-adaptive-form e fai clic su Crea Crea file. Nel campo Nome, digita prefill.xml e fai clic su OK. Aggiungi al file il codice seguente:

    <?xml version="1.0" encoding="UTF-8"?><afData>
      <afUnboundData>
        <data>
          <customer_ID>371767</customer_ID>
          <customer_Name>John Jacobs</customer_Name>
          <customer_Shipping_Address>1657 1657 Riverside Drive Redding</customer_Shipping_Address>
          <customer_State>California</customer_State>
          <customer_ZIPCode>096001</customer_ZIPCode>
         </data>
      </afUnboundData>
      <afBoundData>
        <data xmlns:xfa="https://www.xfa.org/schema/xfa-data/1.0/"/>
      </afBoundData>
    </afData>
    
  2. Accedi a /etc/clientlibs. Fai clic con il pulsante destro del mouse sulla sottocartella /etc/clientlibs e fai clic su Crea> Crea nodo.

    Nel campo Nome digitare WeRetailFormTests. Selezionare il tipo come cq:ClientLibraryFolder e fare clic su OK.

  3. Aggiungi le seguenti proprietà al nodo WeRetailFormTests .

    Proprietà Tipo Più Valore
    categorie Stringa Abilitato
    • granite.testing.hobbes.tests
    • granite.testing.hobbes.tests.testForm
    dipendenze Stringa Abilitato
    • granite.testing.calvin.tests
  4. Crea un file, js.txt, nel nodo WeRetailFormTests . Aggiungi quanto segue al file :

    #base=.
    prefillTest.js
    

    Fare clic su Salva tutto.

  5. Crea un file prefillTest.js nel nodo WeRetailFormTests . Aggiungi il codice seguente al file . Il codice crea un test case. Il test case precompila tutti i campi di un modulo e convalida alcuni campi per assicurarsi che vengano immessi valori corretti.

    (function (window, hobs) {
        'use strict';
    
        var ts = new hobs.TestSuite("Prefill Test", {
            path: '/etc/clientlibs/WeRetailFormTests/prefillTest.js',
            register: false
        })
    
        .addTestCase(new hobs.TestCase("Prefill Test")
            // navigate to the testForm which is to be test
            .navigateTo("/content/forms/af/create-first-adaptive-form/shipping-address-add-update-form.html?wcmmode=disabled&dataRef=crx:///content/forms/af/create-first-adaptive-form/prefill.xml")
            // check if adaptive form is loaded
            .asserts.isTrue(function () {
                return calvin.isFormLoaded()
            })
            .asserts.isTrue(function () {
                return calvin.model("customer_ID").value == 371767;
            })
            .asserts.isTrue(function () {
                return calvin.model("customer_ZIPCode").value == 96001;
            })
        );
    
        // register the test suite with testForm
        window.testsuites.testForm3.add(ts);
    
    }(window, window.hobs));
    

    Il test case viene creato e pronto per essere eseguito. È possibile creare casi di test per convalidare vari aspetti di un modulo adattivo, ad esempio per controllare l’esecuzione dello script di calcolo, la convalida dei pattern e la convalida dell’esperienza di invio di un modulo adattivo. Per informazioni sui vari aspetti del test dei moduli adattivi, vedere test automatico dei moduli adattivi.

Passaggio 3: Esegui tutti i test in una suite o singoli casi di test

Una suite di test può avere più casi di test. Puoi eseguire tutti i casi di test in una suite di test contemporaneamente o singolarmente. Quando esegui un test, le icone indicano i risultati:

  • Un’icona a forma di segno di spunta indica un test superato: save_icon
  • Un'icona "X" indica un test non riuscito: icona di chiusura
  1. Passa all'icona AEM > Strumenti> Operazioni> Test

  2. Per eseguire tutti i test della suite di test:

    1. Nel pannello Test, tocca We retail - Test (1). Si espande per visualizzare l’elenco dei test.

    2. Toccare il pulsante Esegui test. L’area vuota sul lato destro dello schermo viene sostituita con un modulo adattivo durante l’esecuzione del test.

      test completo

  3. Per eseguire un singolo test dalla suite di test:

    1. Nel pannello Test, tocca We retail - Test (1). Si espande per visualizzare l’elenco dei test.
    2. Toccare il Test di precompilazione e toccare il pulsante Esegui test. L’area vuota sul lato destro dello schermo viene sostituita con un modulo adattivo durante l’esecuzione del test.
  4. Toccare il nome del test, Prova di precompilazione, per esaminare i risultati del test case. Apre il pannello Risultato. Toccare il nome del Test Case nel pannello Risultato per visualizzare tutti i dettagli del test.

    risultati della revisione

Ora il modulo adattivo è pronto per la pubblicazione.

In questa pagina