酶导入时出现ReferenceError [英] ReferenceError on enzyme import

问题描述

我正在尝试使用酶和开玩笑为反应天然成分编写一个基本测试.我收到一个错误，暗示酶未正确导入:

I'm trying to write a basic test for a react-native component using enzyme and jest. I get an error alluding to enzyme not being imported correctly:

● SearchPage › it starts spinner when page is loading
  - ReferenceError: _enzyme is not defined
        at Spec.eval (__tests__/basic-test.js:12:16)
1 test failed, 0 tests passed (1 total in 1 test suite, run time 1.113s)
npm ERR! Test failed.  See above for more details.

我是新手，所以我尝试重新安装酶包装并盲目地摆弄代码.不使用酶工作浅浅的基本测试，即Expect(true).toBe(true).我已经遍历了很多有关JS中referenceErrors的问题，但是似乎没有一个适用于这种情况(无论如何，以我的经验不足).

I have tried reinstalling the enzyme package and blindly fiddling with the code as I am a novice. Basic tests not using shallow from enzyme work, i.e. expect(true).toBe(true). I've trawled through quite a few questions dealing with referenceErrors in JS, but none seem applicable in this scenario (in my inexperienced eyes anyway).

这是测试文件.相当裸露，限制了错误的出处.

Here is the test file. Pretty bare, limiting where the error may be coming from.

jest.dontMock('../SearchPage');

import React from 'react';
import { shallow } from 'enzyme';
import ReactDOM from 'react-dom';
import TestUtils from 'react-addons-test-utils';

const SearchPage = require('../SearchPage');

describe('SearchPage', () => {
  it('starts spinner when page is loading', () => {
    const wrapper = shallow(<SearchPage />);

    // Check that it is false initially i.e. not loading.
    expect(wrapper.state('isLoading')).toBe(false);

    // Simulate a touch on 'Go' button and verify loading is now true
  });
});

据我所知，我的package.json具有正确的依赖关系.我尝试重新安装酶没有成功.在这里:

My package.json has the correct dependencies as far as I am aware. I have tried reinstalling enzyme without success. Here it is:

{
  "name": "PropertyFinder",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "start": "node node_modules/react-native/local-cli/cli.js start",
    "test": "jest"
  },
  "dependencies": {
    "react-native": "^0.20.0",
    "react-dom": "~0.14.7"
  },
  "devDependencies": {
    "babel-jest": "*",
    "enzyme": "^2.0.0",
    "jest-cli": "^0.8.2",
    "react": "^0.14.7",
    "react-addons-test-utils": "~0.14.0",
    "react-native-mock": "0.0.6"
  },
  "jest": {
    "scriptPreprocessor": "node_modules/react-native/jestSupport/preprocessor.js",
    "setupEnvScriptFile": "node_modules/react-native/jestSupport/env.js",
    "testPathIgnorePatterns": [
      "/node_modules/",
      "packager/react-packager/src/Activity/"
    ],
    "testFileExtensions": [
      "js"
    ],
    "unmockedModulePathPatterns": [
      "promise",
      "source-map",
      "react",
      "react-dom",
      "react-addons-test-utils",
      "fbjs",
      "enzyme",
      "cheerio",
      "htmlparser2",
      "lodash",
      "domhandler",
      "object.assign",
      "define-properties",
      "function-bind",
      "object-keys",
      "object.values",
      "es-abstract"
    ]
  }
}

在这种情况下会/将引发什么?如果我尝试mocha/chai看看是否可行，我可能会很快发表评论，但是我现在还是开玩笑.

What could/would be throwing this ReferenceError in this context? I may comment soon if I try mocha/chai to see if that works, but I'd rather stay with jest at this point.

推荐答案

问题来自ES6中的进口悬挂

The issue rises from hoisting of imports in ES6 explained in more detail here. Using babel-jest as a preprocessor will resolve this issue, but it is important to keep the "setupEnvScriptFile".

对我有用的示例

"jest": {
    "preprocessorIgnorePatterns": [
      "node_modules/enzyme"
    ],
    "scriptPreprocessor": "<rootDir>/node_modules/babel-jest",
    "setupEnvScriptFile": "node_modules/react-native/jestSupport/env.js",
    "testPathIgnorePatterns": [
      "/node_modules/",
      "packager/react-packager/src/Activity/"
    ],
    "unmockedModulePathPatterns": [
      "react",
      "react-dom",
      "react-native",
      "react-addons-test-utils",
      "promise",
      "source-map",
      "enzyme"
    ]
  },

这篇关于酶导入时出现ReferenceError的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！