reactjs - 监视从 3rd 方库挂钩返回的函数
问题描述
我无法弄清楚React 导航v5 中钩子navigate
返回的函数的热点。useNavigation
我有一个简单的Link
组件:
const Link = props => {
const { to, children, ...restProps } = props;
const navigation = useNavigation();
const handlePress = useCallback(() => navigation.navigate(to), [navigation, to]);
return (
<TouchableOpacity testID="link" onPress={handlePress}>
<Text
{...restProps}
>
{children}
</Text>
</TouchableOpacity>
);
};
和相应的测试:
jest.mock('@react-navigation/native', () => ({
...jest.requireActual('@react-navigation/native'),
useNavigation: () => ({
navigate: jest.fn(() => 'mocked navigate'),
}),
}));
import { useNavigation } from '@react-navigation/native';
const spy = jest.spyOn(useNavigation, 'navigate');
describe('<Link />', () => {
it('navigates', () => {
const link = render(<Link to="TestScreen">Test link</Link>);
fireEvent.press(link.getByTestId('link'));
expect(spy).toBeCalledTimes(1);
})
});
当然这不起作用,因为 inconst spy = jest.spyOn(useNavigation, 'navigate');
navigate
不是useNavigation
. 但是我尝试了无数其他的可能性,我就是不知道该怎么做。
基本上我要做的是验证当链接被按下时,它会调用带有预期参数的预期函数,并且我希望该函数被模拟出来。
解决方案
我知道我迟到了,但我遇到了同样的问题,想知道什么时候调用了导航功能。
为此,我以这种方式模拟了该函数,因此这mockedNavigate
将是一个我以后可以使用的笑话函数:
const mockedNavigate = jest.fn();
jest.mock('@react-navigation/native', () => {
return {
...jest.requireActual('@react-navigation/native'),
useNavigation: () => ({
navigate: mockedNavigate,
}),
};
});
这让我以后可以使用它,在这种情况下,您将不再需要监视,这应该可以解决问题:
expect(mockedNavigate).toHaveBeenCalledTimes(1);
推荐阅读
- r - 为什么 R bootstrap 函数使用索引来计算平均比率?
- java - 如何仅从依赖项 Maven 模块加载资源
- intellij-idea - IntelliJ 文件从搜索中排除,如何取消排除?
- .net - windows 多显示器系统,将 .net 屏幕映射到 DirectX 显示器 #
- f# - 如何从 Avalonia.FuncUI 中的事件中获取点击位置
- angular - 从角度应用程序访问角度库 - 角度组件中的 StaticInjectorError 与构造函数中的 ElementRef
- python - 将 ArgumentParser 移动到单独的文件中
- c++ - 如何在openGL中扭曲纹理?(透视校正?)
- c++ - typedef,或别名,或 std::chrono::duration_cast 的东西,以便于输入
- python - 超过了 runtime:python 的语言工作者重新启动重试次数。关闭功能主机