1.5.25 • Published 6 years ago

mochawesome-uirecorder v1.5.25

Weekly downloads
34
License
MIT
Repository
github
Last release
6 years ago

mochawesome

npm

Mochawesome is a custom reporter for use with the Javascript testing framework, mocha. It generates a full fledged HTML/CSS report that helps visualize your test suites.

##New in 1.4.0

  • Added a slide-over navigation menu. Save time by quickly jumping to a specific test suite. The menu also gives you a quick way to see which suites are passing or have failing, skipped, or pending tests.

##Features

  • At-a-glance stats including pass percentage
  • Beautiful charts
  • Support for nested describes
  • Supports pending tests
  • Filter view by test type
  • Quick navigation menu
  • Review test code inline
  • Stack trace for failed tests
  • Responsive and mobile-friendly
  • Saves JSON output for further processing
  • Custom report options
  • Offline viewing

##Browser Support Tested to work in Chrome. Should work in any modern web browser including IE9+. Mochawesome generates a self-contained report that can be viewed offline.

##Sample Report

##Usage

  1. Add Mochawesome to your project:

    npm install --save-dev mochawesome

  2. Tell mocha to use the Mochawesome reporter:

    mocha testfile.js --reporter mochawesome

  3. If using mocha programatically:

    var mocha = new Mocha({
        reporter: 'mochawesome'
    });

##Output Mochawesome generates the following inside your project directory:

mochawesome-reports/
├── css
│   └── mochawesome.css
├── fonts
│   ├── Roboto+Condensed_300_normal.ttf
│   ├── Roboto+Condensed_300_normal.woff
│   ├── Roboto+Condensed_400_normal.svg
│   ├── Roboto+Condensed_400_normal.ttf
│   ├── Roboto+Condensed_400_normal.woff
│   ├── Roboto+Condensed_700_normal.ttf
│   ├── Roboto+Condensed_700_normal.woff
│   ├── Roboto+Slab_400_normal.svg
│   ├── Roboto+Slab_400_normal.ttf
│   ├── Roboto+Slab_400_normal.woff
│   ├── mochawesome.eot
│   ├── mochawesome.svg
│   ├── mochawesome.ttf
│   └── mochawesome.woff
├── js
│   ├── mochawesome.js
│   └── vendor.js
├── mochawesome.html
└── mochawesome.json

The two main files to be aware of are:

mochawesome.html - The rendered report file

mochawesome.json - The raw json output used to render the report

##Options Mochawesome supports options via environment variables or passed in to mocha via --reporter-options.

  • reportDir: {String} - changes the name of the report directory
  • reportName: {String} - changes the name of the report file
  • reportTitle: {Sring} - changes the title of the report
  • inlineAssets: {Boolean} - when true inlines all report assets into a self-contained report file

Setting a custom filename will change both the report html and json files.

Options passed in will take precedence over environment variables.

####Environment variables

$ export MOCHAWESOME_REPORTDIR=customReportDir
$ export MOCHAWESOME_REPORTNAME=customReportName
$ export MOCHAWESOME_REPORTTITLE=customReportTitle
$ export MOCHAWESOME_INLINEASSETS=true

####Mocha options

$ mocha test.js --reporter mochawesome --reporter-options reportDir=customReportDir,reportName=customReportName,reportTitle=customReportTitle,inlineAssets=true
var mocha = new Mocha({
    reporter: 'mochawesome',
    reporterOptions: {
      reportDir: 'customReportDir',
      reportName: 'customReportName',
      reportTitle: 'customReportTitle',
      inlineAssets: true
    }
});

##Development If you wish to make changes to the reporter you will need to clone the repo and build locally. Building requires you to have gulp installed.

###Installation

$ git clone https://github.dowjones.net/grubera/mochawesome

###Modifying Reporter files are found in /lib directory. Templates, styles, and client-side scripts are in the /src directory.

###Building There are several gulp tasks available but the main ones to be aware of are:

####gulp build - Full Build Runs jshint, parses LESS, compiles templates, concatenates and minifies scripts. Note: This task will fail if linting fails.

####gulp watch - Watch Files Watches for changes to JS, LESS, and MU and builds when a change is detected. If a change is detected in a JS file this will run jshint first before building and will fail on any lint errors.

####gulp lint - Lint JS This will run jshint only, no building will occur.

####gulp test - Run Test After building you can run this to test the reporter and see the output. Note: The default gulp task will run this task.

####gulp testOpts - Run Test with Options After building you can run this to test the reporter and see the output.

1.5.25

6 years ago

1.5.24

6 years ago

1.5.23

6 years ago

1.5.22

7 years ago

1.5.22-b4

7 years ago

1.5.22-b3

7 years ago

1.5.22-b2

7 years ago

1.5.22-b1

7 years ago

1.5.21

7 years ago

1.5.21-b1

7 years ago

1.5.20

8 years ago

1.5.20-b2

8 years ago

1.5.20-b1

8 years ago

1.5.19

8 years ago

1.5.18

8 years ago

1.5.18-b3

8 years ago

1.5.18-b2

8 years ago

1.5.18-b1

8 years ago

1.5.17

8 years ago

1.5.16

8 years ago

1.5.15

8 years ago

1.5.14

8 years ago

1.5.14-b2

8 years ago

1.5.14-b1

8 years ago

1.5.13

8 years ago

1.5.12

8 years ago

1.5.11

8 years ago

1.5.10

8 years ago

1.5.9

8 years ago

1.5.8-b6

8 years ago

1.5.8-b5

8 years ago

1.5.8-b4

8 years ago

1.5.8-b3

8 years ago

1.5.8

8 years ago

1.5.8-b2

8 years ago

1.5.8-b1

8 years ago

1.5.7

8 years ago

1.5.6

8 years ago

1.5.5

8 years ago

1.5.4

8 years ago

1.5.3-b1

8 years ago