EmberJS 测试:在组件内部测试组件
EmberJS testing: Testing a component inside a component
我是 Ember 的新手,我正在尝试学习如何编写测试。
目前我有一个组件,我们称它为“ParentComponent”,为了简化,它看起来像这样。
<div>
<div class="childDiv">
{{childComponent trait=someBoolean}}
</div>
<div>
other stuff
</div>
</div>
我正在 ParentComponent 上编写集成组件测试,我想进行测试以确保“trait”为真。 someBoolean 在 ParentComponent 内部确定,可以是 true 或 false。目前我的测试看起来像这样:
test('my test', async function(assert){
this.set('someBoolean', true)
await render(hbs`
{{parentComponent}}
`)
// insert code here
});
在“此处插入代码”处,我希望能够检查 childComponent 的“特征”是否确实等于 true。
Ember 的开箱即用测试套件不支持您尝试实现的目标。我认为这是有充分理由的。
Ember 的测试套件是围绕应该测试组件的 public API 的想法构建的。一个组件是否使用其他组件来提供它的功能应该被视为一个实现细节。它不是 public API 的一部分。它可能会通过重构组件实现随时更改而不影响 public API。因此也不应影响测试。
长话短说:您不应该测试 <ChildComponent />
是否使用正确的参数调用,而是 <ParentComponent />
是否呈现预期的标记。
我是 Ember 的新手,我正在尝试学习如何编写测试。
目前我有一个组件,我们称它为“ParentComponent”,为了简化,它看起来像这样。
<div>
<div class="childDiv">
{{childComponent trait=someBoolean}}
</div>
<div>
other stuff
</div>
</div>
我正在 ParentComponent 上编写集成组件测试,我想进行测试以确保“trait”为真。 someBoolean 在 ParentComponent 内部确定,可以是 true 或 false。目前我的测试看起来像这样:
test('my test', async function(assert){
this.set('someBoolean', true)
await render(hbs`
{{parentComponent}}
`)
// insert code here
});
在“此处插入代码”处,我希望能够检查 childComponent 的“特征”是否确实等于 true。
Ember 的开箱即用测试套件不支持您尝试实现的目标。我认为这是有充分理由的。
Ember 的测试套件是围绕应该测试组件的 public API 的想法构建的。一个组件是否使用其他组件来提供它的功能应该被视为一个实现细节。它不是 public API 的一部分。它可能会通过重构组件实现随时更改而不影响 public API。因此也不应影响测试。
长话短说:您不应该测试 <ChildComponent />
是否使用正确的参数调用,而是 <ParentComponent />
是否呈现预期的标记。