最適化表單是客戶互動不可或缺的一部分。 請務必透過您在表單中所做的每項變更來測試您的調適性表單,例如推出新的修正套件或變更表單規則。 然而,功能測試的適應性表單及其中的每個領域可能都很麻煩。
Calvin可讓您在網頁瀏覽器中自動測試您的調適性表單。 Calvin利用Hobbes的使用者介面來執行測試,並提供下列工具:
使用Calvin,您就可以在CRXDE中建立測試案例,並直接在網頁瀏覽器中執行UI測試,以徹底測試您最適化表單的下列方面:
測試的自適應表單外觀 | 說明 |
最適化表單的預填體驗 |
|
提交最適化表單的體驗 |
|
運算式規則
|
|
驗證 |
|
延遲載入
|
|
UI互動 |
在使用本文章建立測試案例之前,您需要瞭解下列事項:
以下範例將逐步帶您建立測試套裝,以測試多個調適性表單。 您需要為每個需要測試的表單建立個別的測試案例。 依照類似下列步驟並在步驟11中修改JavaScript程式碼,您可以建立自己的測試套裝來測試您的自適應表單。
前往網頁瀏覽器中的CRXDE Lite:https://'[server]:[port]'/crx/de
。
按一下右鍵/etc/clientlibs子資料夾,然後按一下建立 > 建立節點。 輸入名稱(此處為afTestRegistration),將節點類型指定為cq:ClientLibraryFolder,然後按一下「確定」。
clientlibs資料夾包含應用程式的註冊方面(JS和Init)。 建議您在clientlibs資料夾中註冊所有Hobbes測試套裝物件,這些物件是特定於表單的。
在新建立的節點(此處為afTestRegistration)中指定下列屬性值,然後按一下「全部儲存」。 這些屬性可協助Hobbes將資料夾辨識為測試。 若要將此用戶端程式庫重複用於其他用戶端程式庫中,請將它命名為granite.testing.calvin.tests。
屬性 | 類型 | 值 |
類別 |
String[] |
granite.testing.hobbes.tests, granite.testing.calvin.tests |
依賴性 |
字串[] |
granite.testing.hobbes.testrunner, granite.testing.calvin, apps.testframework.all |
granite.testing.calvin.af clientlib包含所有最適化表單API。 這些API是Calvin命名空間的一部分。
按一下右鍵測試節點(此處afTestRegistration),然後按一下建立 > 建立檔案。 命名檔案js.txt,然後按一下「確定」。
在js.txt檔案中,新增下列文字:
#base=.
js.txt
按一下「全部儲存」,然後關閉js.txt檔案。
按一下右鍵測試節點(此處afTestRegistration) ,然後按一下建立 > 建立檔案。 為檔案命名init.js,然後按一下「確定」。
將下列程式碼複製至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的測試套裝。 若要建立不同名稱的測試套裝,請依此變更名稱。
按一下建立 > 建立節點以在要測試的每個表單的clientlib資料夾下建立一個節點。 此示例使用名為testForm的節點來測試名為testForm的自適應表單。 指定下列屬性,然後按一下OK:
將下列屬性新增至新建立的節點(此處為testForm),以測試最適化表單:
屬性 | 類型 | 值 |
---|---|---|
類別 | String[] | granite.testing.hobbes.tests、granite.testing.hobbes.tests.testForm |
依賴性 | 字串[] | granite.testing.calvin.tests |
此範例使用對用戶端lib granite.testing.calvin.tests的依賴,以提供更佳的管理。 此範例也新增用戶端程式庫類別"granite.testing.hobbes.testForm",以視需要重複使用此用戶端程式庫。
按一下右鍵為測試表單建立的資料夾(此處為testForm),然後選擇建立 > 建立檔案。 將檔案命名為scriptingTest.js,並將下列程式碼新增至檔案,然後按一下「全部儲存」。
若要使用下列程式碼來測試另一個最適化表單,請變更navigateTo(行11、36和62)中表單的路徑和名稱,以及個別的測試案例。 如需測試表單和表單物件不同方面的API的詳細資訊,請參閱Calvin API。
(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做為測試架構,為最適化表單建立測試套件。
測試套裝可個別執行。 當您執行測試套裝時,頁面會隨著測試案例及其動作的執行而變更,結果會在測試完成後顯示。 圖示表示結果。
複選標籤圖示表示通過的測試:
「X」圖示表示測試失敗:
若要執行測試套裝:
在「測試」面板中,按一下或點選您要執行的測試案例名稱,以展開動作的詳細資訊。
按一下或點選「執行測試」按鈕。
測試執行時,預留位置會以頁面內容取代。
點選或按一下說明以開啟「結果」面板,以檢視「測試案例」的結果。 點選或按一下「結果」面板中測試案例的名稱,會顯示所有詳細資料。
測試AEM最適化表單的步驟與測試AEM UI的步驟類似。 如需測試最適化表單的詳細資訊,請參閱測試您的UI中的下列主題:
詞彙 | 說明 |
測試套件 |
測試套裝是相關測試案例的集合。 |
測試案例 |
測試案例代表使用者使用您的UI所執行的工作。 將測試案例新增至您的測試套裝,以測試使用者執行的活動。 |
動作 |
動作是在UI中執行手勢的方法,例如按一下按鈕或以值填入輸入方塊。 chout.actions.Wanfies、tower.actions.Core和tower.utils.af類的方法是可在測試中使用的動作。 所有動作都會同步執行。 |
製作或發佈環境 |
一般而言,表單可在作者或發佈環境中進行測試。 在發佈環境中,預設會限制執行測試的存取權。 這是因為與測試運行程式相關的所有客戶端庫都位於JCR結構的/libs內。 |