自动测试自适应表单

概述

自适应表单是客户交互的必备组件。 测试自适应表单时务必要进行每项更改,例如推出新的修补程序包或更改表单中的规则。 但是,功能测试自适应表单及其中的每个字段可能很繁琐。

Calvin允许您在Web浏览器中自动测试自适应表单。 Calvin利用Hobbes的用户界面来运行测试,并提供以下工具:

  • 用于创建测试的JavaScript API。
  • 用于运行测试的用户界面。

使用Calvin,您可以在CRXDE中创建测试用例,并直接在Web浏览器中运行UI测试,以彻底测试自适应表单的以下方面:

要测试的自适应表单方面 描述
自适应表单的预填体验
  • 表单是否会根据数据模型类型按预期预填充?
  • 表单对象的默认值是否按预期预填充?
提交自适应表单的体验
  • 提交时生成的数据是否正确?
  • 在提交期间表单是否在服务器上重新验证?
  • 是否为正在执行的表单配置了提交操作?

表达式规则

  • 与表单对象(如计算、可见)关联的表达式在退出字段后执行脚本,在执行相关UI操作后执行这些表达式吗?
验证
  • 执行操作后,字段验证是否会按预期执行?

延迟加载

  • 单击选项卡(或面板的任何导航项)后,是否会根据延迟加载配置从服务器获取HTML?

UI交互

前提条件

在使用本文创建测试用例之前,您需要了解以下信息:

示例:使用霍布斯作为测试框架为自适应表单创建测试套件

以下示例将指导您创建一个测试套件,用于测试多个自适应表单。 您需要为每个需要测试的表单创建单独的测试案例。 通过执行与以下步骤类似的步骤并在步骤11中修改JavaScript代码,您可以创建自己的测试包来测试自适应表单。

  1. 在Web浏览器中转到CRXDE Lite:https://[server]:[port]/crx/de

  2. 右键单击/etc/clientlibs子文件夹,然后单击​创建>创建节点。 输入名称(此处为afTestRegistration),将节点类型指定为cq:ClientLibraryFolder,然后单击​确定

    clientlibs文件夹包含应用程序(JS和Init)的注册方面。 建议您在clientlibs文件夹中注册所有特定于表单的霍布斯测试套件对象。

  3. 在新创建的节点(此处为afTestRegistration)中指定以下属性值,然后单击​Save All。 这些属性可帮助霍布斯将文件夹识别为测试文件。 要将此客户端库作为其他客户端库中的依赖项重复使用,请将其命名为granite.testing.calvin.tests。

属性 类型

类别

String[]

granite.testing.hobbes.tests, granite.testing.calvin.tests

依赖

String[]

granite.testing.hobbes.testrunner, granite.testing.calvin, apps.testframework.all

注意

granite.testing.calvin.af clientlib包含所有自适应表单API。 这些API是calvin命名空间的一部分。

1_aftestregistration

  1. 右键单击测试节点(此处为​afTestRegistration),然后单击​创建>创建文件。 将文件命名为js.txt,然后单击​确定

  2. 在js.txt文件中,添加以下文本:

    #base=.
    js.txt
    
  3. 单击​全部保存,然后关闭js.txt文件。

  4. 右键单击测试节点(此处为​afTestRegistration),然后单击​创建>创建文件。 将文件命名为init.js,然后单击​确定

  5. 将以下代码复制到init.js文件中,然后单击​Save All:

    (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));
    

    以上代码将创建一个名为​自适应表单 — 演示测试​的测试包。 要创建具有不同名称的测试包,请相应地更改名称。

  6. 单击​创建 > 创建节点​以在clientlib文件夹下为要测试的每个表单创建一个节点。 此示例使用名为​testForm​的节点来测试名为​testForm .的自适应表单。请指定以下属性并单击​OK:

    • 名称:testForm(您的表单名称)
    • 类型:cq:ClientLibraryFolder
  7. 将以下属性添加到新创建的节点(此处为testForm)以测试自适应表单:

    属性 类型
    类别 String[] granite.testing.hobbes.tests, granite.testing.hobbes.test.testForm
    依赖 字符串[] granite.testing.calvin.tests
    注意

    此示例使用对客户端lib granite.testing.calvin.tes的依赖关系来更好地管理。 此示例还添加了客户端库类别“granite.testing.hobbes.test.testForm”,以便在必要时重复使用此客户端库。

    2_testformproperties

  8. 右键单击为测试表单创建的文件夹(此处为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中安装包,以获得与示例中所述步骤相同的结果:使用霍布斯作为测试框架,为自适应表单创建测试套件。

获取文件

使用自动测试测试您的UI

运行单个测试包

测试包可以单独运行。 运行测试包时,页面会随测试用例及其操作的执行而发生更改,并且结果会在测试完成后显示。 图标指示结果。

复选标记图标表示通过的测试:复选标记

“X”图标表示测试失败:cross

要运行测试包,请执行以下操作:

  1. 在“测试”面板中,单击或点按要运行的测试案例名称,以展开操作的详细信息。

    1_tapnameoftestcase

  2. 单击或点按运行测试按钮。 runtestcase

    2_clickrun

  3. 测试执行时,占位符将替换为页面内容。

    3_pagecontent

  4. 通过点按或单击说明以打开“结果”面板,查看测试案例的结果。 点按或单击“结果”面板中的测试用例名称,可显示所有详细信息。

    4_reviewresults

测试AEM自适应表单的步骤与测试AEM UI的步骤类似。 有关测试自适应表单的更多信息,请参阅测试UI中的以下主题:

  • 查看测试包
  • 运行多个测试

术语表

术语 描述

测试套件

测试包是相关测试案例的集合。

测试用例

测试用例表示用户使用您的UI执行的任务。 将测试案例添加到测试包以测试用户执行的活动。

操作

操作是在UI中执行手势的方法,例如单击按钮或用值填充输入框。

thouk.actions.Wasifes、touke.actions.Core和toke.utils.af类的方法是可在测试中使用的操作。 所有操作都同步执行。

创作或发布环境

通常,可以在创作或发布环境中测试表单。 在发布环境中,默认情况下,执行测试的访问权限会受到限制。 这是因为与测试运行程序相关的所有客户端库都位于JCR结构的/libs内。

在此页面上