diff options
author | Young Gyu Park <younggyu@google.com> | 2018-09-14 11:09:22 +0900 |
---|---|---|
committer | Young Gyu Park <younggyu@google.com> | 2018-09-20 12:33:48 +0900 |
commit | 313a184588d29a6e8b255c3898500c87b7ffeab1 (patch) | |
tree | a00a1f3ede2c0a3c627691d578b58e4bba055bc5 /src/main/webapp/WEB-INF/jsp/show_coverage_overview.jsp | |
parent | 470efe29023b9fed64ba724088ada9231fb397b9 (diff) | |
download | dashboard-313a184588d29a6e8b255c3898500c87b7ffeab1.tar.gz |
Adding front end code for code coverage bug fix
Test: go/vts-web-staging
Bug: 113356010
Change-Id: I6b52c6f1e38435262beaed6eda1fdb94e54363c3
Diffstat (limited to 'src/main/webapp/WEB-INF/jsp/show_coverage_overview.jsp')
-rw-r--r-- | src/main/webapp/WEB-INF/jsp/show_coverage_overview.jsp | 123 |
1 files changed, 117 insertions, 6 deletions
diff --git a/src/main/webapp/WEB-INF/jsp/show_coverage_overview.jsp b/src/main/webapp/WEB-INF/jsp/show_coverage_overview.jsp index 9c85618..7d4e32a 100644 --- a/src/main/webapp/WEB-INF/jsp/show_coverage_overview.jsp +++ b/src/main/webapp/WEB-INF/jsp/show_coverage_overview.jsp @@ -15,7 +15,8 @@ --%> <%@ page contentType='text/html;charset=UTF-8' language='java' %> <%@ taglib prefix='fn' uri='http://java.sun.com/jsp/jstl/functions' %> -<%@ taglib prefix='c' uri='http://java.sun.com/jsp/jstl/core'%> +<%@ taglib prefix='c' uri='http://java.sun.com/jsp/jstl/core' %> +<%@ taglib prefix='fmt' uri='http://java.sun.com/jsp/jstl/fmt' %> <html> <!-- <link rel='stylesheet' href='/css/dashboard_main.css'> --> @@ -26,7 +27,7 @@ <script type='text/javascript' src='https://www.gstatic.com/charts/loader.js'></script> <script src='https://www.gstatic.com/external_hosted/moment/min/moment-with-locales.min.js'></script> <script src='js/time.js'></script> - <script src='js/test_results.js'></script> + <script src='js/common.js'></script> <script src='js/search_header.js'></script> <script type='text/javascript'> google.charts.load('current', {'packages':['table', 'corechart']}); @@ -36,7 +37,7 @@ var search; $(document).ready(function() { - $('#test-results-container').showTests(${testRuns}, true); + // $('#test-results-container').showTests(${testRuns}, true); search = $('#filter-bar').createSearchHeader('Code Coverage', '', refresh); search.addFilter('Branch', 'branch', { corpus: ${branches} @@ -189,6 +190,56 @@ var tableChart = new google.visualization.Table(document.getElementById('coverage_table_chart_div')); tableChart.draw(data, tableOptions); } + + $('.collapsible').collapsible({ + accordion: false, + onOpen: function(el) { + var header = $( el[0].children[0] ); + var body = $( el[0].children[1] ); + var icon = header.children('.material-icons.expand-arrow'); + var testName = header.data('test'); + var timestamp = header.data('time'); + var url = '/api/test_run?test=' + testName + '×tamp=' + timestamp; + $.get(url).done(function(data) { + displayTestDetails(body, data, 16); + }).fail(function() { + icon.removeClass('rotate'); + }).always(function() { + header.removeClass('disabled'); + }); + }, // Callback for Collapsible open + onClose: function(el) { + console.log(el); + var body = $( el[0].children[1] ); + body.empty(); + } // Callback for Collapsible close + }); + + $( "span.indicator.badge:contains('Coverage')" ).click(function (evt) { + var header = $(evt.currentTarget.parentElement); + var testName = header.data('test'); + var startTime = header.data('time'); + var url = '/show_coverage?testName=' + testName + '&startTime=' + startTime; + window.location.href = url; + return false; + }); + + $( "span.indicator.badge:contains('Links')" ).click(function (evt) { + var header = $(evt.currentTarget.parentElement); + var logLinks = header.data('links'); + showLinks($('body'), logLinks); + return false; + }); + + $( "span.indicator.badge:contains('Graph')" ).click(function (evt) { + var header = $(evt.currentTarget.parentElement); + var testname = header.data('test'); + $('#coverageModalGraph').data("testname", testname); + $('#coverageModalGraph').modal('open'); + $(evt.target).removeClass("grey"); + $(evt.target).addClass("blue"); + return false; + }); }); // draw test statistics chart @@ -244,7 +295,6 @@ var data = google.visualization.arrayToDataTable(rows); - var optionsRaw = { is3D: false, colors: colors, @@ -327,10 +377,60 @@ </div> </div> </div> - <div class='col s12' id='test-results-container'></div> + <div class='col s12' id='test-results-container'> + <ul class="collapsible popout test-runs" data-collapsible="expandable"> + <c:forEach var="testRunEntity" items="${testRunEntityList}" varStatus="loop"> + <li class="test-run-container"> + <div data-test="<c:out value="${testRunEntity.testName}" />" data-time="<c:out value="${testRunEntity.startTimestamp}" />" data-links='${testRunEntity.jsonLogLinks}' class="collapsible-header test-run"> + <span class="test-run-metadata"> + <span class="test-run-label"> + <c:out value="${testRunEntity.testName}" /> + </span> + <br /> + <b>VTS Build: </b><c:out value="${testRunEntity.testBuildId}" /> + <br /> + <b>Host: </b><c:out value="${testRunEntity.hostName}" /> + <br /> + <c:out value="${testRunEntity.startDateTime}" /> - <c:out value="${testRunEntity.endDateTime}" />+0900 (<c:out value="${(testRunEntity.endTimestamp - testRunEntity.startTimestamp) / 1000}" />s) + </span> + <span class="indicator badge green" style="color: white;"> + <c:out value="${testRunEntity.passCount}" />/<c:out value="${testRunEntity.passCount + testRunEntity.passCount}" /> + </span> + + <c:set var="coveredLineCnt" value="${codeCoverageEntityMap[testRunEntity.id].coveredLineCount}" /> + <c:set var="totalLineCnt" value="${codeCoverageEntityMap[testRunEntity.id].totalLineCount}" /> + <c:set var="covPct" + value="${(coveredLineCnt / totalLineCnt * 1000) / 10}"/> + + <c:choose> + <c:when test = "${covPct <= 20}"> + <c:set var="badgeColor" value="green" /> + </c:when> + <c:when test = "${covPct >= 70}"> + <c:set var="badgeColor" value="yellow" /> + </c:when> + <c:otherwise> + <c:set var="badgeColor" value="orange" /> + </c:otherwise> + </c:choose> + + <span class="indicator badge padded hoverable waves-effect <c:out value="${badgeColor}" />" style="color: white; margin-left: 1px;"> + Coverage: <c:out value="${coveredLineCnt}" />/<c:out value="${totalLineCnt}" /> + (<fmt:formatNumber value="${(coveredLineCnt / totalLineCnt * 1000) / 10}" type="number" pattern="#.##"/>%) + </span> + <span class="indicator badge padded hoverable waves-effect grey lighten-1" style="color: white; margin-left: 1px;">Links</span> + <span class="indicator badge padded hoverable waves-effect grey lighten-1" style="color: white; margin-left: 1px;">Graph</span> + <i class="material-icons expand-arrow">expand_more</i> + </div> + <div class="collapsible-body test-results row"></div> + </li> + </c:forEach> + </ul> + + </div> </div> - <!-- Modal Structure --> + <!-- Coverage Graph Modal Structure --> <div id="coverageModalGraph" class="modal modal-fixed-footer" style="width: 75%;"> <div class="modal-content"> <h4 id="coverageModalTitle">Code Coverage Chart</h4> @@ -360,6 +460,17 @@ </div> </div> + <!-- Link Modal Structure --> + <div id="info-modal" class="modal modal-fixed-footer"> + <div class="modal-content"> + <h4>Links</h4> + <div class="info-container"></div> + </div> + <div class="modal-footer"> + <a class="btn-flat modal-close">Close</a> + </div> + </div> + <%@ include file="footer.jsp" %> </body> </html> |