ReferenceError: 初始化前无法访问“mockMethod1”

Question

我有 3 个源文件 File1.ts、File2.ts、File3.ts。在执行 File3 的单元测试时，我收到以下错误。

Test suite failed to run

    ReferenceError: Cannot access 'mockMethod1' before initialization

      20 |     __esModule: true,
      21 |     default: jest.fn(),
    > 22 |     method1: mockMethod1,
         |              ^
      23 |     method2: mockMethod2
      24 | }));
      25 | 

以下是 File3 的 3 个源文件和单元测试的内容。

文件1.ts

export default class File1 {
    public element;

    constructor(element) {
        this.element = element;
    }

     method1(inputs) {
         // Logic of Method1.
         return output;
     }

     method2(inputs) {
         // Logic of Method2.
         return output;
     }
}

文件2.ts

import File1 from '../Folder1/File1'

export default class File2 {
    public file1Object;

    constructor(element) {
        this.file1Object = new File1(element);
    }

     method1(inputs) {
         // Logic of Method1.
         let out = this.file1Object.method1(inputs);
         // Logic of Method1.
         return output;
     }

     method2(inputs) {
         // Logic of Method2.
         let out = this.file1Object.method2(inputs);
         // Logic of Method2.
         return output;
     }
}

文件3.ts

import File2 from '../Folder2/File2'
export default class File3 {
    public file2Object;

    constructor(element) {
        this.file2Object = new File2(element);
    }

     method1(inputs) {
         // Logic of Method1.
         let out = this.file2Object.method1(inputs);
         // Logic of Method1.
         return output;
     }

     method2(inputs) {
         // Logic of Method2.
         let out = this.file2Object.method1(inputs);
         // Logic of Method2.
         return output;
     }
}

文件3.test.ts

import File3 from "./File3";
import File2 from "../Folder2/File2";

const mockMethod1 = jest.fn();
const mockMethod2 = jest.fn();

jest.mock('../Folder2/File2', () => ({
    __esModule: true,
    default: jest.fn(),
    method1: mockMethod1,
    method2: mockMethod2
}));

const file3Object = new File3(inputElement);
beforeEach(() => {
    jest.clearAllMocks();
});

test('Method-1 Unit Test', () => {
    mockMethod1.mockReturnValue(expectedOutput);
    let observedOutput = file3Object.method1(inputs);

    expect(observedOutput).toBe(expectedOutput);
})

test('Method-2 Unit Test', () => {
     mockMethod2.mockReturnValue(expectedOutput);
    let observedOutput = file3Object.method2(inputs);
     
     expect(observedOutput).toBe(expectedOutput);
})

我不确定我在哪里犯了错误，所以我无法解决这个错误。任何解决此问题的建议。

Answer 1

有几件事会造成麻烦。首先，正如jest docs 中提到的：

factory 参数的一个限制是，因为对 jest.mock() 的调用被提升到文件的顶部，所以不可能先定义一个变量然后在工厂中使用它。以单词“mock”开头的变量是一个例外。由您来保证它们会按时初始化！

这意味着您需要移动代码行以使它们看起来像这样：

  // First the mock functions
  const mockMethod1 = jest.fn();
  const mockMethod2 = jest.fn();
  
  // Only then your imports & jest.mock calls
  import File3 from "./File3";
  import File2 from "../Folder2/File2";

  jest.mock('../Folder2/File2', () => ({
    // ...
  }));

第二个问题是，你是嘲讽File2，如果它是出口method1和method2，你是不是嘲讽method1和method2对的File2类！在 jest docs 中查看4 种模拟 ES6 类的方法。