Question

我写了一个具有以下堆栈的实时js应用程序：

服务器的Node.js
Socket.io作为沟通层
JQuery在前端操纵dom等。

对于＃1，我完全没有问题测试。我目前正在使用nodeunit，这是一项非常出色的工作。

对于＃3，我在尝试找出测试方法时遇到了一些麻烦。

我的浏览器端代码通常是这样的：

var user = {
  // Rendered by html
  id: null, 
  roomId: null,
  foo: null, 

  // Set by node server. 
  socket: null,
  clientId: null,
  ... 
}

$('button#ready').click(function() { 
  socket.emit('READY'); 
});

socket.on('INIT', function(clientId, userIds, serverName) { 
  user.clientId = clientId;
  user.foo = (serverName == 'bar') ? 'bar' : 'baz'; 
});

我想测试的主要部分涉及检查浏览器端的js是否会在服务器触发具有指定参数的特定数据包时做出相应的反应：

即。 user.foo =（serverName =='bar'）？ 'bar'：'baz';

有关如何处理此问题的任何好建议？

Answer 1

结帐Mocha。它在节点和浏览器中都有很好的支持。我发现它比其他选择（Jasmine，Vows）更受欢迎。

此外，我没有运行像Selenium这样的重量级集成设置，而是使用Zombie在一个进程中运行服务器测试和浏览器测试。它允许一些漂亮的集成工作流程（比如在浏览器上触发某些内容，然后验证服务器上的效果）。

YMMV然而，Zombie依赖于JSDOM（Javascript中的DOM重新实现）。有修补/固定的粗糙边缘，东西断裂。如果这是一个问题，请在浏览器中使用真实浏览器运行Mocha（也许通过Selenium利用）。

Answer 2

尽管Pivotal对茉莉花的支持有点受欢迎（最小的新开发，很多未解决的问题/ github上的拉取请求），Jasmine是一个非常好的测试客户端代码的工具，主要是因为jasmine-jquery。

Jasmine的一般方法非常可靠，Jasmine-Jquery有很多用于测试DOM的优秀匹配器，以及优秀的DOM沙盒。

我发现在客户端进行测试是一项挑战，主要是因为我不得不在测试中不再那么严格和规范。

一般来说，你应该以一种“模糊”的方式接近客户端测试，测试DOM层次结构太具体是通往地狱的道路。测试类似于“页面是否包含这些单词”，div div＃my-div是否包含带有3个li的ul，其内容与此正则表达式相匹配“

后者是我开始做测试的方式，但我发现它非常耗费时间和脆弱;如果设计师（我）想要搞乱结构，它可能会不必要地打破许多测试。绕过它的唯一方法是为每个组件创建“小部件”，这将是理想的，但正如我所说，非常耗时，它实际上成了我办公室的一个笑话：“你本周做了多少次测试？ 2？3？哇3次测试。干得好。“

总之...

通过松散地测试，并专注于重要的事情，例如工作流和数据“存在”在页面层次结构中特定位置的特定内容，您可以获得90％的客户端测试优势。< / p>

编辑：此外，确保您将业务逻辑分解为独立于DOM的单元，尽可能多的人。这使您的生活变得更加轻松，并且通常会带来更好的架构，这是一个优势。

编辑2：您可能想要了解Rails世界如何使用Capybara / Cucumber或Selenium进行此操作。

在客户端测试Javascript

2 个答案: