アダプティブフォームのテスト自動化

概要

アダプティブフォームは、顧客とのやり取りを行う上で欠かすことができないものです。新しい修正パックの展開中やフォーム内のルールの変更中など、アダプティブフォームで行った変更をすべてテストすることが重要です。 しかしながら、アダプティブフォームの機能テストおよびすべてのフィールドの機能テストは面倒な作業です。

Calvin を使用すれば Web ブラウザーでアダプティブフォームの自動テストを実行できます。Calvinはテストの実行にHobbesのユーザーインターフェイスを利用し、次のツールを提供します。

• テスト作成用の JavaScript API。
• テスト実行用のユーザーインターフェイス。

Calvin を使用して、CRXDE でテストケースを作成して Web ブラウザーで直接 UI テストを実行し、アダプティブフォームの以下の点について十分にテストすることができます。

前提条件

この記事を読んでテストケースを作成する前に、次の内容を理解しておく必要があります。

• テストスイートの作成とホッブズを使用したテストケースの実行
• Hobbes JavaScript API
• Calvin JavaScript API

例： Hobbes をテスト用フレームワークとして使用してアダプティブフォームのテストスイートを作成する

次の例では、複数のアダプティブフォームのテスト用にテストスイートを作成する手順を説明しています。テストする必要のある各フォームに対して個別のテストケースを作成します。以下の手順と同じ手順に従って、手順 11 の JavaScript コードを変更し、独自のテストスイートを作成してアダプティブフォームをテストすることができます。

1. WebブラウザーのCRXDE Liteに移動：https://'[server]:[port]'/crx/de.

2. /etc/clientlibs サブフォルダーを右クリックして、作成／ノードを作成​をクリックします。名前（ここでは afTestRegistration）を入力し、ノードのタイプを cq:ClientLibraryFolder と指定して「OK」をクリックします。

   clientlibs フォルダーには、使用するアプリケーション（JS および Init）の登録機能が含まれています。clientlibs フォルダーには、フォームに固有の Hobbes のすべてのテストスイートオブジェクトを登録することをお勧めします。

3. 次のプロパティ値を、新しく作成したノード（ここでは afTestRegistration）で指定し、「すべて保存」をクリックしますこれらのプロパティにより、Hobbes でフォルダーをテストとして認識できます。このクライアントライブラリを他のクライアントライブラリの依存関係として再利用するには、granite.testing.calvin.testsという名前を付けます。

1. テストノード（ここでは​afTestRegistration）​を右クリックし、作成/ファイルを作成​をクリックします。 ファイル名にjs.txtと入力して、「OK」をクリックします。

2. js.txtファイルに、次のテキストを追加します。

   #base=.
   js.txt
   

3. 「すべて保存」をクリックして、js.txt ファイルを閉じます。

4. テストノード（ここでは​afTestRegistration）​を右クリックし、作成/ファイルを作成​をクリックします。 ファイル名に「init.js」と入力して、「OK」をクリックします。

5. 次のコードをinit.jsファイルにコピーし、「すべて保存」をクリックします。

   (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.testForm = new hobs.TestSuite("Adaptive Form - Demo Test", {
           path: '/etc/clientlibs/afTestRegistration/init.js',
           register: true
       });
    // window.testsuites.testForm1 = new hobs.TestSuite("testForm1");
   }(window, window.hobs));
   

   上記のコードを使用すると、Adaptive Form - Demo Test という名前のテストスイートが作成されます。別の名前でテストスイートを作成するには、それに応じて名前を変更します。

6. 作成／ノードを作成​をクリックし、テストを行う各フォームの clientlib フォルダーの下にノードを作成します。この例では、testForm という名前のノードを使用して、testForm という名前のアダプティブフォームをテストします。次のプロパティを指定して「OK」をクリックします。

   • 名前：testForm（使用するフォーム名）
   • タイプ：cq:ClientLibraryFolder

7. 新たに追加作成されたノード（ここでは「testForm」）に対して、次のプロパティを追加し、アダプティブフォームをテストします。

   プロパティ	タイプ	値
   カテゴリ	String[]	granite.testing.hobbes.tests、granite.testing.hobbes.tests.testForm
   依存関係	文字列[]	granite.testing.calvin.tests

   メモ

   この例では、管理を改善するために、クライアントlib granite.testing.calvin.testsへの依存関係を使用しています。 また、必要に応じてクライアントライブラリカテゴリ「granite.testing.hobbes.tests.testForm」を追加して、このクライアントライブラリを再使用しています。

   

