Question

我无法通过yield块表达式将已编译的html输入到组件中。见测试：

import { moduleForComponent, test } from 'ember-qunit';

moduleForComponent('pro-tab-link', 'Unit | Component | pro tab link', {
  // Specify the other units that are required for this test
  // needs: ['component:foo', 'helper:bar'],
  unit: true
});

test('it renders', function(assert) {
  assert.expect(3);

  // Creates the component instance
  var component = this.subject({
    template: Ember.Handlebars.compile(
      "<h1>Hello world</h1>"
    )
  });

  console.log(component);
  assert.equal(component._state, 'preRender');

  var $component = this.append();

  Ember.run(function() {
   component.set('isOpen', true);
 });

  console.log(component);
  console.log($component.html());

  assert.equal(component._state, 'inDOM');
  assert.ok(component.isOpen);
});

模板：

if isOpen
  == yield

由于某种原因，h1标记未被传递到组件的yield。我该如何工作？

Answer 1

您应该根据主题上的fantastic article从单元测试组件切换到为它们编写集成测试。

你找不到h1的原因是这是一个单元测试（即，我们只测试component.js），我们应该期望在单元测试中不能访问DOM - 因此建议切换到集成测试，测试级别高于单位但低于验收测试。

通过这种方式，您将能够在DOM中测试组件及其与模板的交互。

具有良率的余烬测试组件

1 个答案: