| <!DOCTYPE html> |
| <html> |
| <head> |
| <title>Speedometer 2.0 Interactive Runner</title> |
| <script src="../Speedometer/resources/benchmark-runner.js" defer></script> |
| <script src="resources/style-bench.js" defer></script> |
| <script src="resources/tests.js" defer></script> |
| <style> |
| iframe { border: 1px solid black; } |
| ol { list-style: none; margin: 0; padding: 0; } |
| ol ol { margin-left: 2em; list-position: outside; } |
| .running { text-decoration: underline; } |
| .ran { color: grey; } |
| nav { position: absolute; right: 10px; height: 600px; } |
| nav > ol { height: 100%; overflow-y: scroll; } |
| </style> |
| </head> |
| <body> |
| <script> |
| |
| function formatTestName(suiteName, testName) { |
| return suiteName + (testName ? '/' + testName : ''); |
| } |
| |
| function createUIForSuites(suites, onstep, onrun) { |
| var control = document.createElement('nav'); |
| var ol = document.createElement('ol'); |
| var checkboxes = []; |
| for (var suiteIndex = 0; suiteIndex < suites.length; suiteIndex++) { |
| var suite = suites[suiteIndex]; |
| var li = document.createElement('li'); |
| var checkbox = document.createElement('input'); |
| checkbox.id = suite.name; |
| checkbox.type = 'checkbox'; |
| checkbox.checked = !suite.disabled; |
| checkbox.onchange = (function (suite, checkbox) { return function () { suite.disabled = !checkbox.checked; } })(suite, checkbox); |
| checkbox.onchange(); |
| checkboxes.push(checkbox); |
| |
| li.appendChild(checkbox); |
| var label = document.createElement('label'); |
| label.appendChild(document.createTextNode(formatTestName(suite.name))); |
| li.appendChild(label); |
| label.htmlFor = checkbox.id; |
| |
| var testList = document.createElement('ol'); |
| for (var testIndex = 0; testIndex < suite.tests.length; testIndex++) { |
| var testItem = document.createElement('li'); |
| var test = suite.tests[testIndex]; |
| var anchor = document.createElement('a'); |
| anchor.id = suite.name + '-' + test.name; |
| test.anchor = anchor; |
| anchor.appendChild(document.createTextNode(formatTestName(suite.name, test.name))); |
| testItem.appendChild(anchor); |
| testList.appendChild(testItem); |
| } |
| li.appendChild(testList); |
| |
| ol.appendChild(li); |
| } |
| |
| control.appendChild(ol); |
| |
| var button = document.createElement('button'); |
| button.textContent = 'Step'; |
| button.onclick = onstep; |
| control.appendChild(button); |
| |
| var button = document.createElement('button'); |
| button.textContent = 'Run'; |
| button.id = 'runSuites'; |
| button.onclick = onrun; |
| control.appendChild(button); |
| |
| var button = document.createElement('button'); |
| button.textContent = 'Select all'; |
| button.onclick = function () { |
| for (var suiteIndex = 0; suiteIndex < suites.length; suiteIndex++) { |
| suites[suiteIndex].disabled = false; |
| checkboxes[suiteIndex].checked = true; |
| } |
| }; |
| control.appendChild(button); |
| |
| var button = document.createElement('button'); |
| button.textContent = 'Unselect all'; |
| button.onclick = function () { |
| for (var suiteIndex = 0; suiteIndex < suites.length; suiteIndex++) { |
| suites[suiteIndex].disabled = true; |
| checkboxes[suiteIndex].checked = false; |
| } |
| |
| }; |
| control.appendChild(button); |
| |
| return control; |
| } |
| |
| var parseQueryString = (function (pairList) { |
| var pairs = {}; |
| for (var i = 0; i < pairList.length; ++i) { |
| var keyValue = pairList[i].split('=', 2); |
| if (keyValue.length == 1) |
| pairs[keyValue[0]] = ''; |
| else |
| pairs[keyValue[0]] = decodeURIComponent(keyValue[1].replace(/\+/g, ' ')); |
| } |
| return pairs; |
| })(window.location.search.substr(1).split('&')); |
| |
| function disableAllSuitesExcept(suiteName) { |
| Suites.forEach(function(element) { |
| if (element.name !== suiteName) |
| element.disabled = true; |
| }); |
| } |
| |
| function startTest() { |
| var queryParam = parseQueryString['suite']; |
| if (queryParam !== undefined) |
| disableAllSuitesExcept(queryParam); |
| |
| var runner = new BenchmarkRunner(Suites, { |
| willRunTest: function (suite, test) { |
| test.anchor.classList.add('running'); |
| }, |
| didRunTest: function (suite, test) { |
| var classList = test.anchor.classList; |
| classList.remove('running'); |
| classList.add('ran'); |
| }, |
| didRunSuites: function (measuredValues) { |
| var results = ''; |
| for (var suiteName in measuredValues.tests) { |
| var suiteResults = measuredValues.tests[suiteName]; |
| for (var testName in suiteResults.tests) { |
| var testResults = suiteResults.tests[testName]; |
| for (var subtestName in testResults.tests) { |
| results += suiteName + ' : ' + testName + ' : ' + subtestName |
| + ': ' + testResults.tests[subtestName] + ' ms\n'; |
| } |
| } |
| results += suiteName + ' : ' + suiteResults.total + ' ms\n'; |
| } |
| results += 'Arithmetic Mean : ' + measuredValues.mean + ' ms\n'; |
| results += 'Geometric Mean : ' + measuredValues.geomean + ' ms\n'; |
| results += 'Total : ' + measuredValues.total + ' ms\n'; |
| results += 'Score : ' + measuredValues.score + ' rpm\n'; |
| |
| if (!results) |
| return; |
| |
| var pre = document.createElement('pre'); |
| document.body.appendChild(pre); |
| pre.textContent = results; |
| } |
| }); |
| |
| var currentState = null; |
| |
| // Don't call step while step is already executing. |
| document.body.appendChild(createUIForSuites(Suites, |
| function () { runner.step(currentState).then(function (state) { currentState = state; }); }, |
| function () { runner.runAllSteps(currentState); currentState = null; })); |
| |
| if (parseQueryString['startAutomatically'] !== undefined) |
| document.getElementById('runSuites').click(); |
| } |
| |
| window.addEventListener('load', startTest); |
| |
| </script> |
| </body> |
| </html> |
