jquery doesn't work with jsdom/enzyme

Question

I have a minimum test react app with following component:

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

export default class App extends React.Comp         


        

Answer 1

There needs to be some setup done before you could jsdom with jquery in node-env.

Try this if it helps.

Create a test helper file like this -

test_helper.js

import _$ from 'jquery';
import jsdom from 'jsdom';
import chai, { expect } from 'chai';
import chaiJquery from 'chai-jquery';

global.document = jsdom.jsdom('');
global.window = global.document.defaultView;
global.navigator = global.window.navigator;
const $ = _$(window);

chaiJquery(chai, chai.util, $);

export {expect};

While running -

mocha --require enzyme/withDom --compilers js:babel-core/register --require test/test_helper.js test/index.test.js

or another way use jsdom-global without test_helper.js file.

npm install --save-dev jsdom-global

Then :

import 'jsdom-global/register'; 

//at the top of file , even  , before importing react