在 Ember 组件的 Yielded 上下文中测试属性

Question

有时我正在处理需要产生数据传输对象 (DTO) 的组件，以分散关注点。例如，如果我有某种 UI 组件，我想在多个上下文中重复使用。我会将这个表示组件提取到非异步的东西中，留下一个包装器，在需要时处理异步调用。然后异步组件将产生调用的数据。一个示例用法是：

{{#call-ajax as |data|}}
  {{presentation-component title=data.title}}
{{/call-ajax}}

现在，对于测试，我不想在 call-ajax 组件的测试中使用 presentation-component，但我需要一些方法来断言 ajax 呼叫产生为 data.

我最初的想法是某种 component/helper 只对暴露 API 的测试可用，用于检查用法和调用它们的内容。也许在测试中有这样的东西：

this.render(hbs`
  {{#call-ajax as |data|}}
    {{test-inspector data}}
  {{/call-ajax}}
`);

不过，我不确定如何完成此操作。

关于如何测试 data 对象而不打印它的所有原始字段并进行 DOM 查找，是否有任何建议？

Answer 1

您可以通过在 Ember.js 中的集成测试的 this 上下文可用的注册表中注册一个助手，并将信息作为参数通过某种机制传递给它，以存储这些信息供以后检查.

我在下面的示例中使用了 sinon through ember-sinon，但如果需要，可以使用更普通的方式来完成：

const stub = sinon.stub();
const helper = Ember.Helper.helper(stub);
this.register('helper:test-inspector', helper);

this.render(hbs`
  {{#call-ajax as |data|}}
    {{test-inspector data}}
  {{/call-ajax}}
`);

assert.deepEqual(stub.getCall(0).args[0][0], expectedData);

在 Ember 组件的 Yielded 上下文中测试属性

Testing Properties on the Yielded Context of an Ember Component

integration-testing

ember.js