相关疑难解决方法(0)

jQuery不适用于jsdom / enzyme

我有一个包含以下组件的最低测试React应用:

import React from 'react';
import $ from 'jquery';

export default class App extends React.Component {
    componentDidMount() {
        console.log('componentDidMount', $('#helloDiv').length);
    }

    render() {
        return <div id='helloDiv'>
            Hello React!
                </div>;
    }
}
Run Code Online (Sandbox Code Playgroud)

在浏览器(Chrome)中加载该文件时效果很好。componentDidMount()中的console.log()打印出找到的1个helloDiv元素

但是,如果我使用摩卡+酶+ jsdom进行测试,则App组件中相同的console.log()会输出0:

import React from 'react';
import { mount } from 'enzyme';
import { expect } from 'chai';
import App from '../src/client/app/first'

describe('first test', () => {
    it('should pass', () => {        
        const app = mount(<App />);
        expect(app.find('#helloDiv').length).to.eq(1);
    });
});
Run Code Online (Sandbox Code Playgroud)

注意:此单元测试没有问题,正在通过。真正的问题是,当使用酶安装<App />时,会调用componentDidMount(),但其中的console.log()语句将输出0,而不是1

这是我运行摩卡的方法:

mocha --require enzyme/withDom --compilers js:babel-core/register …
Run Code Online (Sandbox Code Playgroud)

javascript jquery jsdom reactjs enzyme

6
推荐指数
1
解决办法
2386
查看次数

标签 统计

enzyme ×1

javascript ×1

jquery ×1

jsdom ×1

reactjs ×1