1 <%-- 2 ~ Copyright (c) 2017 Google Inc. All Rights Reserved. 3 ~ 4 ~ Licensed under the Apache License, Version 2.0 (the "License"); you 5 ~ may not use this file except in compliance with the License. You may 6 ~ obtain a copy of the License at 7 ~ 8 ~ http://www.apache.org/licenses/LICENSE-2.0 9 ~ 10 ~ Unless required by applicable law or agreed to in writing, software 11 ~ distributed under the License is distributed on an "AS IS" BASIS, 12 ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or 13 ~ implied. See the License for the specific language governing 14 ~ permissions and limitations under the License. 15 --%> 16 <%@ page contentType='text/html;charset=UTF-8' language='java' %> 17 <%@ taglib prefix='fn' uri='http://java.sun.com/jsp/jstl/functions' %> 18 <%@ taglib prefix='c' uri='http://java.sun.com/jsp/jstl/core'%> 19 20 <html> 21 <!-- <link rel='stylesheet' href='/css/dashboard_main.css'> --> 22 <%@ include file='header.jsp' %> 23 <link type='text/css' href='/css/show_test_runs_common.css' rel='stylesheet'> 24 <link type='text/css' href='/css/test_results.css' rel='stylesheet'> 25 <link rel='stylesheet' href='/css/search_header.css'> 26 <script type='text/javascript' src='https://www.gstatic.com/charts/loader.js'></script> 27 <script src='https://www.gstatic.com/external_hosted/moment/min/moment-with-locales.min.js'></script> 28 <script src='js/time.js'></script> 29 <script src='js/test_results.js'></script> 30 <script src='js/search_header.js'></script> 31 <script type='text/javascript'> 32 google.charts.load('current', {'packages':['table', 'corechart']}); 33 google.charts.setOnLoadCallback(drawStatsChart); 34 google.charts.setOnLoadCallback(drawCoverageCharts); 35 36 var search; 37 38 $(document).ready(function() { 39 $('#test-results-container').showTests(${testRuns}, true); 40 search = $('#filter-bar').createSearchHeader('Code Coverage', '', refresh); 41 search.addFilter('Branch', 'branch', { 42 corpus: ${branches} 43 }, ${branch}); 44 search.addFilter('Device', 'device', { 45 corpus: ${devices} 46 }, ${device}); 47 search.addFilter('Device Build ID', 'deviceBuildId', {}, ${deviceBuildId}); 48 search.addFilter('Test Build ID', 'testBuildId', {}, ${testBuildId}); 49 search.addFilter('Host', 'hostname', {}, ${hostname}); 50 search.addFilter('Passing Count', 'passing', { 51 type: 'number', 52 width: 's2' 53 }, ${passing}); 54 search.addFilter('Non-Passing Count', 'nonpassing', { 55 type: 'number', 56 width: 's2' 57 }, ${nonpassing}); 58 search.addRunTypeCheckboxes(${showPresubmit}, ${showPostsubmit}); 59 search.display(); 60 }); 61 62 // draw test statistics chart 63 function drawStatsChart() { 64 var testStats = ${testStats}; 65 if (testStats.length < 1) { 66 return; 67 } 68 var resultNames = ${resultNamesJson}; 69 var rows = resultNames.map(function(res, i) { 70 nickname = res.replace('TEST_CASE_RESULT_', '').replace('_', ' ') 71 .trim().toLowerCase(); 72 return [nickname, parseInt(testStats[i])]; 73 }); 74 rows.unshift(['Result', 'Count']); 75 76 // Get CSS color definitions (or default to white) 77 var colors = resultNames.map(function(res) { 78 return $('.' + res).css('background-color') || 'white'; 79 }); 80 81 var data = google.visualization.arrayToDataTable(rows); 82 var options = { 83 is3D: false, 84 colors: colors, 85 fontName: 'Roboto', 86 fontSize: '14px', 87 legend: {position: 'labeled'}, 88 tooltip: {showColorCode: true, ignoreBounds: false}, 89 chartArea: {height: '80%', width: '90%'}, 90 pieHole: 0.4 91 }; 92 93 var chart = new google.visualization.PieChart(document.getElementById('pie-chart-stats')); 94 chart.draw(data, options); 95 } 96 97 // draw the coverage pie charts 98 function drawCoverageCharts() { 99 var coveredLines = ${coveredLines}; 100 var uncoveredLines = ${uncoveredLines}; 101 var rows = [ 102 ["Result", "Count"], 103 ["Covered Lines", coveredLines], 104 ["Uncovered Lines", uncoveredLines] 105 ]; 106 107 // Get CSS color definitions (or default to white) 108 var colors = [ 109 $('.TEST_CASE_RESULT_PASS').css('background-color') || 'white', 110 $('.TEST_CASE_RESULT_FAIL').css('background-color') || 'white' 111 ] 112 113 var data = google.visualization.arrayToDataTable(rows); 114 115 116 var optionsRaw = { 117 is3D: false, 118 colors: colors, 119 fontName: 'Roboto', 120 fontSize: '14px', 121 pieSliceText: 'value', 122 legend: {position: 'bottom'}, 123 chartArea: {height: '80%', width: '90%'}, 124 tooltip: {showColorCode: true, ignoreBounds: false, text: 'value'}, 125 pieHole: 0.4 126 }; 127 128 var optionsNormalized = { 129 is3D: false, 130 colors: colors, 131 fontName: 'Roboto', 132 fontSize: '14px', 133 legend: {position: 'bottom'}, 134 tooltip: {showColorCode: true, ignoreBounds: false, text: 'percentage'}, 135 chartArea: {height: '80%', width: '90%'}, 136 pieHole: 0.4 137 }; 138 139 var chart = new google.visualization.PieChart(document.getElementById('pie-chart-coverage-raw')); 140 chart.draw(data, optionsRaw); 141 142 chart = new google.visualization.PieChart(document.getElementById('pie-chart-coverage-normalized')); 143 chart.draw(data, optionsNormalized); 144 } 145 146 // refresh the page to see the runs matching the specified filter 147 function refresh() { 148 var link = '${pageContext.request.contextPath}' + 149 '/show_coverage_overview?' + search.args(); 150 if (${unfiltered}) { 151 link += '&unfiltered='; 152 } 153 window.open(link,'_self'); 154 } 155 156 </script> 157 158 <body> 159 <div class='wide container'> 160 <div id='filter-bar'></div> 161 <div class='row'> 162 <div class='col s12'> 163 <div class='col s12 card center-align'> 164 <div id='legend-wrapper'> 165 <c:forEach items='${resultNames}' var='res'> 166 <div class='center-align legend-entry'> 167 <c:set var='trimmed' value='${fn:replace(res, "TEST_CASE_RESULT_", "")}'/> 168 <c:set var='nickname' value='${fn:replace(trimmed, "_", " ")}'/> 169 <label for='${res}'>${nickname}</label> 170 <div id='${res}' class='${res} legend-bubble'></div> 171 </div> 172 </c:forEach> 173 </div> 174 </div> 175 </div> 176 <div class='col s4 valign-wrapper'> 177 <!-- pie chart --> 178 <div class='pie-chart-wrapper col s12 valign center-align card'> 179 <h6 class='pie-chart-title'>Test Statistics</h6> 180 <div id='pie-chart-stats' class='pie-chart-div'></div> 181 </div> 182 </div> 183 <div class='col s4 valign-wrapper'> 184 <!-- pie chart --> 185 <div class='pie-chart-wrapper col s12 valign center-align card'> 186 <h6 class='pie-chart-title'>Line Coverage (Raw)</h6> 187 <div id='pie-chart-coverage-raw' class='pie-chart-div'></div> 188 </div> 189 </div> 190 <div class='col s4 valign-wrapper'> 191 <!-- pie chart --> 192 <div class='pie-chart-wrapper col s12 valign center-align card'> 193 <h6 class='pie-chart-title'>Line Coverage (Normalized)</h6> 194 <div id='pie-chart-coverage-normalized' class='pie-chart-div'></div> 195 </div> 196 </div> 197 </div> 198 <div class='col s12' id='test-results-container'> 199 </div> 200 </div> 201 <%@ include file="footer.jsp" %> 202 </body> 203 </html> 204
