茉莉花的流星速度没有回归期待的结果？

Question

我正在尝试测试以下手动工作:

1. 将用户列表返回为<div>s
2. 单击按钮可将该计数减少<div>一个.

这似乎不起作用:

  it("should show one less person if you tap you liked them", function() {
    var personLength = $('.person').length;
    console.log(personLength); #> 7
    $("[data-action=like]").first().click();
    console.log($('.person').length); #> 7
    console.log(Likes.find().fetch()); #> 1
    expect($('.person').length).toEqual(person-1); #> Fail (expected 7 to equal 6)
  });

我很困惑为什么会这样做.手动测试时,我明显得到了预期的结果.

我想我错过了某种方法来重置该测试以再次查看DOM或其​​他东西？也许有些异步方法可以回调？我不确定,但似乎是一个简单的错误.

Answer 1

保持反应性得到控制

首先,您应该了解反应性和Meteor的工作原理.管理反应性的组件称为Tracker(以前称为Deps).您可以在" 流星手册"中阅读它的工作原理.

每次触发将导致反应行为的操作并且您想要测试反应行为的结果时,您应该Tracker.flush()在触发操作后调用.这将确保在评估您的期望之前应用所有被动更改.

什么时候Tracker.flush()需要通话？(不完整清单)？

• 用Blaze.render和渲染模板后Blaze.renderWithData
• 触发DOM事件后
• 更改集合中的数据后

如果您的期望失败并且您已手动验证测试行为是否有效,则可以尝试Tracker.flush在预期之前插入.

对于你的例子,这应该这样做:

beforeAll(function () {
  var self = this;

  self.deferAfterFlush = function (callback) {
    Tracker.afterFlush(function () {
      Meteor.defer(callback);
    });
  };
});

// Guarantee that tests don't run in a ongoing flush cycle.
beforeEach(function (done) {
  this.deferAfterFlush(done);
});

it("should show one less person if you tap you liked them", function() {
  var personLength = $('.person').length;
  console.log(personLength); #> 7
  $("[data-action=like]").first().click();
  Tracker.flush();
  console.log($('.person').length); #> 6
  console.log(Likes.find().fetch()); #> 1
  expect($('.person').length).toEqual(person-1); #> Pass (expected 6 to equal 6)
});