Cleanup: Move js for treemap and aggregate_results into own js files.
[WebKit-https.git] / Tools / TestResultServer / static-dashboards / treemap.js
1 // Copyright (C) 2013 Google Inc. All rights reserved.
2 //
3 // Redistribution and use in source and binary forms, with or without
4 // modification, are permitted provided that the following conditions are
5 // met:
6 //
7 //     * Redistributions of source code must retain the above copyright
8 // notice, this list of conditions and the following disclaimer.
9 //     * Redistributions in binary form must reproduce the above
10 // copyright notice, this list of conditions and the following disclaimer
11 // in the documentation and/or other materials provided with the
12 // distribution.
13 //     * Neither the name of Google Inc. nor the names of its
14 // contributors may be used to endorse or promote products derived from
15 // this software without specific prior written permission.
16 //
17 // THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
18 // "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
19 // LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
20 // A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
21 // OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
22 // SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
23 // LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
24 // DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
25 // THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
26 // (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
27 // OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
28
29 var TEST_URL_BASE_PATH = "http://svn.webkit.org/repository/webkit/trunk/";
30
31 function humanReadableTime(milliseconds)
32 {
33     if (milliseconds < 1000)
34         return Math.floor(milliseconds) + 'ms';
35     else if (milliseconds < 60000)
36         return (milliseconds / 1000).toPrecision(2) + 's';
37
38     var minutes = Math.floor(milliseconds / 60000);
39     var seconds = Math.floor((milliseconds - minutes * 60000) / 1000);
40     return minutes + 'm' + seconds + 's';
41 }
42
43 // This looks like:
44 // { "data": {"$area": (sum of all timings)},
45 //   "name": (name of this node),
46 //   "children": [ (child nodes, in the same format as this) ] }
47 // childCount is added just to be includes in the node's name
48 function convertToWebTreemapFormat(treename, tree, path)
49 {
50     var total = 0;
51     var childCount = 0;
52     var children = [];
53     for (var name in tree) {
54         var treeNode = tree[name];
55         if (typeof treeNode == "number") {
56             var time = treeNode;
57             var node = {
58                 "data": {"$area": time},
59                 "name": name + " (" + humanReadableTime(time) + ")"
60             };
61             children.push(node);
62             total += time;
63             childCount++;
64         } else {
65             var newPath = path ? path + '/' + name : name;
66             var subtree = convertToWebTreemapFormat(name, treeNode, newPath);
67             children.push(subtree);
68             total += subtree["data"]["$area"];
69             childCount += subtree["childCount"];
70         }
71     }
72
73     children.sort(function(a, b) {
74         aTime = a.data["$area"]
75         bTime = b.data["$area"]
76         return bTime - aTime;
77     });
78
79     return {
80         "data": {"$area": total},
81         "name": treename + " (" + humanReadableTime(total) + " - " + childCount + " tests)",
82         "children": children,
83         "childCount": childCount,
84         "path": path
85     };
86 }
87
88 function listOfAllNonLeafNodes(tree, list)
89 {
90     if (!tree.children)
91         return;
92
93     if (!list)
94         list = [];
95     list.push(tree);
96
97     tree.children.forEach(function(child) {
98         listOfAllNonLeafNodes(child, list);
99     });
100     return list;
101 }
102
103 function reverseSortByAverage(list)
104 {
105     list.sort(function(a, b) {
106         var avgA = a.data['$area'] / a.childCount;
107         var avgB = b.data['$area'] / b.childCount;
108         return avgB - avgA;
109     });
110 }
111
112 function showAverages()
113 {
114     if (!document.getElementById('map'))
115         return;
116
117     var table = document.createElement('table');
118     table.innerHTML = '<th>directory</th><th># tests</th><th>avg time / test</th>';
119
120     var allNodes = listOfAllNonLeafNodes(g_webTree);
121     reverseSortByAverage(allNodes);
122     allNodes.forEach(function(node) {
123         var average = node.data['$area'] / node.childCount;
124         if (average > 100 && node.childCount != 1) {
125             var tr = document.createElement('tr');
126             tr.innerHTML = '<td></td><td>' + node.childCount + '</td><td>' + humanReadableTime(average) + '</td>';
127             tr.querySelector('td').innerText = node.path;
128             table.appendChild(tr);
129         }
130     });
131
132     var map = document.getElementById('map');
133     map.parentNode.replaceChild(table, map);
134 }
135
136 var g_isGeneratingPage = false;
137 var g_webTree;
138
139 function generatePage()
140 {
141     $('header-container').innerHTML = ui.html.testTypeSwitcher();
142
143     g_isGeneratingPage = true;
144
145     var rawTree = g_resultsByBuilder[g_currentState.builder || currentBuilderGroup().defaultBuilder()];
146     g_webTree = convertToWebTreemapFormat('LayoutTests', rawTree);
147     appendTreemap($('map'), g_webTree);
148
149     if (g_currentState.treemapfocus)
150         focusPath(g_webTree, g_currentState.treemapfocus)
151
152     g_isGeneratingPage = false;
153 }
154
155 function focusPath(tree, path)
156 {
157     var parts = decodeURIComponent(path).split('/');
158     if (extractName(tree) != parts[0]) {
159         console.error('Could not focus tree rooted at ' + parts[0]);
160         return;
161     }
162
163     for (var i = 1; i < parts.length; i++) {
164         var children = tree.children;
165         for (var j = 0; j < children.length; j++) {
166             var child = children[j];
167             if (extractName(child) == parts[i]) {
168                 tree = child;
169                 focus(tree);
170                 break;
171             }
172         }
173         if (j == children.length) {
174             console.error('Could not find tree at ' + parts[i]);
175             break;
176         }
177     }
178
179 }
180
181 function handleValidHashParameter(key, value)
182 {
183     switch(key) {
184     case 'builder':
185         validateParameter(g_currentState, key, value,
186             function() { return value in currentBuilders(); });
187         return true;
188
189     case 'treemapfocus':
190         validateParameter(g_currentState, key, value,
191             function() {
192                 // FIXME: There's probably a simpler regexp here. Just trying to match ascii + forward-slash.
193                 // e.g. LayoutTests/foo/bar.html
194                 return (value.match(/^(\w+\/\w*)*$/));
195             });
196         return true;
197
198     default:
199         return false;
200     }
201 }
202
203 g_defaultDashboardSpecificStateValues = {
204     builder: null,
205     treemapfocus: '',
206 };
207
208 DB_SPECIFIC_INVALIDATING_PARAMETERS = {
209     'testType': 'builder',
210     'group': 'builder'
211 };
212
213 function handleQueryParameterChange(params)
214 {
215     for (var param in params) {
216         if (param != 'treemapfocus') {
217             $('map').innerHTML = 'Loading...';
218             return true;
219         }
220     }
221     return false;
222 }
223
224 function extractName(node)
225 {
226     return node.name.split(' ')[0];
227 }
228
229 function fullName(node)
230 {
231     var buffer = [extractName(node)];
232     while (node.parent) {
233         node = node.parent;
234         buffer.unshift(extractName(node));
235     }
236     return buffer.join('/');
237 }
238
239 function handleFocus(tree)
240 {
241     var currentlyFocusedNode = $('focused-leaf');
242     if (currentlyFocusedNode)
243         currentlyFocusedNode.id = '';
244
245     if (!tree.children)
246         tree.dom.id = 'focused-leaf';
247
248     var name = fullName(tree);
249
250     if (!tree.children && !tree.extraDom && isLayoutTestResults()) {
251         tree.extraDom = document.createElement('pre');
252         tree.extraDom.className = 'extra-dom';
253         tree.dom.appendChild(tree.extraDom);
254
255         loader.request(TEST_URL_BASE_PATH + name,
256             function(xhr) {
257                 tree.extraDom.onmousedown = function(e) {
258                     e.stopPropagation();
259                 };
260                 tree.extraDom.textContent = xhr.responseText;
261             },
262             function (xhr) {
263                 tree.extraDom.textContent = "Could not load test."
264         });
265     }
266
267     // We don't want the focus calls during generatePage to try to modify the query state.
268     if (!g_isGeneratingPage)
269         setQueryParameter('treemapfocus', name);
270 }
271
272 window.addEventListener('load', function() {
273     var resourceLoader = new loader.Loader(intializeHistory);
274     resourceLoader.load();
275 }, false);