混合客户端/服务器端测试

Question

我应该如何构建包含Selenium代码(用于设置页面)和客户端Mocha代码(用于在被测试的客户端JS上实际执行测试)的测试？

我正在测试客户端javascript库.单元测试与Karma,Mocha和Grunt配合使用.单元测试可以在本地运行,也可以通过SauceLabs运行.单元测试基本上可以测试文件实际提交的部分.这部分需要浏览器自动化和/或手动交互,这正是我所挣扎的.

有问题的库是一个Javascript文件上传库.它具有分块,自动恢复等功能.它不需要jQuery,它适用于各种浏览器(IE7-10,FF,Safari(Mac和iOS),Chrome,Android股票浏览器).因此,这些测试中涉及很多案例和例外.

基本上,我需要使用Selenium来设置页面.由于我正在测试客户端JS文件上传库,我需要使用Selenium以编程方式提交文件,以便实际上传.一旦该文件已提交(从当您尝试上载一个或多个文件在网上出现的对话框窗口中选择一个文件的等价物),然后客户端测试可以运行,以确保UI已经正确绘制,文件中有被发现等

我试图围绕如何正确地测试它,以及如何设置我的测试套件以便将来可扩展,强大,简单/易于使用.

• 我是否应该使用Selenium注入JS代码以运行客户端？

  一个想法是在Selenium的适当时机注入客户端JS代码.这是我正在思考的一些伪代码:

describe("A Test", function () {

   it("injects some JS", function (done) {
        // Assume `getClientSideScript` loads some .js file from the filesystem,
        // reads its contents, and returns the contents as a string (to be executed).
        browser.safeExecute(getClientSideScript('initialize'), function (err, result) {
            // At this point, the client-side library is initialized on the page.

            // Assume that `uploadFile` will submit a file to the `<input type='file'>`
            // element
            utils.uploadFile('file.jpg', function (file) {

                browser.safeExecute(getClientSideScript('test_file_submission'), function (err, result) {
                    assert.ok(/* something about the result */);
                });

            });

        }); 
   });
});

对我来说,这会起作用,但看起来像是一个巨大的PITA.我必须提出一些存储和加载加载的客户端脚本的约定.另外,两个不同的测试将有两个不同的注入脚本,所以我们在我们的回购中有大量的一次性使用脚本.我也害怕走这条路,发现这是一个糟糕的决定或不可能.

有人对此有经验吗？

• 模拟服务器......我需要一个.

  我可以用Sinon.js做模拟服务器的客户端,或箭扣有一个单独的服务器端模拟服务器.该服务器是超级简单,但我相信我需要能够断言,从服务器的响应是预期中的客户端.

• 拦截客户端测试结果

  与上面类似,asserts当使用Selenium自动化浏览器时,我如何能够在客户端代码中进行拦截.例如,假设我想测试我的库和模拟服务器之间的请求 - 响应周期,我想验证如果我的库向服务器发送请求A,它将期望响应A. Selenium无法测试.我需要能够asserts捕获客户端并通过Selenium输出.

我一直在墙上试图找出最好的方法来做到这一点.如果有人有任何类似的经验,请,请进!

Answer 1

我根本不会混合这两种类型的测试。您在这里有几个不同的担忧。您仍然可以获得完整的测试覆盖率，而无需像您所描述的那样组合测试。

• 客户端单元测试（使用 Karma、Mocha 等）验证 JavaScript 代码的行为是否符合预期。
• 服务器端单元测试（使用 JUnit 或后端存在的任何单元测试框架）验证服务器代码是否按预期运行。
• 集成或端到端测试（使用 Selenium）通常可以验证多个组件是否正常协同工作。如果需要，您可以使用模拟后端。

您可以创建 Karma/Mocha 单元测试来验证该文件上传操作可能存在的任何处理的详细信息。在这里，您应该测试 UI 下各个 JavaScript 函数的边缘情况。

然后，您可以创建一个 Selenium 测试来纯粹测试上传操作和上传文件的预期结果。您可以验证页面上是否存在正确的元素，以及上传后是否具有预期的属性。在这种情况下，JavaScript 是一个黑匣子。您正在从用户的角度进行测试。这将练习您已经单元测试的一些代码，但其目的是测试前端和后端之间的连接。