jest.mock() 内的 jest.fn() 返回未定义

2024-04-01

我有一个简单的“util”模块,带有默认导出和 2 个命名导出。

const foo = () => 'foo'
export default foo
    
export const bar = () => 'bar'
export const baz = () => 'baz'

在我的测试中,我是这样嘲笑它的:

jest.mock('./util', () => ({
  __esModule: true,
  default: jest.fn(() => 'mocked foo'),
  bar: jest.fn(() => 'mocked bar'),
  baz: jest.fn(() => 'mocked baz'),
}))

describe('util', () => {
  //...
})

在我的组件上,当我调用时foo(), bar() or baz(), 我收到了undefined。 但如果我删除一切正常jest.fn()像那样 :

jest.mock('./util', () => ({
  __esModule: true,
  default: () => 'mocked foo',
  bar: () => 'mocked bar',
  baz: () => 'mocked baz',
}))

我的示例与 jest doc 上的示例非常接近:https://jestjs.io/docs/mock-functions#mocking-partials https://jestjs.io/docs/mock-functions#mocking-partials

我在用着React(加拿大税务局)和打字稿

我知道模拟模块有不同的方法,但我很想了解我面临的问题。

知道我做错了什么吗? :) 谢谢 !


我遇到了同样的问题(也在运行 CRA),发现这可能是原因:

https://github.com/facebook/jest/issues/9131#issuecomment-668790615 https://github.com/facebook/jest/issues/9131#issuecomment-668790615

有点晚了,但我只是遇到了这个问题。我 发现有人添加了resetMocks: true to the jest.config.js文件。这意味着mock的实现 每次测试前都会重置功能。所以在我们的例子中,模拟 函数在测试运行时被包含在模拟模块中,但是 该模拟已被重置,因此它返回未定义。

