Ember组件测试-当单元测试组件不调用外部动作时如何进行动作？

Question

我是Ember的新手，正在尝试测试寻呼机组件。 简化的组件如下所示：

export default Ember.Component.extend({
    index: 0,
    actions: {
        next() {
            this.incrementProperty('index');
        }
    }
});

我正在尝试测试next（）操作确实确实按预期增加了index属性。 我写了这样的单元测试：

test('next should increment the index by 1', function (assert) {
  const component = this.subject();

  assert.equal(component.get('index'), 0, 'Index should be 0');

  component.get('actions').next();
  assert.equal(component.get('index'), 1, 'index should be 1');
});

但是它失败，并显示错误“ this.incrementProperty不是函数”。 调试时，在next（）函数中，测试中的“ this”不是组件的上下文，它是一个以next（）为唯一属性的对象。

我想知道这是否是由于我在测试中调用nextPlace动作的原因。 我知道我可以编写一个集成测试，单击该按钮将触发该操作并比较一些UI以确保它已更改，但是当我要测试的只是功能本身按预期执行时，这似乎非常令人费解。 如果这是传递给该组件的操作（关闭操作），我知道我可以在集成测试中设置一个虚拟函数，将其传递给组件，然后查看其响应方式。 但是此动作不会调用传递给它的动作。

我意识到我正在测试的功能确实很基础，但这部分是为了了解如何在不调用外部（对组件）操作的组件中测试操作。

Answer 1

如果您不表达自己不编写集成测试的动机，那么我只建议您编写一个集成测试。 海事组织，你的理由是正确的。 对于启动您的案例的单元测试，我有3条建议。

首先：不起作用的原因是“ component.get('actions').next在没有任何上下文的情况component.get('actions').next获取对next函数的引用。因此，在该调用中this是无效的。要使其有效，只需绑定component如下图所示：

component.get('actions').next.bind(component)();

但是我不喜欢这样做，因为它是从上下文中提取next并再次绑定它。 我们正在执行此bind ，因为我们知道next函数在其代码中this有引用。

因此，我的第二个建议是“以某种方式触发事件”。 要触发它，请看以下代码：

component.send('next');

海事组织，这更好。 我们不需要知道“下一步做什么”。 我们只是触发一个事件。

但这是在处理余烬组件的生命周期。 我们接受这种情况：有一个称为actions的特定哈希，我们可以通过send触发它。 （这是完全可以的。）除了处理actions ，我们可以从action handling分离doing something action handling 。 因此，您可以定义另一个函数来执行所需的操作，只需从动作处理程序中调用它即可。 （好吧，在这种情况下，我们再次需要知道动作处理程序调用了什么函数。但这对我来说似乎更清楚。）如下所示：

next(){
  this.incrementProperty('index');
},
actions:{
  next(){
    this.next();
  }
}

您可以在这个旋转中看到所有三种选择。