如何创建在Ember集成测试中使用的虚拟组件?

时间:2018-11-15 21:53:00

标签: testing ember.js integration-testing

我有一个组件some-container,它接受​​映射到其他余烬组件的ID的哈希。这是它的用法:

{{modules/some-container
  pageKey="foo"
  widgetIdToComponent=(hash
    foo=(component "modules/dummy-component")
  )
}}

我正在为此组件编写集成测试,并且希望保持该测试独立于其他组件。有没有办法在Ember集成测试文件中定义虚拟组件?

1 个答案:

答案 0 :(得分:1)

想通了!解决方案是使用this.register。见下文:

moduleForComponent('some-container', 'Integration | Component | some-container', {
  integration: true,

  beforeEach() {
    this.register(
      'component:foo-div',
      Component.extend({
        layout: hbs`<div data-test-foo />`
      })
    );

    this.register(
      'component:bar-div',
      Component.extend({
        layout: hbs`<div data-test-bar />`
      })
    );

    this.component = hbs`
    {{modules/some-container
      pageKey="foo"
      widgetIdToComponent=(hash
        fooId=(component "foo-div")
        barId=(component "bar-div")
      )
    }}`;
  }
});

test('it renders foo div when only foo div is returned', function(assert) {
  this.render(this.component);

  assert.dom('[data-test-foo]').exists('foo div renders');
  assert.dom('[data-test-bar]').doesNotExist('foo div renders');
});