Merge pull request #4106 from jaredevantabor/job-result-time-badge

Job result time badge
This commit is contained in:
Jared Tabor 2016-11-23 14:16:29 -08:00 committed by GitHub
commit e4510f4e64
3 changed files with 72 additions and 25 deletions

View File

@ -127,3 +127,16 @@
height: inherit;
}
}
.JobResults-timeBadge {
float:right;
font-size: 11px;
font-weight: normal;
padding: 1px 10px;
height: 14px;
margin: 3px 15px;
width: 80px;
background-color: @default-bg;
border-radius: 5px;
color: @default-interface-txt;
}

View File

@ -4,7 +4,7 @@
* All Rights Reserved
*************************************************/
export default ['$log', function($log){
export default ['$log', 'moment', function($log, moment){
var val = {
// parses stdout string from api and formats various codes to the
// correct dom structure
@ -123,6 +123,27 @@ export default ['$log', function($log){
return string;
},
getStartTimeBadge: function(event, line){
// This will return a div with the badge class
// for the start time to show at the right hand
// side of each stdout header line.
// returns an empty string if not a header line
var emptySpan = "", time;
if ((event.event_name === "playbook_on_play_start" ||
event.event_name === "playbook_on_task_start") &&
line !== "") {
time = moment(event.created).format('HH:mm:ss');
return `<div class="badge JobResults-timeBadge ng-binding">${time}</div>`;
}
else if(event.event_name === "playbook_on_stats" && line.indexOf("PLAY") > -1){
time = moment(event.created).format('HH:mm:ss');
return `<div class="badge JobResults-timeBadge ng-binding">${time}</div>`;
}
else {
return emptySpan;
}
},
// used to add expand/collapse icon next to line numbers of headers
getCollapseIcon: function(event, line) {
var clickClass,
@ -195,7 +216,7 @@ export default ['$log', function($log){
return `
<div class="JobResultsStdOut-aLineOfStdOut${this.getLineClasses(event, lineArr[1], lineArr[0])}">
<div class="JobResultsStdOut-lineNumberColumn">${this.getCollapseIcon(event, lineArr[1])}${lineArr[0]}</div>
<div class="JobResultsStdOut-stdoutColumn">${this.getAnchorTags(event, this.prettify(lineArr[1]))}</div>
<div class="JobResultsStdOut-stdoutColumn">${this.getAnchorTags(event, this.prettify(lineArr[1]))} ${this.getStartTimeBadge(event, lineArr[1] )}</div>
</div>`;
});

View File

@ -33,21 +33,34 @@ describe('parseStdoutService', () => {
});
});
// describe('getLineClasses()', () => {
// xit('creates a string that is used as a class', () => {
// let headerEvent = {
// event_name: 'playbook_on_task_start',
// event_data: {
// play_uuid:"0f667a23-d9ab-4128-a735-80566bcdbca0",
// task_uuid: "80dd087c-268b-45e8-9aab-1083bcfd9364"
// }
// };
// let lineNum = 3;
// let line = "TASK [setup] *******************************************************************";
// let styledLine = " header_task header_task_80dd087c-268b-45e8-9aab-1083bcfd9364 play_0f667a23-d9ab-4128-a735-80566bcdbca0 line_num_3";
// expect(parseStdoutService.getLineClasses(headerEvent, line, lineNum)).toBe(styledLine);
// });
// });
describe('getLineClasses()', () => {
xit('creates a string that is used as a class', () => {
let headerEvent = {
event_name: 'playbook_on_task_start',
event_data: {
play_uuid:"0f667a23-d9ab-4128-a735-80566bcdbca0",
task_uuid: "80dd087c-268b-45e8-9aab-1083bcfd9364"
}
};
let lineNum = 3;
let line = "TASK [setup] *******************************************************************";
let styledLine = " header_task header_task_80dd087c-268b-45e8-9aab-1083bcfd9364 play_0f667a23-d9ab-4128-a735-80566bcdbca0 line_num_3";
expect(parseStdoutService.getLineClasses(headerEvent, line, lineNum)).toBe(styledLine);
});
});
describe('getStartTime()', () => {
xit('creates returns a badge with the start time of the event', () => {
let headerEvent = {
event_name: 'playbook_on_play_start',
created: "2016-11-22T21:15:54.736Z"
};
let line = "PLAY [add hosts to inventory] **************************************************";
let badgeDiv = '<div class="badge JobResults-timeBadge ng-binding">13:15:54</div>';
expect(parseStdoutService.getStartTimeBadge(headerEvent, line)).toBe(badgeDiv);
});
});
describe('getCollapseIcon()', () => {
let emptySpan = `
@ -83,13 +96,7 @@ describe('parseStdoutService', () => {
data-uuid="task_1da9012d-18e6-4562-85cd-83cf10a97f86">
</i>
</span>`;
// `<span class="JobResultsStdOut-lineExpander">
// <i class="JobResultsStdOut-lineExpanderIcon fa fa-caret-down expanderizer
// expanderizer--${expanderizerSpecifier} expanded"
// ng-click="toggleLine($event, '.${clickClass}')"
// data-uuid="${clickClass}">
// </i>
// </span>`
expect(parseStdoutService.getCollapseIcon(headerEvent, line))
.toBe(expandSpan);
});
@ -124,6 +131,8 @@ describe('parseStdoutService', () => {
.returnValue("");
spyOn(parseStdoutService, 'prettify').and
.returnValue("prettified_line");
spyOn(parseStdoutService, 'getStartTimeBadge').and
.returnValue("");
parseStdoutService.parseStdout(mockEvent);
@ -137,6 +146,8 @@ describe('parseStdoutService', () => {
.toHaveBeenCalledWith(mockEvent, "prettified_line");
expect(parseStdoutService.prettify)
.toHaveBeenCalledWith('line1');
expect(parseStdoutService.getStartTimeBadge)
.toHaveBeenCalledWith(mockEvent, 'line1');
// get line arr should be called once for the event
expect(parseStdoutService.getLineArr.calls.count())
@ -165,13 +176,15 @@ describe('parseStdoutService', () => {
.returnValue("anchor_tag_dom");
spyOn(parseStdoutService, 'prettify').and
.returnValue("prettified_line");
spyOn(parseStdoutService, 'getStartTimeBadge').and
.returnValue("");
var returnedString = parseStdoutService.parseStdout(mockEvent);
var expectedString = `
<div class="JobResultsStdOut-aLineOfStdOutline_classes">
<div class="JobResultsStdOut-lineNumberColumn">collapse_icon_dom13</div>
<div class="JobResultsStdOut-stdoutColumn">anchor_tag_dom</div>
<div class="JobResultsStdOut-stdoutColumn">anchor_tag_dom </div>
</div>`;
expect(returnedString).toBe(expectedString);
});