npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

jest-html-results

v0.0.2

Published

Jest test results processor for generating a summary in HTML

Downloads

6

Readme


Installation

npm install jest-html-reporter --save-dev

Usage

Configure Jest to process the test results by adding the following entry to the Jest config (jest.config.js):

{
	"testResultsProcessor": "./node_modules/jest-html-reporter"
}

Then when you run Jest from within the terminal, a file called test-report.html will be created within your root folder containing information about your tests.

Alternative usage with package.json

Although jest.config.js is specifically created for configuring Jest (and not this plugin), it is possible to configure Jest from within package.json by adding the following as a new line:

"jest": {"testResultsProcessor": "./node_modules/jest-html-reporter" }

Run as a Custom Reporter

It is also possible to run jest-html-reporter as a custom reporter within Jest. This allows the plugin to be run in parallel with Jest instead of after a test run, and will guarantee that the test report is generated even if Jest is run with options such as --forceExit.

Add the following entry to the Jest config (jest.config.js):

"reporters": ["default", "./node_modules/jest-html-reporter"]

Please note that you need to add the "executionMode": "reporter" configuration within jesthtmlreporter.config.json in order for this to work (more information on configuration can be found within the documentation).

Node Compatibility

This plugin is compatible with Node version ^4.8.3


Configuration

To configure this plugin, create a file named jesthtmlreporter.config.json in the root folder of the project. Please note that all configuration properties are optional.

| Property | Type | Description | Default |--|--|--|--| | pageTitle | STRING | The title of the document. This string will also be outputted on the top of the page. | "Test Suite" | outputPath | STRING | The path to where the plugin will output the HTML report. The path must include the filename and end with .html | "./test-report.html" | includeFailureMsg | BOOLEAN | If this setting is set to true, this will output the detailed failure message for each failed test. | false | styleOverridePath | STRING | The path to a file containing CSS styles that should override the default styling.* | null | theme | STRING | The name of the reporter themes to use when rendering the report. You can find the available themes in the Documentation | "defaultTheme" | logo | STRING | Path to a logo that will be included in the header of the report | null | executionTimeWarningThreshold | NUMBER | The threshold for test execution time (in seconds) in each test suite that will render a warning on the report page. 5 seconds is the default timeout in Jest. | 5 | dateFormat | STRING | The format in which date/time should be formatted in the test report. Have a look in the Documentation for the available date format variables. | "yyyy-mm-dd HH:MM:ss" | sort | STRING | Sorts the test results with the given method. Available methods are: "default", "status" More information can be found in the Documentation. | "default" | executionMode | STRING | Defines the execution mode. Avaiable modes are: reporter, testResultsProcessor | "testResultsProcessor"

*A note on styleOverridePath

The plugin will search for the file from the root directory, therefore there is no need to prepend the string with ./ or ../. Please have a look at the default styling (located within style/defaultTheme.css) for a reference of the elements available for styling.

Example Configuration

{
	"pageTitle": "Your test suite",
	"outputPath": "test-report/index.html",
	"includeFailureMsg": true,
	"styleOverridePath": "src/teststyle.css"
}

Alternative configuration with package.json

Add an entry named "jest-html-reporter" to your package.json

{
	...
	"jest-html-reporter": {
		"pageTitle": "Your test suite",
		"outputPath": "test-report.html",
		"includeFailureMsg": true
	}
}

Continuous Integration

Configuration may also be performed with environment variables for dynamic file saving paths in different environments. NOTE: Environment variables will take precedence over configurations set in jesthtmlreporter.config.json and package.json

Example

Here is an example of dynamically naming your output file and test report title to match your current branch that one might see in a automated deployment pipeline before running their tests.

export BRANCH_NAME=`git symbolic-ref HEAD 2>/dev/null | cut -d"/" -f 3`
export JEST_HTML_REPORTER_OUTPUT_PATH=/home/username/jest-test-output/test-reports/"$BRANCH_NAME".html
export JEST_HTML_REPORTER_PAGE_TITLE="$BRANCH_NAME"\ Test\ Report

Configuration Environment Variables

The environment variables reflect the properties set in the JSON configuration file. Please read the documentation for more information on these variables.