你如何模拟 useDebounce ？

Question

所有模拟尝试都会产生错误：

import useDebounce from 'use-debounce'
jest.mock('use-debounce')

TypeError: (0 , _useDebounce.useDebounce) is not a function or its return value is not iterable

尝试仅针对该模拟也失败：

jest.mock('use-debounce',() => {
  return {
    useDebounce: jest.fn(value => [value])
  }
})

也给出了同样的错误。使用模拟计时器也不起作用。

Answer 1

编辑：这是因为你混淆了导入。根据 npm，它确实被用作命名导入

\n

import { useDebounce } from \'use-debounce\';\n

\n

所以，只要你像 \xe2\x98\x9d\xef\xb8\x8f 这样导入它，那么你就可以按照你说的方式模拟它：

\n

jest.mock(\'use-debounce\',() => {\n  return {\n    useDebounce: jest.fn(value => [value])\n  }\n})\n

\n

更喜欢假定时器

\n

请记住，我强烈鼓励使用模拟计时器的替代方法是使用假计时器。

\n

import { ComponentThatUsesUseDebounce } from \'./something\';\n\n\njest.useFakeTimers(); // <- must appear in your test file\n\n\ndescribe(\'...\',() => {\n\n  it(\'should call a debounce function\',() => {\n     const thing = render(<ComponentThatUsesUseDebounce/>);\n     fireEvent.click(thing.something);\n     jest.runAllTimers(); // or runOnlyPendingTimers() or advanceTimersByTime(n)\n\n     expect(something).toHaveBeenCalled();\n  });\n\n});\n\n

\n

原答案

\n

useDebounce不是命名导出，而是default：

\n

模拟 esmodules

\n

jest.mock(\'use-debounce\',() => {\n  return {\n    __esModule: true,\n    default: jest.fn(value => [value])\n  }\n})\n

\n