Skip to content

Commit

Permalink
Add execution summary stats to the flight evaluation report (#393)
Browse files Browse the repository at this point in the history
- Creates new header subsection for summary view
- Adds new line to header displaying total duration of the execution
- Adds new tests
- Removes one-liner summary from footer

Resolves #388
{minor}

Signed-off-by: Esta Nagy <[email protected]>
  • Loading branch information
nagyesta authored Jul 1, 2023
1 parent 094b240 commit 535acda
Show file tree
Hide file tree
Showing 16 changed files with 467 additions and 169 deletions.
1 change: 1 addition & 0 deletions mission-report/flight-evaluation-report/node/Gruntfile.js
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,7 @@ module.exports = function (grunt) {
'../build/html-view/css/raw/30-layout-common.css': 'css/30-layout-common.scss',
'../build/html-view/css/raw/35-layout-log-view.css': 'css/35-layout-log-view.scss',
'../build/html-view/css/raw/40-layout-overview.css': 'css/40-layout-overview.scss',
'../build/html-view/css/raw/45-layout-summary.css': 'css/45-layout-summary.scss',
'../build/html-view/css/raw/50-theme-toggle.css': 'css/50-theme-toggle.scss',
'../build/html-view/css/raw/60-print.css': 'css/60-print.scss',
}
Expand Down
36 changes: 36 additions & 0 deletions mission-report/flight-evaluation-report/node/css/20-colors.scss
Original file line number Diff line number Diff line change
Expand Up @@ -195,6 +195,24 @@ body.light {
}
}
}

.summary-view {
.summary-success {
color: $light-text-color-success-prominent;
}

.summary-failure {
color: $light-text-color-failure;
}

.summary-abort {
color: $light-text-color-abort;
}

.summary-suppress {
color: $light-text-color-suppressed;
}
}
}

body.dark {
Expand Down Expand Up @@ -429,4 +447,22 @@ body.dark {
}
}
}

.summary-view {
.summary-success {
color: $dark-text-color-success-prominent;
}

.summary-failure {
color: $dark-text-color-failure;
}

.summary-abort {
color: $dark-text-color-abort;
}

.summary-suppress {
color: $dark-text-color-suppressed;
}
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -16,11 +16,6 @@
border: 2px solid;
}

.total-stats {
padding-top: $padding-large;
padding-bottom: $padding-large;
}

