{"id":15650727,"url":"https://github.com/zordius/gulp-jsx-coverage","last_synced_at":"2025-04-30T17:10:14.438Z","repository":{"id":25198338,"uuid":"28622021","full_name":"zordius/gulp-jsx-coverage","owner":"zordius","description":"deprecated","archived":false,"fork":false,"pushed_at":"2017-07-19T08:15:42.000Z","size":889,"stargazers_count":34,"open_issues_count":1,"forks_count":10,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-04-30T17:10:01.247Z","etag":null,"topics":["babel","coverage-report","es2015","gulp","istanbul","mocha-tests","react"],"latest_commit_sha":null,"homepage":"https://www.npmjs.com/package/gulp-jsx-coverage","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"other","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/zordius.png","metadata":{"files":{"readme":"README.md","changelog":"HISTORY.md","contributing":null,"funding":null,"license":"LICENSE.txt","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2014-12-30T07:33:21.000Z","updated_at":"2017-07-19T08:16:13.000Z","dependencies_parsed_at":"2022-08-23T19:50:39.639Z","dependency_job_id":null,"html_url":"https://github.com/zordius/gulp-jsx-coverage","commit_stats":null,"previous_names":[],"tags_count":26,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zordius%2Fgulp-jsx-coverage","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zordius%2Fgulp-jsx-coverage/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zordius%2Fgulp-jsx-coverage/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/zordius%2Fgulp-jsx-coverage/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/zordius","download_url":"https://codeload.github.com/zordius/gulp-jsx-coverage/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":251748950,"owners_count":21637418,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["babel","coverage-report","es2015","gulp","istanbul","mocha-tests","react"],"created_at":"2024-10-03T12:35:38.914Z","updated_at":"2025-04-30T17:10:14.411Z","avatar_url":"https://github.com/zordius.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"gulp-jsx-coverage\n=================\n\nEnable istanbul coverage on ES2015/babel files when you do mocha/jasmine tests, also deal with sourceMap for stack trace....as gulp task.\n\n[![npm version](https://img.shields.io/npm/v/gulp-jsx-coverage.svg)](https://www.npmjs.org/package/gulp-jsx-coverage) [![npm download](https://img.shields.io/npm/dm/gulp-jsx-coverage.svg)](https://www.npmjs.org/package/gulp-jsx-coverage) [![Dependency Status](https://david-dm.org/zordius/gulp-jsx-coverage.svg)](https://david-dm.org/zordius/gulp-jsx-coverage) [![Build Status](https://travis-ci.org/zordius/gulp-jsx-coverage.svg?branch=master)](https://travis-ci.org/zordius/gulp-jsx-coverage) [![License](https://img.shields.io/badge/license-MIT-green.svg)](LICENSE.txt)\n\n**deprecated** Suggest to use \u003ca href=\"https://facebook.github.io/jest/\"\u003ejest\u003c/a\u003e to test, or use new \u003ca href=\"https://github.com/istanbuljs/nyc\"\u003eistanbul/nyc\u003c/a\u003e directly.\n\nFeatures\n========\n\n* Help you create a gulp task to handle mocha testing + istanbul coverage\n* Transpile .jsx and ES2015 .js files on the fly\n* Use \u003ca href=\"https://github.com/babel/babel\"\u003ebabel\u003c/a\u003e to transpile .js and .jsx files so you can use \u003ca href=\"http://babeljs.io/docs/learn-es2015/\"\u003eES2015 features\u003c/a\u003e inside your .js and .jsx files!\n* Customize everything by options\n* sourceMaps on stack traces when mocha test failed (powered by \u003ca href=\"https://github.com/evanw/node-source-map-support\"\u003esource-map-support\u003c/a\u003e)\n* coverage threshold\n\n---\n\n**ORIGINAL CODE/LINE in coverage reports**\n\u003cimg src=\"demo1.png\" /\u003e\n\n**ORIGINAL CODE/LINE in stack traces**\n\u003cimg src=\"demo2.jpg\" /\u003e\n\nUsage\n=====\n\n1. Install\n----------\nFor Mocha tests:\n```\nnpm install gulp gulp-jsx-coverage gulp-mocha babel-plugin-istanbul --save-dev\n```\n\nFor Jasmine tests:\n```\nnpm install gulp gulp-jsx-coverage gulp-jasmine babel-plugin-istanbul --save-dev\n```\n\n2. Configure Babel\n------------------\nConfigure your \u003ca href=\"https://babeljs.io/docs/usage/babelrc/\"\u003e.babelrc\u003c/a\u003e and install proper \u003ca href=\"https://babeljs.io/docs/plugins/\"\u003epresets or plugins\u003c/a\u003e.\n\nHere is a .babelrc example:\n```\n{\n  presets: ['es2015', 'react']\n}\n```\nAnd then:\n```\nnpm install babel-preset-es2015 babel-preset-react\n```\n\n3. Create Gulp Task\n-------------------\nPut this into your gulpfile.js:\n```javascript\ngulp.task('your_task_name', require('gulp-jsx-coverage').createTask({\n    src: ['test/**/*.js', 'test/components/*.jsx'],  // your test files\n}));\n```\n\nThen run the task: `gulp your_task_name`\n\nBest Practices\n==============\n\n* The golden rule: **Use .jsx as ext name** when jsx syntax inside it. Require it by `require('file.jsx')`.\n* When you develop a module, do not use any module loader hooks. (Refer to \u003ca href=\"https://babeljs.io/docs/usage/require/\"\u003eBabel require hook document\u003c/a\u003e)\n* Excludes babel as possible as you can to improve babel performance.\n* When you develop an application, you may use module loader hooks. But, don't enable the hook when you do testing.\n\nUsage: General Mocha Test Creator\n=================================\n\n```javascript\ngulp.task('your_task_name', require('gulp-jsx-coverage').createTask({\n    src: ['test/**/*.js', 'test/components/*.jsx'],  // will pass to gulp.src as mocha tests\n\n    istanbul: {                                      // will pass to istanbul, this is default setting\n        exclude: /node_modules/                      // do not instrument these files\n    },\n\n    threshold: [                                     // fail the task when coverage lower than one of this array\n        {\n            type: 'lines',                           // one of 'lines', 'statements', 'functions', 'banches'\n            min: 90\n        }\n    ],\n\n    babel: {                                         // this is default setting\n        include: /\\.jsx?$/,\n        exclude: /node_modules/,\n        omitExt: false                               // if you wanna omit file ext when require(), put an array\n    },                                               // of file exts here. Ex: ['.jsx', '.es6'] (NOT RECOMMENDED)\n\n    coverage: {\n        reporters: ['text-summary', 'json', 'lcov'], // list of istanbul reporters\n        directory: 'coverage'                        // will pass to istanbul reporters\n    },\n\n    mocha: {                                         // will pass to mocha\n        reporter: 'spec'\n    },\n\n    //optional\n    cleanup: function () {\n        // do extra tasks after test done\n        // EX: clean global.window when test with jsdom\n    }\n}));\n```\n\nUsage: Other Testing Frameworks\n===============================\n```javascript\nvar GJC = require('gulp-jsx-coverage');\nvar jasmine = require('gulp-jasmine');\n\ngulp.task('my_jasmine_tests', function () {\n    GJC.initModuleLoader(GJCoptions);                     // Refer to previous gulp-jsx-coverage options\n\n    return gulp.src('test/*.js')\n    .pipe(jasmine(jasmineOptions))\n    .on('end', GJC.collectIstanbulCoverage(GJCoptions));  // Refer to previous gulp-jsx-coverage options\n});\n```\n\nLive Example: mocha\n===================\n\n```sh\ngit clone https://github.com/zordius/gulp-jsx-coverage.git\ncd gulp-jsx-coverage\nnpm install\nnpm run mocha\n```\n\n**OUTPUT**:\n```\n ~/gulp-jsx-coverage master\u003enpm run mocha\n\n\u003e gulp-jsx-coverage@0.3.8 mocha /Users/zordius/gulp-jsx-coverage\n\u003e gulp mocha_tests\n\n[11:50:14] Using gulpfile ~/gulp-jsx-coverage/gulpfile.js\n[11:50:14] Starting 'mocha_tests'...\n\n\n  target (tested by test1.js)\n    ✓ should multiply correctly\n    - should not show coverage info for test1.js\n    ✓ should handle es2015 template string correctly\n\n  target (tested by test2.jsx)\n    ✓ should multiply correctly (77ms)\n    - should not show coverage info for test2.jsx\n    1) should exception and failed\n\n  Component.jsx (tested by test2.jsx)\n    ✓ should render Hello World\n\n\n  4 passing (104ms)\n  2 pending\n  1 failing\n\n  1) target (tested by test2.jsx) should exception and failed:\n     TypeError: \"hohoho\n this is\n multi line\n error!\".notAFunction is not a function\n      at Context.\u003canonymous\u003e (test2.jsx:34:10)\n\n\n[11:50:16] 'mocha_tests' errored after 1.86 s\n[11:50:16] Error in plugin 'gulp-mocha'\nMessage:\n    1 test failed.\n---------------|----------|----------|----------|----------|----------------|\nFile           |  % Stmts | % Branch |  % Funcs |  % Lines |Uncovered Lines |\n---------------|----------|----------|----------|----------|----------------|\nAll files      |    90.48 |      100 |       75 |    90.48 |                |\n Component.jsx |       75 |      100 |       50 |       75 |              5 |\n target.js     |       80 |      100 |    66.67 |       80 |              8 |\n testlib.js    |      100 |      100 |      100 |      100 |                |\n---------------|----------|----------|----------|----------|----------------|\n```\n\n* Check \u003ca href=\"gulpfile.js\"\u003egulpfile.js\u003c/a\u003e for the sample input.\n* Check \u003ca href=\".babelrc\"\u003e.babelrc\u003c/a\u003e for the sample babel config.\n* Check \u003ca href=\"http://zordius.github.io/gulp-jsx-coverage/lcov-report/\"\u003ecoverage report\u003c/a\u003e directory for the sample output.\n\nUpgrade Notice\n==============\n\n**0.4.0**\n* Core changed:\n  * do not support isparta now\n  * do not support coffee-script/cjsx now\n  * do not support options.babel now (please use .babelrc)\n  * do not support options.istanbul.coverageVariable now\n  * move to \u003ca href=\"https://github.com/istanbuljs\"\u003eistanbul.js\u003c/a\u003e and \u003ca href=\"https://github.com/istanbuljs/babel-plugin-istanbul\"\u003ebabel-plugin-istanbul\u003c/a\u003e now\n\n**0.3.2**\n\n* API changed:\n  * you should rename all colloectIstanbulCoverage into collectIstanbulCoverage\n\n**0.3.0**\n\n* Babel upgraded:\n  * You should add proper options.babel.plugins or options.babel.presets to transpile your script properly. Please refer to http://babeljs.io/docs/plugins/\n\n* API changed:\n  * you should rename all initIstanbulHookHack into initModuleLoaderHack\n\n**0.2.0**\n\n* the sourceMap stack trace feature requires:\n  * mocha \u003e= 2.2.2\n  * the options.babel.sourceMap should be changed from 'inline' to 'both'\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fzordius%2Fgulp-jsx-coverage","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fzordius%2Fgulp-jsx-coverage","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fzordius%2Fgulp-jsx-coverage/lists"}