导入前对mock脚本标记进行Jest操作



我知道直接从组件中获取文档元素不是一个好主意,无论如何,例如,我有像一样导入的SomeComponent jsx文件

import SomeComponent from '../components/SomeComponent';
export default MyComponent = () => {
return (
SomeComponent.test ? "Hey" : "not Hey"
)
}

在我拥有的组件内部,元素是一个带有一些内容的脚本

const el = document.getElementById('element');
const json = el && el.innerText;
const info = json && JSON.parse(json);
export default test = info.someKey

MyComponent的单元测试类似于

describe('Tests for MyComponent', () => {
it('should render without any problem', () => {
wrapper = shallow(<MyComponent />);
expect(wrapper).toExist();
});
});

失败,类型错误:无法读取null的属性"someKey">

如何使用innerText模拟SomeComponent脚本标记

当我在setupTests.js文件上模拟它时,它就工作了

const el = document.createElement('script');
el.setAttribute('id', 'el');
el.innerText = mock;
document.head.append(el);

最新更新