8. テストフォーム用に作成したフォルダー（ここでは testForm）を右クリックし、作成／ファイルを作成​を選択します。ファイルに scriptingTest.js と名前を付けて、次のコードをファイルに追加して「すべて保存」をクリックします。

   次のコードを使用して別のアダプティブフォームをテストするには、navigateTo（行 11、36、62）および個々のテストケースで、フォームのパスと名前を変更します。フォームやフォームオブジェクトの様々な要素をテストするAPIについて詳しくは、Calvin APIsを参照してください。

   (function(window, hobs) {
       'use strict';
   
    var ts = new hobs.TestSuite("Script Test", {
           path: '/etc/clientlibs/testForm/scriptingTest.js',
     register: false
    })
   
       .addTestCase(new hobs.TestCase("Checking execution of calculate script")
           // navigate to the testForm which is to be tested
           .navigateTo("/content/forms/af/testForm.html?wcmmode=disabled")
           // check if adaptive form is loaded
           .asserts.isTrue(function () {
               return calvin.isFormLoaded()
           })
           .execSyncFct(function () {
               // create a spy before checking for the expression
               calvin.spyOnExpression("panel1.textbox1");
               // setValue would trigger enter, set the value and exit from the field
               calvin.setValueInDOM("panel1.textbox", "5");
           })
           // if the calculate expression was setting "textbox1" value to "5", let's also check that
           .asserts.isTrue(function () {
               return calvin.isExpressionExecuted("panel1.textbox1", "Calculate");
           })
           .execSyncFct(function () {
               calvin.destroySpyOnExpression("panel1.textbox1");
           })
           .asserts.isTrue(function () {
               return calvin.model("panel1.textbox1").value == "5"
           })
       )
   
       .addTestCase(new hobs.TestCase("Calculate script Test")
           // navigate to the testForm which is to be tested
           .navigateTo("/content/forms/af/cal/demoform.html?wcmmode=disabled&dataRef=crx:///content/forms/af/cal/prefill.xml")
           // check if adaptive form is loaded
           .asserts.isTrue(function () {
               return calvin.isFormLoaded()
           })
   
           .execSyncFct(function () {
               // create a spy before checking for the expression
               calvin.spyOnExpression("panel2.panel1488218690733.downPayment");
               // setValue would trigger enter, set the value and exit from the field
               calvin.setValueInDOM("panel2.panel1488218690733.priceProperty", "1000000");
           })
           .asserts.isTrue(function () {
               return calvin.isExpressionExecuted("panel2.panel1488218690733.downPayment", "Calculate");
           })
           .execSyncFct(function () {
               calvin.destroySpyOnExpression("panel2.panel1488218690733.downPayment");
           })
           .asserts.isTrue(function () {
               // if the calculate expression was setting "downPayment" value to "10000", let's also check that
      return calvin.model("panel2.panel1488218690733.downPayment").value == 10000
           })
       )
   
       .addTestCase(new hobs.TestCase("Checking execution of Value commit script")
           // navigate to the testForm which is to be tested
           .navigateTo("/content/forms/af/cal/demoform.html?wcmmode=disabled&dataRef=crx:///content/forms/af/cal/prefill.xml")
           // check if adaptive form is loaded
           .asserts.isTrue(function () {
               return calvin.isFormLoaded()
           })
   
           .execSyncFct(function () {
               // create a spy before checking for the expression
               calvin.spyOnExpression("panel2.panel1488218690733.priceProperty");
               // setValue would trigger enter, set the value and exit from the field
               calvin.setValueInDOM("panel2.panel1488218690733.priceProperty", "100");
           })
           .asserts.isTrue(function () {
               return calvin.isExpressionExecuted("panel2.panel1488218690733.priceProperty", "Value Commit");
           })
           .execSyncFct(function () {
               calvin.destroySpyOnExpression("panel2.panel1488218690733.priceProperty");
           })
           .asserts.isTrue(function () {
            // if the value commit expression was setting "textbox1488215618594" value to "0", let's also check that
               return calvin.model("panel2.panel1488218690733.textbox1488215618594").value == 0
           })
       );
   
    // register the test suite with testForm
     window.testsuites.testForm.add(ts);
   
    }(window, window.hobs));
   

   テストケースが作成されます。Hobbes経由でアダプティブフォームをテストする場合は、テストケースの実行に進みます。 テストケースの実行手順については、自動テストを使用したUIのテストでのテストの実行を参照してください。

また、添付ファイル SampleTestPackage.zip に含まれるパッケージをインストールすれば、「例： Hobbes をテスト用フレームワークとして使用してアダプティブフォームのテストスイートを作成する」で説明した手順の結果と同じ結果を得ることができます。

ファイルを入手

自動テストを使用した UI 文字列のテスト

1 つのテストスイートの実行

テストスイートは個別に実行できます。1 つのテストスイートを実行すると、テストケースとそのアクションの実行に応じてページが変化し、テストの完了後に結果が表示されます。アイコンによって結果が示されます。

チェックマークアイコンは、成功したテストを示します。

「X」アイコンは、失敗したテストを示します。

1 つのテストスイートを実行するには：

1. テストパネルで、実行するテストケースの名前をクリックまたはタップして、アクションの詳細を展開します。

   

2. 「テストを実行」ボタンをクリックまたはタップします。

   

3. テストが実行されると、プレースホルダーはページコンテンツに置き換えられます。

   

4. 説明をタップまたはクリックして結果パネルを開いて、テストケースの結果を確認します。結果パネルでテストケースの名前をタップまたはクリックすると、すべての詳細が表示されます。

   

AEM アダプティブフォームのテスト手順は、AEM UI のテスト手順と同じです。アダプティブフォームのテストについて詳しくは、「UI のテスト」で以下のセクションを参照してください。

• テストスイートの表示
• 複数のテストの実行

用語集