1

酵素を使用して React Native プロジェクトをテストしようとしていますが、セットアップ手順に従いました。

https://github.com/airbnb/enzyme/blob/master/docs/guides/react-native.md

  "scripts": {
     "start": "node node_modules/react-native/local-cli/cli.js start",
     "test": "mocha --require react-native-mock/mock.js --compilers js:babel-core/register --recursive test/**/*.js"
  },

これは正常に機能し、自分のコードは正しくトランスパイルされますが、コードをトランスパイルしないモジュール (たとえばhttps://github.com/aksonov/react-native-router-flux ) を含めると、テストの実行が拒否されますこれらのモジュールの import ステートメントでエラーが発生するためです。

これらのモジュールをbabelにトランスパイルさせるにはどうすればよいですか、またはテストを実行する別の方法はありますか?

アップデート

React Native自体はトランスパイルされていないため、トランスパイルされていないサードパーティモジュールはReact Nativeとかなり共通しているようです。

解決策は、トランスパイルを強制することと、react-native-mock を使用することの組み合わせのようです。 https://github.com/facebook/react-native/issues/5392

ただし、NavigationExperimental がモックされていないため、react-native-router-flux でさらに問題が発生しています。

関連リンクは次のとおりです。

https://github.com/lelandrichardson/react-native-mock/issues/23 https://github.com/lelandrichardson/react-native-mock/issues/22 https://github.com/lelandrichardson/react-ネイティブモック/プル/34

解決策が見つかったら、ここで更新します。

更新 2

誰かが役に立つと思う場合に備えて、現在の回避策を以下に含めました。

https://stackoverflow.com/a/37655424/168012

4

3 に答える 3

2

そうする代わりに--compilers js:babel-core/register、require フックを呼び出す独自のスクリプトを作成してみることもできます (babel-registerパッケージを使用する方がよいでしょう)。only|ignoreオプションを使用します。

// init.js
require("babel-register")({
  only: [
    "/my-app-dir/src/**/*",
    "/my-app-dir/node_modules/react-native-router-flux/**/*",
  ]
});

mocha --require ./init.js

ただし、これは一般に、パッケージを公開するための非常に疑わしい方法です。.babelrcこれは、がパッケージと共に公開されていることを前提としています。それでも、それが参照するものは呼び出されるのでdevDependencies、手動でそのフォルダーに移動してインストールする必要があるようです。

于 2016-05-16T14:20:21.133 に答える
1

私の現在の解決策は次のとおりです（ReactNativeMockでNavigationExperimentalが現在サポートされていない場合）：

パッケージ.json 

"scripts": {
    ...
    "test": "mocha --require test/init.js --recursive test/**/*.js"
  },

/test/init.js

require('react-native-mock/mock');

require("babel-register")({
    only: [
        "/node_modules/react-native-tab-navigator/*.js",
        "/node_modules/react-native-router-flux/*.js",
        "/node_modules/react-native-router-flux/src/*.js",
        "/node_modules/react-native-tabs/*.js",
        "/node_modules/react-native-button/*.js",
        "/node_modules/react-native-swipeout/*.js",
        "/app/**/*",
        "/test/**/*",
    ]
});

import mockery from 'mockery';
mockery.enable();
mockery.registerMock('react-native-router-flux', {Actions:{}});
于 2016-06-06T10:46:36.270 に答える
0

これは、react-native-サードパーティ モジュールを処理するための私の testHelper.js です。

require('babel-polyfill');
require('react-native-mock/mock');

// require('babel-core/register')({
//   ignore: function(packageName) {
//     if (packageName.match(/node_modules/)) {
//       return !(packageName.match(/react-native-vector-icons/)
//         || packageName.match(/react-native-animatable/)
//         || packageName.match(/react-native-router-flux/)
//         || packageName.match(/react-native-tab-navigator/)
//       );
//     }
//     return false;
//   }
// });

var fs = require('fs');
var path = require('path');

function getBabelRC() {
  var rcpath = path.join(__dirname, '.babelrc');
  var source = fs.readFileSync(rcpath).toString();
  return JSON.parse(source);
}

var config = getBabelRC();

config.ignore = function(filename) {
  if (!(/\/node_modules\//).test(filename)) {
    console.log(filename, 'FALSE');
    return false; // if not in node_modules, we want to compile it
  } else if ((/\/node_modules\/react-native.*\//).test(filename)) {
    // its RN source code, so we want to compile it
    console.log(filename, 'FALSE');
    return false;
  } else {
    console.log(filename, 'TRUE');
    // it's in node modules and NOT RN source code
    return true;
  }
};

require("babel-register")(config);

global.__DEV__ = true;


// var chai = require('chai');
// var dirtyChai = require('dirty-chai');
// chai.use(dirtyChai);

import chai from 'chai';
import dirtyChai from 'dirty-chai';
// import chaiImmutable from 'chai-immutable';

chai.use(dirtyChai);
//chai.use(chaiImmutable);

import mockery from "mockery";

mockery.enable();
mockery.registerMock('./menu_burger.png', 0);

これは私のnpmテストです

"test": "node_modules/.bin/mocha --compilers js:babel-core/register --require testHelper.js **/__test__/*.js",
于 2016-05-29T23:52:15.407 に答える