Question

我尝试编写单元测试以确保在关闭模态时关闭属性。但是，我似乎遇到了动作处理方面的问题。我一直收到错误信息：
Error: <q12-reports@component:add-team-modal::ember294> had no action handler for: hideModal

这是modal.js组件：

stopSearch: function(modal) {
  modal.send('hideModal');

  this.setProperties({
    searchTerm: ''
  });
},

actions: {
  modalCancelled: function(modal) {
    this.stopSearch(modal);
  },
  etc...
}

正如您所看到的，我正在冒充hideModal行动。这是我尝试写的单元测试：

test('closing modal clears properties correctly', function(assert) {
  assert.expect(2);
  let component = this.subject();   
  let firstSearchTerm;

  Ember.run(function() {
    component.set('searchTerm', 'test');
    firstSearchTerm = component.get('searchTerm');
    assert.ok(firstSearchTerm, 'test', 'set term properly');
    component.send('modalClosed', component);
  });

  assert.ok(firstSearchTerm, '', 'clears term properly');
})

在人们提到this之前，我已在下面尝试过。

test('closing modal clears properties correctly', function(assert) {
  assert.expect(2);
  let component = this.subject();   

  let firstSearchTerm;
  let $component = this.append();

  let targetObject = {
    externalHideModal: function() {
      assert.ok(true, 'hide modal was called.');
      return true;
    }
  }

  component.set('hideModal', 'externalHideModal');
  component.set('targetObject', targetObject);

  Ember.run(function() {
    component.set('searchTerm', 'test');
    firstSearchTerm = component.get('searchTerm');
    component.send('modalCancelled', component);
  });

  assert.ok(firstSearchTerm, '', 'clears term properly');
})

集成测试尝试（不起作用）。最后一个断言仍然是＆＃39; test＆＃39;。

test('Closing modal clears properties of modal', function(assert) {
   assert.expect(1);
   this.render(hbs`{{modal}}`);

   //open modal
   this.$('.search').click();

   this.setProperties({
     searchTerm: 'test'
   });

   this.set('searchTerm', 'test');

   assert.equal(this.get('searchTerm'), 'test', 'sets properly');

   // cancel out of modal
   this.$('.modal-footer button').eq(1).click();

   let searchTerm = this.get('searchTerm');

   assert.equal(searchTerm, '', 'clears results properly');
});

Answer 1

如果要声明组件发送了事件，可以向集成测试上下文添加事件侦听器。这也应该停止抛出未处理的事件错误。

assert.expect(2);
...
this.on('hideModal', function() {
  assert.ok(true, 'hide modal event fired');
});

这对于ember单元测试来说有点困难，因此我建议在测试组件UI交互时使用集成测试。

Ember单元测试组件具有冒泡动作

1 个答案: