javascript - Ember 集成: Trigger click event on root element

Question

我正在编写一些 ember 集成测试，并且在测试组件上的所有内容时遇到了一些问题。例如，我有一个看起来像的组件

// my-component.js
export default Ember.Component.extend({
  click() {
    console.log('here');
  }
});

测试看起来像这样

// my-component-test.js
describeComponent(
  'my-component',
  'Integration: MyComponentComponent',
  {
    integration: true
  },
  function() {
    describe('interacting', function() {
      beforeEach(function() {
        this.render(hbs`
          {{my-component}}
        `);
      });

      it('registers the click', function() {
        this.$().click();
      });
    });
  }
);

在实际情况中，我显然想测试该组件在该单击时正在执行的操作，但不幸的是此触发器不起作用(未获取日志)。有人知道如何触发根元素上的点击事件吗？

Answer 1

在 Ember 组件集成测试中，this.$() 不会选择组件的元素。它选择组件渲染到的父元素。

因此，如果您使用以下方式渲染组件

this.render(hbs`{{my-component id="my-component}}`);

然后您可以单击组件的元素

this.$('#my-component').click();