确保在测试

Question

我有一个功能

handleCSV () {
  this.storeData$.take(1).subscribe(s => {
    const data = s.data
    const fields = ['reference', 'description', 'val1', 'val2', 'difference']
    const fieldNames = ['Reference', 'Description', 'Value 1', 'Value 2', 'Difference']
    const exportData = data.filter(dataset => dataset.visible)

    const csv = json2csv({ data: exportData, fields: fields, fieldNames: fieldNames })
    const csvEnc = encodeURIComponent(csv)
    const href = `data:application/octet-stream,${csvEnc}`

    this.csvDownloadLink.nativeElement.setAttribute('href', href)
    this.csvDownloadLink.nativeElement.click()

    this.csvDownloadLink.nativeElement.setAttribute('href', '')
  })
}

我几乎100％覆盖了这个函数，唯一缺少的是data.filter回调

有谁知道如何测试这个？使用的测试库是Jasmine，应用程序是使用Angular构建的。这是我目前的测试，它让我达到目前的覆盖水平（欢迎任何其他评论）：

it('should click the CSV link', () => {
  spyOn(comp.csvDownloadLink.nativeElement, 'click')

  comp.ngOnInit()
  comp.handleCSV()

  expect(comp.csvDownloadLink.nativeElement.click).toHaveBeenCalledTimes(1)
})

修改

好的，所以我发现问题的原因并不是没有调用data.filter回调，而是数据数组本身是空的！例如，通过始终确保数据数组中包含某些内容，将涵盖回调：

现在显然我不想在我的代码中使用这个if语句，所以我想我的问题变成了这个 - 为了测试的目的，我怎么能始终确保storeData $中有东西。现在这已经改变了问题的范围，现在它是一个ngrx测试问题。 ngOnInit（）函数触发异步填充storeData $的操作，但显然在测试中不会发生这种情况。那么如何激活ngOnInit（）函数，并确保reducer已经返回，并且当我调用handleCSV（）时将填充storeData $？

Answer 1

storeData$不“包含”数据。 storeData$将随着时间的推移而发出值，并且通过订阅它，您可以在这些值到达时对其进行处理。在您的情况下，您只能处理第一个到达的值（使用take(1)函数）。

处理每个新值的箭头函数会产生一定的逻辑。我认为您应该将此箭头函数提取到可以单独测试的命名函数。这样，您可以测试逻辑而不必担心storeData$。

handleCSV () {
  this.storeData$.take(1).subscribe(this.onNewStoreData);
}

onNewStoreData(s) {
    const data = s.data
    const fields = ['reference', 'description', 'val1', 'val2', 'difference']
    const fieldNames = ['Reference', 'Description', 'Value 1', 'Value 2', 'Difference']
    const exportData = data.filter(dataset => dataset.visible)

    const csv = json2csv({ data: exportData, fields: fields, fieldNames: fieldNames })
    const csvEnc = encodeURIComponent(csv)
    const href = `data:application/octet-stream,${csvEnc}`

    this.csvDownloadLink.nativeElement.setAttribute('href', href)
    this.csvDownloadLink.nativeElement.click()

    this.csvDownloadLink.nativeElement.setAttribute('href', '')
}