如何在使用jQuery的React组件上运行测试？

Question

我有一个React组件，它使用jQuery选择器来匹配componentDidMount（）中所有组件的高度：

$('.js-matchHeight').matchHeight();

在运行像webpack这样的服务器时运行正常，但是当我编写我的规范（Mocha和Chai）时，它会抱怨：

  

ReferenceError：$未定义

如何将jQuery添加到我的测试中？

Answer 1

您是否尝试过将browser-env添加到测试中？

import browserEnv from 'browser-env';
browserEnv();

我在使用AVA进行单元测试时遇到了类似的问题，我认为这解决了这个问题。不确定，但我想我也导入了jQuery和/或Cheerio。

修改

我的解决方法是在组件中测试jQuery，如：

if (typeof jQuery !== 'undefined') {
    $('.js-matchHeight').matchHeight();
}

或者如果您导入的模块中有jQuery，则可以导出不同的组件版本，如：

module.exports = (typeof jQuery !== 'undefined')
    ? browser(jQuery)
    : nonBrowser();

非如此完美但如果你想要完美，你应该让jQuery远离你的jsx我认为：）