0.1.0 • Published 3 years ago
react-jest-test-viewer v0.1.0
react-jest-test-viewer
A React component for viewing Jest tests in the browser
Install
npm install react-jest-test-viewer
Usage
This package will display HTML test reports generated by
jest-html-reporter
in the
browser alongside your React app. First, you'll need a configuration file to
output the test results to the public
directory. Make a file called
jesthtmlreporter.config.json
, and put in these options:
{
"pageTitle": "Test Report",
"outputPath": "public/test.html",
"includeFailureMsg": true
}
Next, when running tests, you'll need to tell Jest to use jest-html-reporter
as a reporter:
"scripts": {
"start": "react-scripts start",
"test": "react-scripts test --reporters jest-html-reporter default --watchAll"
}
It's recommended to run npm test
in one terminal window, and npm start
in
another, so that your tests will be watched and run in the background; and your
app will be hot-reloaded in the browser.
To display the component:
import React from 'react'
import ReactDOM from 'react-dom'
import TestViewer from 'react-jest-test-viewer'
import App from './App'
ReactDOM.render(
<TestViewer
active={process.env.NODE_ENV === 'development'}
showTests={true}
testFile='test.html'
>
<App />
</TestViewer>,
document.getElementById('root')
)
License
MIT © ihollander
0.1.0
3 years ago