Тестирование приложения React, которое использует автозаполнение карт Google с помощью пакета react-geosuggest.
Настройка js dom с помощью этого:
import requestAnimationFrame from './tempPolyfills';
import { configure } from 'enzyme';
import Adapter from 'enzyme-adapter-react-16';
configure({ adapter: new Adapter(), disableLifecycleMethods: true });
const { JSDOM } = require('jsdom');
const jsdom = new JSDOM(`
<!doctype html>
<html>
<head>
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=<our maps key>&libraries=places"></script>
<script>console.log(Window.google)</script>
</head>
<body>
</body>
</html>`, {runScripts: "dangerously"});
const { window } = jsdom;
function copyProps(src, target) {
const props = Object.getOwnPropertyNames(src)
.filter(prop => typeof target[prop] === 'undefined')
.reduce((result, prop) => ({
...result,
[prop]: Object.getOwnPropertyDescriptor(src, prop),
}), {});
Object.defineProperties(target, props);
}
global.window = window;
global.document = window.document;
global.navigator = {
userAgent: 'node.js',
};
copyProps(window, global);
Я понимаю, что API карт Google добавляет метод google: в окно (так что window.google}
Однако мои тесты терпят неудачу, говоря, что API карт Google не найден на странице. Я могу подтвердить, что попытка консольного журнала window.google не определена.
Это потому, что jsdom возвращается до того, как API карт сможет обновить DOM?
Есть ли лучший способ протестировать компонент, использующий API карт Google?
Пробовал решение здесь, однако это все еще дает мне неопределенность