.filter-module {
display: block;
vertical-align: top;
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,107 @@
@import "01-variables";

body .root-container .summary-view {
position: relative;
margin-bottom: $padding-xl;

.result-summary {
margin-left: auto;
margin-right: auto;
}

.col-sum-time,
.col-sum-count,
.col-sum-name {
text-align: center;
}
}

@media only screen and (max-width: $break-point-medium-screen-width-max) {
body .root-container {
$root-width: $break-point-medium-root-width;
$exec-time-width: calc($root-width / 8);
$exec-stat-width: calc($root-width / 12);
$exec-title-width: calc($root-width / 8);

.summary-view {

.col-sum-name, .summary-name {
width: $exec-title-width;
max-width: $exec-title-width;
padding: $padding-normal 0 $padding-normal $padding-normal;
}

.col-sum-time, .sum-time {
width: $exec-time-width;
max-width: $exec-time-width;
padding: $padding-normal 0;
}

.col-sum-count, .sum-stat {
width: $exec-stat-width;
max-width: $exec-stat-width;
padding: $padding-normal 0;
}
}
}
}

@media only screen and (min-width: $break-point-large-screen-width-min) and (max-width: $break-point-large-screen-width-max) {
body .root-container {
$root-width: $break-point-large-root-width;
$exec-time-width: calc($root-width / 14);
$exec-stat-width: calc($root-width / 18);
$exec-title-width: calc($root-width / 14);

.summary-view {

.col-sum-name, .summary-name {
width: $exec-title-width;
max-width: $exec-title-width;
padding: $padding-normal 0 $padding-normal $padding-normal;
}

.col-sum-time, .sum-time {
width: $exec-time-width;
max-width: $exec-time-width;
padding: $padding-normal 0;
}

.col-sum-count, .sum-stat {
width: $exec-stat-width;
max-width: $exec-stat-width;
padding: $padding-normal 0;
}
}
}
}

@media only screen and (min-width: $break-point-xl-screen-width-min) {
body .root-container {
$root-width: $break-point-xl-root-width;
$exec-time-width: calc($root-width / 15);
$exec-stat-width: calc($root-width / 20);
$exec-title-width: calc($root-width / 15);

.summary-view {

.col-sum-name, .summary-name {
width: $exec-title-width;
max-width: $exec-title-width;
padding: $padding-normal 0 $padding-normal $padding-normal;
}

.col-sum-time, .sum-time {
width: $exec-time-width;
max-width: $exec-time-width;
padding: $padding-normal 0;
}

.col-sum-count, .sum-stat {
width: $exec-stat-width;
max-width: $exec-stat-width;
padding: $padding-normal 0;
}
}
}
}
2 changes: 1 addition & 1 deletion mission-report/flight-evaluation-report/node/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,7 @@
}
}
},
"author": "Istvan zoltan Nagy <[email protected]>",
"author": "Istvan Zoltan Nagy <[email protected]>",
"license": "MIT",
"devDependencies": {
"@jest/globals": "^29.5.0",
Expand Down
49 changes: 42 additions & 7 deletions mission-report/flight-evaluation-report/node/report.html
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,48 @@ <h1 class="header center">Loading telemetry...</h1>
</a>
</div>
<p class="header">Countdown started: <span data-bind="text: testStart"></span></p>
<p class="header header-last">Mission concluded: <span data-bind="text: testEnd"></span></p>
<p class="header">Mission concluded: <span data-bind="text: testEnd"></span></p>
<p class="header header-last">Total execution time: <span data-bind="html: getTotalRunTime()"></span></p>
<!-- ko with: summaryView -->
<div id="summary-view" class="summary-view">
<table class="result-summary">
<thead>
<tr>
<th class="col-sum-name" title="Result name"></th>
<th class="col-sum-count" title="Count">Count</th>
<th class="col-sum-time" title="Execution time">Exec. time</th>
<th class="col-sum-count" title="Minimum">Minimum</th>
<th class="col-sum-count" title="Average">Average</th>
<th class="col-sum-count" title="Maximum">Maximum</th>
</tr>
</thead>
<tbody>
<!-- ko foreach: results -->
<tr data-bind="if: $data.total.runs > 0">
<td colspan="1" class="summary-name" data-bind="text: name, attr: {title: name}, class: 'summary-' + name.toLowerCase()"></td>
<!-- ko with: total, as: 'd' -->
<td colspan="1" class="center sum-stat sum-count" data-bind="text: d.runs"></td>
<td colspan="1" class="center sum-time sum-total" data-bind="html: d.totalSum()"></td>
<td colspan="1" class="center sum-stat sum-min" data-bind="html: d.minimum()"></td>
<td colspan="1" class="center sum-stat sum-avg" data-bind="html: d.average()"></td>
<td colspan="1" class="center sum-stat sum-max" data-bind="html: d.maximum()"></td>
<!-- /ko -->
</tr>
<!-- /ko -->
<tr class="top-row">
<td colspan="1" class="summary-name" data-bind="text: 'Total', attr: {title: 'Total'}"></td>
<!-- ko with: summary, as: 'd' -->
<td colspan="1" class="center sum-stat sum-count" data-bind="text: d.runs"></td>
<td colspan="1" class="center sum-stat sum-time sum-total" data-bind="html: d.totalSum()"></td>
<td colspan="1" class="center sum-stat sum-min" data-bind="html: d.minimum()"></td>
<td colspan="1" class="center sum-stat sum-avg" data-bind="html: d.average()"></td>
<td colspan="1" class="center sum-stat sum-max" data-bind="html: d.maximum()"></td>
<!-- /ko -->
</tr>
</tbody>
</table>
</div>
<!-- /ko -->
<div class="filter-module">
<div class="filter-inputs" data-bind="with: filter">
<label for="filter-box" class="filter-button">
Expand Down Expand Up @@ -350,12 +391,6 @@ <h2>Event log</h2>
</tr>
</tbody>
</table>
<div class="total-stats center">
<span data-bind="text: 'Total success: ' + resultCounts.success"></span> / <span
data-bind="text: 'Total failure: ' + resultCounts.failure"></span> / <span
data-bind="text: 'Total abort: ' + resultCounts.abort"></span> / <span
data-bind="text: 'Total suppressed: ' + resultCounts.suppressed"></span>
</div>
</div>
</div>
<p class="footer center">Thank you for trusting Abort-Mission with your launch!</p>
Expand Down
12 changes: 9 additions & 3 deletions mission-report/flight-evaluation-report/node/src/app.js
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,8 @@ const {TestRunModel} = require('../src/test-run-model');
const {LogViewTimelineModel} = require('../src/log-view-timeline-model');
const {TestRunFilter} = require('../src/filter');
const {DetailViewModel} = require('../src/detail-view-model');
const {formatDuration} = require('../src/stat-model');
const {SummaryViewModel} = require('../src/summary-view-model');

class FlightEvaluationReportInitializer {

Expand Down Expand Up @@ -61,8 +63,7 @@ class FlightEvaluationReportInitializer {

addRun(run) {
this.rootModel.runs.push(run);
const result = run.result.toLowerCase();
this.rootModel.resultCounts[result] = (this.rootModel.resultCounts[result] || 0) + 1;
this.rootModel.summaryView.addRun(run);
}

initStaticData() {
Expand Down Expand Up @@ -129,7 +130,7 @@ class FlightEvaluationReportModel {
this.results = [];
this.allRules = [];
this.runs = [];
this.resultCounts = {success: 0, failure: 0, abort: 0, suppressed: 0};
this.summaryView = new SummaryViewModel(this);
this.logViewTimeline = new LogViewTimelineModel(this);
this.detailView = new DetailViewModel(this);
this.filter = new TestRunFilter(this);
Expand Down Expand Up @@ -192,6 +193,11 @@ class FlightEvaluationReportModel {
return this.runs.length > 0 ? this.runs[this.runs.length - 1].end : null;
}

getTotalRunTime() {
const duration = this.runs.length > 0 ? this.getLastEndDate() - this.getFirstStartDate() : null;
return formatDuration(duration, 2);
}

testStart = ko.pureComputed(function () {
return this.convertToDateTimeString(this.getFirstStartDate());
}, this);
Expand Down
Loading

0 comments on commit 535acda

Please sign in to comment.