问题标签 [react-hooks-testing-library]

我尝试使用 react-hooks-testing-library，但似乎没有处理使用 useContext 的钩子。

我正在尝试测试一个使用 axios 获取一些数据的简单钩子。然而，测试抛出了一个 TypeError：“无法读取未定义的属性 'fetchCompanies'”。这是我的自定义钩子（完整的 repo 在这里）：

这是我的测试：

请帮助我了解在这种情况下如何使用 react-hooks-testing-library。

编辑

这似乎与看似已解决的 Jest 问题有关。请参阅https://github.com/facebook/jest/pull/3209。

我有一个钩子useEffect。我注意到它useEffect没有运行超过两次，因为在rerender使用不同数据进行一次调用后，后续调用不会获得更新的数据。

我的测试发生了这种情况

我不明白为什么用不同的值重新渲染会在第一次更新 renderHook 中的道具，但不是随后的时间。

注意 我已经更新了标题和问题的措辞，以便在更多调试后更好地反映问题

更新 我过度简化了我的例子。我最初在这篇文章中只传递了一个参数，但问题是当我传递多个参数时

我正在尝试测试以下场景：

• 具有过期令牌的用户尝试访问他未授权的资源
• 资源返回 401 错误
• 应用程序将全局状态“isExpiredSession”更新为 true

为此，我有 2 个提供者：

• 身份验证提供者，具有全局身份验证状态
• 负责获取资源的人

两者都有自定义钩子，公开这些组件的共享逻辑，即：fetchResource/expireSesssion

当获取的资源返回 401 状态时，它通过共享 setState 方法在身份验证提供程序中设置 isExpiredSession 值。

AuthenticationContext.js 从'react'导入反应，{ createContext，useState}；

useAuthentication.js

ResourceContext.js 类似于鉴权，暴露一个Provider

useResource.js 有这样的东西：

然后，在我的测试中，使用 react-hooks-testing-library 我执行以下操作：

我尝试了一些解决方案：

• 然而，在测试中也渲染了useAuthentication，资源所做的更改似乎并没有反映在它上面。
• 通过 Resource 挂钩暴露 isExpiredSession 变量，即：

我期待到那时这条线会起作用：

expect(result.current.isExpiredSession).toBeTruthy();

但仍然不工作，价值仍然是假的

知道如何解决这个问题吗？

我在设置单元测试以确定使用正确参数调用函数时遇到问题。useAHook返回foo调用函数的函数bar。代码看起来像这样

我正在尝试使用renderHookand对这段代码进行单元测试jest.spyOn。我想确认调用函数foo会导致bar使用正确的参数被调用。我的单元测试看起来像这样

结果是测试失败，说spy永远不会被调用。我在这里做错了什么还是错误地使用了任何一个工具？

编辑：我找到了一个解决方案，来自 Kent C. Dodds的这段视频。

只需将 jest.advanceTimersByTime 调用包装在一个 act 函数中。

所以这：

变成：

我已经实现了一个简单的自定义钩子，以消除值更新的抖动。

这是代码：

这个钩子的客户端是这样的（非常简化）：

所以，我试图用下面的代码测试钩子：

虽然，测试通过，但我收到以下警告：

我知道，如果我要调用一个函数来更新钩子的内部状态（例如 useCounter 钩子的 increment()），我必须按照文档的指示在act函数中执行此操作。

但是，我实现的 useDebounce 钩子通过内部 useEffect 更改状态，该 useEffect 在值或延迟更改时运行。

我怎样才能摆脱这个警告？我的代码有问题吗？我是否忘记在测试代码中添加一些内容？

请帮忙！

试图模拟对 API 的 GET 请求，但总是得到

超时 - 在 jest.setTimeout 指定的 10000 毫秒超时内未调用异步回调。

即使我增加了超时，它仍然会引发错误。

钩

Axios 模拟

测试

我无法通过以下测试：

它一直失败：

我在代码沙箱中创建了一个复制案例：

https://codesandbox.io/embed/priceless-browser-94ec2

目前我正在使用带有反应钩子的功能组件。但我无法useState完全测试钩子。考虑这样一个场景，在useEffect钩子中我正在做一个 API 调用并在useState. 对于 jest/enzyme，我已经模拟了要测试的数据，但我无法useState在 jest 中设置初始状态值。

const [state, setState] = useState([]);

我想将初始状态设置为开玩笑的对象数组。我找不到任何类似于类组件的 setState 函数。

我有以下钩子：

使用组件时，我有无限循环的预期行为：

从 console.log ：

但是，对此进行测试@testing-library/react-hooks仅给出第一个循环输出：

想知道如何正确测试钩子，而不调用rerender和模仿与 React 相同的行为——在状态更改时重新渲染组件。