如何为模拟函数添加类型注释

Question

我在 test.tsx 文件中有两个名为 mockedUnload 和 mockedMiniApp 的模拟函数；

let mockedUnload;
let mockedMiniApp; 

beforeEach(() => { 
   mockedUnload = jest.fn(() => Promise.resolve()); 
   mockedMiniApp = jest.fn(() => Promise.resolve({unload: mockedUnload}));
};

很明显，mockedUnload和mockedMiniApp的类型是any。这可能不是一个好的做法，但我不知道应该为 mockedUnload 和 mockedMiniApp 分配什么类型注释。顺便说一句，由于某些原因，我必须将这两个函数包装到 beforeEach 中。谢谢

Answer 1

您可以使用 jest.MockedFunction 键入这两个模拟函数，它在版本 24.9.0.

的 @types/jest 模块中可用。

type Unload = () => Promise<void>;

let mockedUnload: jest.MockedFunction<Unload>;
let mockedMiniApp: jest.MockedFunction<() => Promise<{ unload: Unload }>>;

beforeEach(() => {
  mockedUnload = jest.fn(() => Promise.resolve());
  mockedMiniApp = jest.fn(() => Promise.resolve({ unload: mockedUnload }));
});

类型定义：

 /**
     * Wrap a function with mock definitions
     *
     * @example
     *
     *  import { myFunction } from "./library";
     *  jest.mock("./library");
     *
     *  const mockMyFunction = myFunction as jest.MockedFunction<typeof myFunction>;
     *  expect(mockMyFunction.mock.calls[0][0]).toBe(42);
     */
    type MockedFunction<T extends (...args: any[]) => any> = MockInstance<ReturnType<T>, ArgsType<T>> & T;

更新: jest 版本 < 24.9.0

尝试：

type Unload = () => Promise<void>;

let mockedUnload: jest.Mock<ReturnType<Unload>>;
let mockedMiniApp: jest.Mock<Promise<{ unload: Unload }>>;

mockedUnload = jest.fn(() => Promise.resolve());
mockedMiniApp = jest.fn(() => Promise.resolve({ unload: mockedUnload }));

// or
let mockedUnload1: jest.MockInstance<ReturnType<Unload>>;
let mockedMiniApp1: jest.MockInstance<Promise<{ unload: Unload }>>;

mockedUnload = jest.fn(() => Promise.resolve());
mockedMiniApp = jest.fn(() => Promise.resolve({ unload: mockedUnload }));

如何为模拟函数添加类型注释

how to add type annotation for mock function

mocking

typescript

reactjs

jestjs