Summary: A visualizer tool to display testing related information per commits. The tool currently only works with JavaScript repos using Jest.
./compute-testing-info <repo-path> [<subsample-freq>]
python -m http.server 8000
(or another port of choice) to start a local http serverstart <browser> http://localhost:<port>/<path_to_html_file>
on Windows, open <browser> http://localhost:<port>/<path_to_html_file>
on MacOS, or browser http://localhost:<port>/<path_to_html_file>
on Linux. For example, start firefox http://localhost:8000/visualization/teststatus.html
will open the test status (pass/fail) visualization in Firefox on WindowsThe engineering task our visualization supports is identifying commits that have an outsized impact on test performance. Impact could be positive or negative changes to test coverage, the number of tests passing, or memory consumption.
The original task we set out to solve was to help facilitate the strenuous process of testing, making information more visual and informative to everyone. We wanted the tool to be able to keep track/log information throughout the lifetime of the repo, from the first commit to present day.
The original visualization consisted of two graphs:
The prototype testing concluded that the information was lackluster: programmers felt that the graphs weren't able to produce enough relevant information for them to care. If someone were to use the tool, it would not only have to produce more information as a whole, but more relevant information.
Also, we realized that if a repo had way too many commits, the graphs would be rendered useless since the plots and bars would be squished and small, and the details became undistinguishable.
So we scrapped the first analysis and visualization, modified the other and, collected more data about the performance of tests (how long to run a test suite, memory usage of a test suite, and coverage of a test suite) for more relevance. We also decided to provide the ability to subsample the repo over history (i.e. to skip every n commits).
The new visualization consists of the following graphs:
teststatus.html
: A bar graph showing the number of passing tests and total number of tests for each commit. This is also an interactive graph with mouse tooltips.coverage-bar.html
: A bar graph showing each of the coverage types (line, statement, branch, and function) for each commit. This is also an interactive graph with mouse tooltips and legend function.coverage-line.html
: A coverage line graph of the same information as above, for easier legibility and a better representation of the repository as a whole.testruntime.html
: A bar graph showing the time taken to run the test suite and total number of tests for each commit. This is also an interactive graph with mouse tooltips and legend function.heap-usage.html
: A bar graph showing the total memory used (in MB of heap usage) on all unit tests per commit. This is also an interactive graph with mouse tooltips and a legend function.The final design includes the following features:
./compute-testing-info <repo-path> [<subsample-freq>]