Jest 不包括裝飾器 function

Question

我想用笑話來覆蓋以下代碼：

    @Debounce(100)
    private checkDataToPositionInStep(): void {
        
        const proposalConsultData = this.proposalConsultResponseStore.get();

        if(proposalConsultData?.documentProposalData?.length > 1) {
            this.fullScreenLoaderService.hideLoader();
            this.router.navigate(['proposta-enviada']);
            return;
        }

        if(proposalConsultData?.warrantyData?.plateUf) {
            this.fullScreenLoaderService.hideLoader();
            this.router.navigate(['upload']);
        }

        if(proposalConsultData?.bankData?.branchCode) {
            this.fullScreenLoaderService.hideLoader();
            this.scrollService.next(STEP_ACCORDION.DADOS_GARANTIA.STEP);
            this.stepperService.next(STEP_ACCORDION.DADOS_GARANTIA.ID);
            return;
        }
        
        this.fullScreenLoaderService.hideLoader();
        this.scrollService.next(STEP_ACCORDION.DADOS_BANCARIOS.STEP);
        this.stepperService.next(STEP_ACCORDION.DADOS_BANCARIOS.ID);
        return;
    }

而de debounce裝飾器是這樣的：

export function Debounce(timeout: number): Function {
    return function (target, propertyKey: string, descriptor: PropertyDescriptor) {
        const original = descriptor.value;
        descriptor.value = function debounce(...args) {
            setTimeout(() => {
                original.apply(this, args);
            }, timeout);
        }
        return descriptor;
    }
}

當我運行npm run:coverage時，裝飾器下面的所有行都沒有被覆蓋。 反正有沒有覆蓋這條線？

我只是嘗試像這樣調用 checkDataToPositionStep 方法：

it('Should call checkDataToPositionInStep with only bankData', () => {ons
    const = proposalConsultMock = <any> {
      bankData: {
        branchCode: '01901'
      }
    };
    (facade as any).checkDataToPositionInStep(proposalConsultMock );
  });

我認為開玩笑應該涵蓋 checkDataToPositionStep 方法。

Answer 1

首先：您是否錯過了expect(...)電話？ 如

    expect(
      (facade as any).checkDataToPositionInStep(proposalConsultMock)
    ).not.toThrowError();

其次：裝飾器應該與你的主要組件分開測試。 這樣您就可以在另一個測試文件中測試checkDataToPositionInStep function 以及從Debounce返回的 function：

it('should do something', () => {
    // Create your instance
    const debounceFunction = Debounce(60);

    // Execute your function
    const result = debounceFunction(params...);

    // Expect a correct result
    expect(result).toBe(something);
  });

您可能還想檢查您的測試文件是否正確包含在覆蓋率配置中。

最后，我不同意@facundo 關於不關心測試覆蓋率的建議。 這取決於上下文，出於代碼質量的原因，您可能希望確保一定比例的代碼經過良好測試，同時避免軟件回歸。

Answer 2

感謝您的幫助，我找到了使用jest.useFakeTimers()和jest.runAllTimers(); . 問題出在 setTimeout 上。 下面的代碼現在覆蓋了 checkDataToPositionInStep 方法。

 proposalConsultMock = <any> {
  documentProposalData: [{
    tpDocumentoProposta: 149
},{
    tpDocumentoProposta: 90
  }],
};

jest.useFakeTimers();
setTimeout(() => {
  (facade as any).checkDataToPositionInStep(proposalConsultMock);
}, 1000);
jest.runAllTimers();

Answer 3

只是一個建議......理想情況下你不應該關心覆蓋范圍本身，你想確保事情得到測試。 考慮到這一點，如果您想確保 Debounce 裝飾器經過測試，您可以專門為其創建一組單元測試。

更新

我只是想澄清一下，當我說“你不應該關心覆蓋率本身”時，我並不是說你不應該關心代碼覆蓋率，這是一個非常重要的指標，需要密切關注。 但覆蓋范圍並不總是意味着您正在測試所有內容。 請小心點。

import { Debounce } from './Debouncefile';

describe('Debounce', () => {
  it('should do something', () => {
    // Arrange
    const debounceFunction = Debounce(60);

    // Act
    const result = debounceFunction(params...);

    // Assert
    expect(result).toBe(something);
  });
});