关于原始问题构建环境,它看起来像 React-scripts 确实添加了resetMocks: true进入笑话配置。 (https://github.com/facebook/create-react-app/blob/main/packages/react-scripts/scripts/utils/createJestConfig.js#L69 https://github.com/facebook/create-react-app/blob/main/packages/react-scripts/scripts/utils/createJestConfig.js#L69) 但您可以在 package.json 的 jest 键上覆盖它。 (https://github.com/facebook/create-react-app/blob/main/packages/react-scripts/scripts/utils/createJestConfig.js#L74 https://github.com/facebook/create-react-app/blob/main/packages/react-scripts/scripts/utils/createJestConfig.js#L74)

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

jest.mock() 内的 jest.fn() 返回未定义 的相关文章

  • Googletest:如何异步运行测试?

    考虑到一个包含数千个测试的大型项目 其中一些测试需要几分钟才能完成 如果按顺序执行 整套测试需要一个多小时才能完成 通过并行执行测试可以减少测试时间 据我所知 没有办法直接从 googletest mock 做到这一点 就像 async选项
  • Typescript 函数接口重载

    我有以下代码 interface MySecondInterface a type A interface MyInterface val1 string val2 string MySecondInterface a
  • 如何在react-router-dom v6中的路由组件中添加道具

    正如标题所述 我曾经有一个带有状态组件的页面 该组件根据 url 的更改获取不同的 props 现在 升级到React Router v6 我真的不明白如何让它再次工作 我确实知道现在解决这个问题的唯一方法是使用诸如 useNavigate
  • 将迭代器结果键入元组

    有没有办法指定迭代器的类型 以便接收者知道迭代器生成一个元组 这样我就可以做这样的事情 class Vector2 components number number Symbol iterator yield this components
  • React-redux useDispatch() 未捕获类型错误

    我正在尝试创建一个简单的组件来使用 React Redux 钩子分派操作useDispatch 我收到一个错误 我已将组件修剪到发生错误的位置 当调用 useDispatch 函数时会发生这种情况 import useDispatch fr
  • Typescript:按值检查对象是否存在于数组中

    我有这个数据 roles roleId 69801 role ADMIN roleId 69806 role SUPER ADMIN roleId 69805 role RB roleId 69804 role PILOTE roleId
  • iOS 11 浏览器图像错误

    在 iOS 11 中滚动页面时出现以下错误 在 Firefox Safari 和 Chrome 中 在 Android 设备中 不会发生该错误 这些是背景图像 我不知道这是否是导致错误的原因 图 2 显示了图像在 Android 中的用途和
  • 访问 TypeScript 数组的最后一个元素

    TypeScript 中有访问数组最后一个元素的符号吗 在 Ruby 中我可以说 array 1 有类似的东西吗 您可以通过索引访问数组元素 数组中最后一个元素的索引将是数组的长度 1 因为索引是从零开始的 这应该有效 var items
  • Flux + React.js - 操作中的回调是好还是坏?

    让我解释一下我最近遇到的问题 我有 React js Flux 驱动的应用程序 有一个列表显示文章数量 注意 应用程序中有多个不同的列表 和文章详情查看在里面 但每个列表只有一个 API 端点 它返回文章数组 为了显示我需要的详细信息fin
  • 如何访问另一个 mobx 商店中的 mobx 商店?

    假设以下结构 stores RouterStore js UserStore js index js each of Store jsfiles 是一个 mobx 存储类 包含 observable and action index js只
  • 是否可以使用打字稿映射类型来创建接口的非函数属性类型?

    所以我正在研究 Typescript 的映射类型 是否可以创建一个接口来包装另一种类型 从而从原始类型中删除函数 例如 interface Person name string age number speak void type Data
  • 如何在 e2e AngularJS 测试中进行文件上传?

    在我的一种观点中 我有一个文件上传控件 它支持通过拖放或单击按钮后打开的标准文件对话框上传文件 How to do this in my e2e tests1 1 Just one of the two options will be en
  • 装饰器可以更改方法的签名吗?

    考虑一个函数 function handleFoo foo number 我想要一个解析 foo 的装饰器 例如 fetchFromApi foo function handleFoo foo number where fetchFromA
  • 在 JSPdf 中嵌入二进制文件

    我在用着JsPDF https www npmjs com package jspdf将 html 内容导出到下载的 PDF 考虑以下示例 该示例获取一些 HTML 内容并将其输出到下载的 PDF 文件 使用JsPdf import Rea
  • 禁用 chrome React DevTools 以进行生产

    我正在尝试使用 gulp 和 envify 对我的 React 应用程序进行浏览器化以设置 NODE ENV 因此 我可以删除反应警告 控制台中的错误报告 甚至我的代码来禁用某些功能 例如react addons perf的要求 而且效果很
  • 如何在react-router-dom@v6中使用私有路由

    我想要将私有路由与react router dom v6一起使用 当我尝试应用身份验证条件时 在 App js 中
  • “结构类型防护”与“if”配合使用,但不能用作数组过滤谓词

    我有一个联合类型 Pet在下面的示例中 组合了多个对象类型 每个对象类型都有一个type指示其类型的属性 有时我有一个联合类型的数组 Pet 并且需要 filter 它基于type财产 这本身工作得很好 但为了避免多余的类型声明 我想确保
  • TypeScript 提供(未指定)泛型类型作为泛型参数

    我希望提供一个泛型类型作为类型参数无需先将其解析为具体类型 换句话说 我正在寻找一种方法来指定从基类继承时可以使用的类型映射函数 示例 不正确的 语法希望比我能解释得更好 abstract class RunIt
  • 如何使用 jest 测试 Web 组件 (lit-element)

    有人有一个很好的设置来使用 jest jsdom 或类似工具测试自定义元素吗 我一直在使用 Puppeteer 和 Selenium 但它们使测试运行速度减慢太多 jsdom 的任何其他替代方案或修复程序可以使下面的测试运行吗 import
  • 带有 'as' 属性的通用 React TypeScript 组件(能够渲染任何有效的 dom 节点)

    我在下面的示例中按预期工作 我的问题是 无论如何我可以重写它 这样我就不必传递通用的T和as支柱 理想情况下我想通过asprop 并让组件的 prop 接口使用它 这在 TypeScript 中可能吗 export type Props l

随机推荐