我正在使用 Mapbox、material-ui 和自定义样式测试 React 组件。我使用 Jest + Enzyme 进行测试。
我有问题：“window.URL.createObjectURL 不是函数”。我读过类似的问题：
github.com/uber/react-map-gl/issues/210
github.com/mapbox/mapbox-gl-js/issues/3436
github.com/mapbox/mapbox-gl-js-mock
并试图添加一些东西但没有成功。请解决问题。
我的 Jest 测试套件遇到了完全相同的问题。经过一些试验和搜索，我能够模拟该createObjectURL方法。
在jest.stub.js文件中，我把这个配置：
if (typeof window.URL.createObjectURL === 'undefined') {
window.URL.createObjectURL = () => {
// Do nothing
// Mock this function for mapbox-gl to work
};
}
然后，在jest.config.js文件中，我添加了对存根文件的引用
setupFiles: [
'<rootDir>/tests/jest.stub.js',
],
注意：确保在 setupFile 定义中获得正确的路径。
我在使用库 Plotly.js 和 React 和 Jest 运行测试时遇到了同样的问题。
我的解决方案是src/setupTests.js为 createObjectURL 函数添加一个带有模拟的文件window.URL.createObjectURL = function() {};
我也在 Mapbox-gl 中使用 React，@Pablo Jurado 的解决方案工作得很好。
刚刚粘贴 window.URL.createObjectURL = function() {};
到src/setupTest.js文件
并将 npm 测试脚本修改为：
"scripts": { "test": "react-scripts test --transformIgnorePatterns \"node_modules/(?!your-module-name)/\"", },
基于 这个例子
添加 require("mapbox-gl-js-mock"); 在 jest.mock(
从“react”导入react；从'@material-ui/core/test-utils'导入{createShallow}；
import App from './App';
require("mapbox-gl-js-mock");
jest.mock('mapbox-gl/dist/mapbox-gl', () => ({
App: () => ({}),
}));
describe('<App />', () => {
let shallow;
beforeEach(() => {
shallow = createShallow({ dive: true });
});
it('renders without crashing', () => {
const wrapper = shallow(<App />);
expect(wrapper.find('.MapBox')).toExist();
});
});