我应该如何测试这个角度组件？

Question

假设我有一个在单击时发出事件的组件，即

    @Component({

      selector: 'component-checkout-payment',

      template: `<button (click)="click()>Click me</button>`

    })

    export class TestComponent{

      @Output() clicked = new EventEmitter<boolean>();

      click() {

        this.clicked.emit(true);

      }

    }

然后我会像下面那样分别测试事件和组件方法吗？

it('should emit an event when `click` is called`, () => {

  jest.spyOn(component.clicked, 'emit');

  component.click();

  expect(component.clicked.emit).toHaveBeenCalledWith(true);

});

it('should call `click` when button has been clicked`, () => {

  jest.spyOn(component, 'click');

  let button = fixture.debugElement.nativeElement.querySelector('button');

  button.click();

  expect(component.click).toHaveBeenCalled();

})

或者我会测试当按钮被点击时，它又会发出一个事件吗？

it('should emit event when button has been clicked`, () => {

  jest.spyOn(component.clicked, 'emit');

  let button = fixture.debugElement.nativeElement.querySelector('button');

  button.click();

  expect(component.clicked.emit).toHaveBeenCalledWith(true)

})

我假设是后者，因为它将前两个测试合二为一。不过我想澄清一下。

我还想知道这些类型的测试是单元测试、集成测试还是 e2e 测试。

Answer 1

这两种方法都是有效的，这完全取决于您的喜好。这些是单元测试。它们可以防止您的应用程序产生副作用：如果测试失败，则意味着您的功能已被修改。这不是集成测试，因为您测试单个组件，也不是端到端测试，因为您没有一直通过后端。