类型错误:无法设置未定义的属性“_eventListeners”

mar*_*tee 6 javascript testing reactjs jestjs enzyme

使用 React + jest + Enzyme 运行测试时出现以下错误,请帮忙!

? 测试套件无法运行
TypeError:无法 在 Generator.throw (
E:/TEST-UI/node_modules/jsdom/lib/jsdom/browser/Window.js:498:51)
处设置未定义的属性 '_eventListeners' at Generator.throw ( )

错误很奇怪!甚至我尝试设置 jsdom 如下所示,但没有任何效果!

const jsdom = new JSDOM('<!doctype html><html><body></body></html>');
Run Code Online (Sandbox Code Playgroud)

下面是代码片段。

import Enzyme from 'enzyme';

import Adapter from 'enzyme-adapter-react-16';
import 'jsdom-global/register';
import "isomorphic-fetch";


Enzyme.configure({adapter: new Adapter()});

export * from 'enzyme';
Run Code Online (Sandbox Code Playgroud)

测试:

import React from "react";
import Notification from "./Notification";
import { shallow, mount, render } from 'enzyme';
import "src/config/jsdom.setup";

describe('<Notification />', () => {
    test("always renders notificationCount", () => {
        let wrapper = shallow(<Notification/>);
        const divs = wrapper.find("div");
        expect(divs.length).toBeGreaterThan(0);

    });
});
Run Code Online (Sandbox Code Playgroud)

>

require('babel-register')();

const jsdom = require('jsdom').jsdom;
const exposedProperties = ['window', 'navigator', 'document'];

global.document = jsdom('');
global.window = document.defaultView;

Object.keys(document.defaultView).forEach(property => {
    if (typeof global[property] === 'undefined') {
        exposedProperties.push(property);
        global[property] = document.defaultView[property];
    }
});

global.navigator = {userAgent: 'node.js'};
Run Code Online (Sandbox Code Playgroud)

package.json 片段:

 "devDependencies": {
    "@babel/core": "^7.1.0",
    "@babel/plugin-transform-runtime": "^7.1.0",
    "@babel/preset-env": "^7.1.0",
    "@babel/preset-react": "^7.0.0",
    "babel-core": "^7.0.0-bridge.0",
    "babel-jest": "^23.4.2",
    "babel-loader": "^8.0.2",
    "babel-plugin-transform-class-properties": "^6.24.1",
    "babel-polyfill": "^6.26.0",
    "css-loader": "^0.28.11",
    "enzyme": "^3.6.0",
    "enzyme-adapter-react-16": "^1.5.0",
    "enzyme-to-json": "^3.3.0",
    "html-loader": "^0.5.5",
    "html-webpack-plugin": "^3.2.0",
    "jest": "^23.5.0",
    "jsdom": "^11.12.0",
    "jsdom-global": "3.0.2",
    "mini-css-extract-plugin": "^0.4.1",
    "raw-loader": "^0.5.1",
    "react-hot-loader": "^4.1.1",
    "regenerator-runtime": "^0.12.1",
    "style-loader": "^0.21.0",
    "url-loader": "^1.1.1",
    "webpack": "^4.19.1",
    "webpack-cli": "^3.0.3",
    "webpack-dev-server": "^3.1.4"
  },
Run Code Online (Sandbox Code Playgroud)

Jpe*_*c07 0

对于 JSDOM,您是否应该指定您正在访问的 DOM 中的对象?您所在的位置global.document = jsdom('');可能会导致错误。您应该将其指向窗口还是文档?在这种情况下,节点模块是抛出错误的模块,通常是由于未正确实现或由于某些不兼容所致。在这种情况下我的猜测是前者。虽然我不知道有问题的库,但我对此类事情的经验告诉我,它可能没有正确实施。

我建议查看的另一件事是循环方法。当你可以轻松地做一个更简单的循环时,这样做Object.keys().forEach()看起来很混乱而且效率低下for——类似于:

for (let property in document.defaultView) {
  if (document.defaultView.hasOwnProperty(property)) {
    exposedProperties.push(property);
    global[property] = document.defaultView[property];
  }
}
Run Code Online (Sandbox Code Playgroud)