我怎样才能让我的 Angular5 spyOn 按预期工作？

Question

我的测试没有检测到变化。这是我的组件：

  toggleUploadModal() {
    const modalRef = this.ngbModal.open(UploadFilesComponent, { size: 'lg', backdrop: 'static' });
    modalRef.componentInstance.DeliverableTransaction = this.transactionDetails;
    modalRef.result.then((res) => {
      if (res.status === 'success') {
        this.deliverableTransactionService.updateDeliverableTransaction(this.route.snapshot.params.id, {
          submissionStatus: 'In Process'
        })
      }
      setTimeout(() => {
        this.uploadStatus = {};
      }, 5000);
    })
  }

我的测试有：

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [TransactionFileViewer, NgxPermissionsAllowStubDirective],
      providers: [...],
      imports: [...],
      schemas: [
        NO_ERRORS_SCHEMA, CUSTOM_ELEMENTS_SCHEMA
      ],
    })
      .compileComponents();
    fixture = TestBed.createComponent(TransactionFileViewer);
    downloadService = TestBed.get(DownloadService);
    component = fixture.componentInstance;
    fixture.detectChanges();
    submissionFileService = TestBed.get(SubmissionFileService);
    deliverableDefinitionService = TestBed.get(DeliverableDefinitionService);
    service = TestBed.get(DeliverableDefinitionDetailViewService);
    deliverableTransactionService = TestBed.get(DeliverableTransactionService);
    modalService = TestBed.get(NgbModal);
    flashMessagesService = TestBed.get(FlashMessagesService);
  }));
  fit('should update the submissionStatus upon file upload', () => {
    spyOn(modalService, 'open').and.returnValue({
      componentInstance: {},
      result: Promise.resolve({
        uploadedFileCount: 5,
        status: 'success'
      })
    });
    spyOn(deliverableTransactionService, 'updateDeliverableTransaction').and.returnValue(true);

    component.toggleUploadModal();
    expect(deliverableTransactionService.updateDeliverableTransaction).toHaveBeenCalledWith(1, {
      submissionStatus: 'In Process'
    });
  })

但是，updateDeliverableTransaction 从未在测试中被调用。我究竟做错了什么？我假设我需要以某种方式将范围绑定到 result，但我不确定如何绑定。如果重要的话，我正在使用 bluebird。

Answer 1

updateDeliverableTransaction 方法不会调用，因为它在模态的成功回调中。您需要在方法调用后添加 fixture.detectChanges()。

试试这个

fit('should update the submissionStatus upon file upload', () => {
    spyOn(modalService, 'open').and.returnValue({
      componentInstance: {},
      result: Promise.resolve({
        uploadedFileCount: 5,
        status: 'success'
      })
    });
    spyOn(deliverableTransactionService, 'updateDeliverableTransaction').and.returnValue(true);

    component.toggleUploadModal();
    fixture.detectChanges();
    expect(deliverableTransactionService.updateDeliverableTransaction).toHaveBeenCalledWith(1, {
      submissionStatus: 'In Process'
    });
  })

我怎样才能让我的 Angular5 spyOn 按预期工作？

How can I get my Angular5 spyOn to work as expected?

angular

angular5

bluebird

stub

spy