The AngularJS front-end uses config files generated by stackviz-export
to display a variety of information regarding test runs. This document breaks
down the various components of the Stackviz Angular app.
Path: | <host>/#/ |
---|---|
Directive: | ./app/views/home.html |
Controller: | ./app/js/controllers/home.js |
The landing page for Stackviz consists of two elements. The first is a summary panel that shows statistics for the run including runtime (MM:SS), total number of tests run, number of failed tests, and number of skipped tests. The button in the footer of this panel links to the timeline, where individual tests can be browsed further. The second element is a panel showing all of the failures for the current run, including the last few lines of their tracebacks. The test divs here link to their corresponding Test Details page.
Path: | <host>/#/<run>/timeline?test=<test>/ |
---|---|
Directive: | ./app/views/timeline.html |
Controller: | ./app/js/controllers/timeline.js |
The Timeline provides an overview of all the tests that were executed as part of a run. Each lane in the timeline corresponds to one worker thread on the host machine. Each rectangle in the timeline represents one test. When a rectangle is selected, the details panel below the timeline is populated with information about the test. Each test rectangle is also color-coordinated: green is passing, blue is skipped, and red is failed.
The details panel below the timeline shows information pertaining to the current test (it is empty if no test is selected): test class, test module, which worker executed it, the duration, and start & finish timestamps. The footer contains a button that links to the test details page for the selected test.
Path: | <host>/#/<run>/test-details/<test>/ |
---|---|
Directive: | ./app/views/test-details.html |
Controller: | ./app/js/controllers/test-details.js |
The test details page consists of one panel that displays various log info from one test. The first tab contains summary information similar to the info found on the test panel on the timeline. Additional tabs in this panel are dependent upon the logs that the test kept. Each of these tabs provides additional information to aid debugging. The most common tabs include:
When enough information has been gleaned from more detailed logs, the button in the panel filter can be used to quickly navigate back to the timeline page.
timeDiff
(the duration of the run) is
calculated from the start and end timestamps contained in summary data.
All other fields are populated directly from the summary data, via a call
to the dataset service.testDetailsSearch
uses two HTML pages to search the test details
page: test-details-search-popover.html
and test-details-search.html
.
The popover contains the filter levels for the pythonlogging
tab:
INFO, DEBUG, WARNING, ERROR. This directive is used as the template for
test-details-search
, per AngularJS popover convention. The function
used to parse the logs, parsePythonLogging
actually lives in the
controller for testDetailsSearch, and is passed through both the prior
directives’ scopes. This function reads in the pythonLogging
tab
as one text object, then splits it by \n
to create an array of
lines. Each line is then added back to the pythonLogging
tab if it
contains the specific log level somewhere in the line.timelineDetails
timelineDstat
timelineOverview
timelineSearch
timelineViewport
The dataset service is an API that provides the front-end with all of the
data generated by stackviz-export
. All data processed by
stackviz-export
ends up in the ./app/data/ directory to be called
by dataset service with $http
and $q
directives. Below is
the list of calls:
list
returns config.json using GET.get(id)
calls list
, then iterates through all the
available datasets for the requested id number. Rejects if not found.raw(dataset)
returns <dataset>_raw.json file using GET.details(dataset)
returns <dataset>_details.json file using GET.tree(dataset)
returns <dataset>_tree.json file using GET.dstat(dataset)
returns dstat_log.csv file using GET, if available.nprogress
, a progress bar library. Used in the timeline
and test details pages to show progress in loading datasets.Except where otherwise noted, this document is licensed under Creative Commons Attribution 3.0 License. See all OpenStack Legal Documents.