web-dev-qa-db-ja.com

React Puppeteer + Istanbulのコードカバレッジ）

create-react-appで作成したアプリと、Jest + Istanbulで作成したUIテストがあります。

これらのUIテストのコードカバレッジを取得したいと考えています。ユニットテストですでに使用しているので、私はjestを使い続けたいです。

できればcreate-react-appを取り出さないようにします。しかし、他に選択の余地がない場合は、私はそれにオープンです。

これまでに試したこと：

package.json

"scripts": {
  "uitest": "react-scripts test --env=jsdom --verbose --testMatch='**/*.ui-test.{js}'",
}

npm run uitest -- --coverageを実行した場合

attempt 1 failure

^上記のシナリオでは、実際のアプリではなくテストのみをキャプチャすると思います。

これをどのように修正しますか？

その他の失敗した試み：

1） カバー方法Reactイスタンブールのjsxファイル？ -create-react-appを使用しているため、適用しないでください

2） https://github.com/facebook/create-react-app/issues/3257 -明らかにこの機能は提案されましたが、拒否されました。

3） https://github.com/istanbuljs/puppeteer-to-istanbul/issues/18 -puppeteer-to-istanbulと呼ばれるライブラリがありますが、ソースマップをサポートしていません。 （問題についてはリンクを参照してください）

4）私はまた、本Node.js Web Development-Fourth Editionon safaribooksを見ました-Puppeteerの便利なガイドを見つけましたが、コードカバレッジをカバーしていないようです。

5）本safaribooksの実践的な継続的インテグレーションと配信-Puppeteer + Jestテストに関するセクションがあり、コードカバレッジについては何も述べられていません。

6）puppeteer-to-istanbulを試しました->この方法でバンドルのコードカバレッジを計算できますが、ソースマップはサポートされていません。

7）Enselicの提案を試みましたが、機能させることができませんでした。 babel-plugin-istanbulをプッシュしようとすると、カスタムプリセット内のPushメソッドでクラッシュするようです。

reactjsjestjscreate-react-apppuppeteeristanbul
17
bhathiya-perera

package.jsonファイルに collectCoverageFrom オプションがないようです。

package.jsonに次のように挿入してみてください：

  "jest": {
    ...
    "collectCoverageFrom": [
      "src/**/*.{js,jsx}",
      "!**/setupTests.js",
      "!**/**/*.test.js"
    ],

また、テストファイルのカバレッジ全体を損なうため、カバレッジをスキップすることをお勧めします。この場合、例に示すように、collectCoverageFrom配列で!を使用します;）

2
mpospelov