测试时如何从组件中获取属性？

Question

当组件没有模板时，如何检查组件的属性值？在应用程序中扩展组件并以这种方式提供模板。

//my-component.js
export default Ember.Component.extend({
    foo: 'bar'
});

//my-component-test.hbs
integration: true;
test('it renders', function(assert) {
  this.set('foo2', 'foo2');
  this.render(hbs`{{my-component foo=foo2}}`);
  assert.equal(/* ??? */, 'foo2');
});

我无法使用 this.render(hbs'{{#my-component foo=foo2}}{{foo}}{{/my-component}}'); 因为没有生成 foo。直接访问组件也是不可能的。

Answer 1

解决方案是改用单元测试。

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

moduleForComponent('forms/base-form', 'Unit | Component | forms/base-form field', {
  unit: true
});

test('it renders', function(assert) {
  const foo2 = 'foo2';
  const component = this.subject({foo: foo2});
  assert.equal(component.get('foo'), 'foo2');
});

Answer 2

在集成测试中，将组件想象成一个盒子。为其分配值并从该组件中检索 notifications/events。例如，将一个值绑定到一个组件并使用它（推送一个 button/enter 一个值等）然后检查该值。

同样在集成测试中，您可以使用 jquery 检查组件的渲染。如：

  assert.equal(this.$("td").length, 6);

在您的情况下，也许单元测试适合您。 Ember Unit Testing

测试时如何从组件中获取属性？

How to get property from component when testing?

ember.js

ember-testing