javascript - TypeError:对不可迭代实例 React/Jest 的解构尝试无效
问题描述
我正在尝试使用 Jest 对我的 React 应用程序的一个功能组件进行 SnapShot 验证。这是使用 Jest 的组件和测试文件
import React, { useState } from 'react';
import useForm from 'react-hook-form';
import { useAppState } from 'Shared/store';
...
const Form = () => {
const {customReducer, dispatch} = useAppState();
const { register, handleSubmit, errors, reset } = useForm({});
//custom form methods
return (
<>
<Form ...>
...
</Form>
....
</>
);
export default Form;
和我使用 Jest 进行的测试
import React from 'react';
import TestRenderer from 'react-test-renderer';
import ShallowRenderer from 'react-test-renderer/shallow';
import Form from '../form';
describe('<Form />', () => {
test('Snapshot', () => {
const tree = TestRenderer.create(<Form />).toJSON();
expect(tree).toMatchSnapshot();
});
});
我遇到了错误 TypeError: Invalid attempt to destruction non-iterable instance
也尝试过 Enzyme,但得到了同样的错误。花很多时间参考其他相关问题,但无法弄清楚。谢谢你。
解决方案
有一个类似的问题,StorybookInvalid attempt to destruct non-iterable instance
使用钩子 (useContext) 在组件上抛出。
解决方案是使用默认值启动上下文,createContext([{}, function() {}])
推荐阅读
- javascript - 传递给 Vuex 动作函数时,数组不再是数组
- java - 无法显示从 OBD 扫描仪获取的数据
- javascript - 使用最新 antd 的 Typescript 编译错误
- angular - 无法使用角度访问 api
- angular - 使用加载器时,Openlayers 不会在图层中显示功能
- c - 从 linux 内核中的 bprm_check_security 获取 argv。文档有错吗?
- javascript - 如何使用 animxyz.css 在悬停时从右侧为淡入设置动画
- javascript - Onclick 事件问题
- python - 尝试检测网站 selenium 上是否显示错误时出错
- c# - 有没有办法通过代码从 OpenFileDialog 设置文件名?