Question

我正在尝试对反应组件和测试抛出一个简单的enzyme和ReferenceError: React is not defined测试： jest 。我按照react和npm test测试的所有简单教程进行了测试，但所有这些教程都导致了相同的异常。我使用了yarn test，结果与React相同，Checkbox.test.jsx未定义。我很迷惑。任何帮助将不胜感激。

`import { shallow } from 'enzyme'; import sinon from 'sinon'; import Checkbox from './Checkbox'; describe('<Checkbox />', () => { it('should render three <Checkbox /> components', () => { const wrapper = shallow(<Checkbox />); expect(wrapper.prop('title')).toEqual('Events — Event Radar'); }); });`：简单测试

Console

`$ yarn test FAIL src\components\ReusableComponents\Checkbox.test.jsx (5.248s) <Checkbox /> × should render three <Checkbox /> components (4ms) ● <Checkbox /> › should render three <Checkbox /> components ReferenceError: React is not defined at Object.<anonymous> (src/components/ReusableComponents/Checkbox.test.jsx:8:40) Test Suites: 1 failed, 1 total Tests: 1 failed, 1 total Snapshots: 0 total Time: 10.517s Ran all test suites. error Command failed with exit code 1.` log

package.json

{ "name": "mi-benchmarking-frontend", "version": "0.1.0", "private": true, "dependencies": { "axios": "^0.17.0", "classnames": "^2.2.5", "history": "^4.7.2", "prop-types": "^15.6.0", "react": "^16.0.0", "react-bootstrap": "^0.31.5", "react-bootstrap-table": "^4.1.1", "react-dom": "^16.0.0", "react-logger": "^1.1.0", "react-pagination-table": "^1.1.0", "react-redux": "^5.0.6", "react-router": "^3.2.0", "react-router-redux": "^4.0.8", "react-scripts": "1.0.14", "react-simple-paginate": "^1.1.0", "react-table": "^6.6.0", "redux": "^3.7.2", "redux-logger": "^3.0.6", "redux-thunk": "^2.2.0" }, "devDependencies": { "autoprefixer": "^6.3.6", "babel-core": "^6.26.0", "babel-eslint": "^6.0.4", "babel-jest": "^21.2.0", "babel-loader": "^6.2.4", "babel-plugin-react-require": "^3.0.0", "babel-plugin-syntax-object-rest-spread": "^6.13.0", "babel-plugin-transform-object-spread-inline": "0.0.2", "babel-polyfill": "^6.8.0", "babel-preset-es2015": "^6.6.0", "babel-preset-react": "^6.5.0", "babel-preset-stage-0": "^6.5.0", "clean-webpack-plugin": "^0.1.13", "copy-webpack-plugin": "^4.0.0", "css-loader": "^0.23.1", "enzyme": "^3.1.0", "enzyme-adapter-react-16": "^1.0.2", "eslint": "^3.19.0", "eslint-loader": "^1.5.0", "eslint-plugin-babel": "^4.1.2", "eslint-plugin-react": "^7.1.0", "extract-text-webpack-plugin": "^3.0.2", "file-loader": "^1.1.5", "html-webpack-plugin": "^2.16.1", "jest": "^21.2.1", "jest-enzyme": "^4.0.1", "json-loader": "^0.5.4", "postcss-loader": "^0.9.1", "redux-devtools": "^3.4.0", "sinon": "^4.0.2", "style-loader": "^0.13.1", "url-loader": "^0.5.7", "webpack": "2.6.1", "webpack-dev-server": "2.5.0", "webpack-manifest-plugin": "1.1.0" }, "scripts": { "start": "npm run build:dev", "build:dev": "webpack-dev-server --inline --history-api-fallback", "build:test": "webpack --define process.env.NODE_ENV='test'", "build:stage": "webpack --define process.env.NODE_ENV='stage'", "build:prod": "webpack --define process.env.NODE_ENV='production'", "eject": "react-scripts eject", "test": "jest", "test:watch": "jest --watch", "test:coverage": "jest --coverage" }, "jest": { "setupTestFrameworkScriptFile": "./node_modules/jest-enzyme/lib/index.js" } }

package com.example.norhanom.barcodeqrcode;

import android.app.ProgressDialog;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;       //view button or textfield
import android.widget.Toast;    //to show and create message for user,appears 
 as floating view over app
import android.widget.EditText;
import android.widget.TextView;
import android.widget.Button;

import com.android.volley.Response;
import com.android.volley.VolleyError;
import com.android.volley.Request;
import com.android.volley.Response;
import com.android.volley.toolbox.StringRequest;
import com.google.zxing.Result;

 import org.json.JSONArray;
import org.json.JSONException;
import org.json.JSONObject;

 import me.dm7.barcodescanner.zxing.ZXingScannerView;


  public class MainActivity extends AppCompatActivity {

   private ZXingScannerView scannerView;
   TextView result;
    private ProgressDialog pd;

    @Override
     protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    result = (TextView)findViewById(R.id.textView1);
    pd = new ProgressDialog(MainActivity.this);
    pd.setMessage("loading");
    pd.setCancelable(false);
    pd.setCanceledOnTouchOutside(false);
     }

   public void scanCode(View view){

    scannerView = new ZXingScannerView(this); // Programmatically initialize 
    the scanner view
    scannerView.setResultHandler(new ZXingScannerResultHandler());

    setContentView(scannerView); //Set the scanner view as the content view
    scannerView.startCamera();   //scannerView open camera
    }



   @Override
   public void onPause()
   {
    super.onPause();
    scannerView.stopCamera(); //stop camera on pause
    }

    class ZXingScannerResultHandler implements ZXingScannerView.ResultHandler
    {

    @Override
    public void handleResult(Result result1)
    {
        String resultCode = result1.getText(); //get the result

     Toast.makeText(MainActivity.this,resultCode,Toast.LENGTH_LONG).show();  
     //show result
        setContentView(R.layout.activity_main);
        scannerView.stopCamera(); //camera stop






        }


      }


    }

Answer 1

在测试中导入React，错误应该消失：

import React from 'react';

我尝试在我的一个测试中删除此导入，并且我得到了您提到的相同错误。

我希望这会有所帮助。

尝试使用Jest和Enzyme对React组件进行单元测试

1 个答案: