OLD | NEW |
(Empty) | |
| 1 <!-- |
| 2 Copyright (c) 2011 Mozilla Foundation. All rights reserved. |
| 3 Use of this source code is governed by a BSD-style license that can be |
| 4 found in the LICENSE file. |
| 5 --> |
| 6 <!DOCTYPE html> |
| 7 <html> |
| 8 <head> |
| 9 <meta charset="utf-8"> |
| 10 <title>WebGL Conformance Tests</title> |
| 11 <style> |
| 12 html, body { |
| 13 border: 0; |
| 14 margin: 0; |
| 15 height: 100%; |
| 16 height: 100%; |
| 17 text-align: center; |
| 18 font-family: monospace; |
| 19 } |
| 20 table { |
| 21 width: 100%; |
| 22 height: 100%; |
| 23 } |
| 24 .timeout { } |
| 25 .success { } |
| 26 .fail { } |
| 27 .testpage { border: 1px solid black; background-color: #ccc; } |
| 28 .testpagesuccess { border: 1px solid black; background-color: #8F8; } |
| 29 .testpagefail { border: 1px solid black; background-color: #F88; } |
| 30 .testpagetimeout { border: 1px solid black; background-color: #FC8; } |
| 31 .nowebgl { font-weight: bold; color: red; } |
| 32 #error-wrap { |
| 33 float: left; |
| 34 position: relative; |
| 35 left: 50%; |
| 36 } |
| 37 #error { |
| 38 color: red; |
| 39 float: left; |
| 40 position: relative; |
| 41 left: -50%; |
| 42 text-align: left; |
| 43 } |
| 44 ul { |
| 45 list-style: none; |
| 46 padding-left: 1em; |
| 47 } |
| 48 </style> |
| 49 <script type="text/javascript" src="resources/webgl-test-harness.js"></script> |
| 50 <script> |
| 51 var CONFORMANCE_TEST_VERSION = "1.0.1 (beta)"; |
| 52 |
| 53 var OPTIONS = { |
| 54 version: CONFORMANCE_TEST_VERSION |
| 55 }; |
| 56 |
| 57 function start() { |
| 58 |
| 59 function log(msg) { |
| 60 if (window.console && window.console.log) { |
| 61 window.console.log(msg); |
| 62 } |
| 63 } |
| 64 |
| 65 function create3DContext(canvas) |
| 66 { |
| 67 if (!canvas) { |
| 68 canvas = document.createElement("canvas"); |
| 69 } |
| 70 var context = null; |
| 71 try { |
| 72 context = canvas.getContext("webgl"); |
| 73 } catch(e) { |
| 74 } |
| 75 if (!context) { |
| 76 try { |
| 77 context = canvas.getContext("experimental-webgl"); |
| 78 } catch(e) { |
| 79 } |
| 80 } |
| 81 return context; |
| 82 } |
| 83 |
| 84 var reportType = WebGLTestHarnessModule.TestHarness.reportType; |
| 85 |
| 86 var Page = function(reporter, folder, testIndex, url) { |
| 87 this.reporter = reporter; |
| 88 this.folder = folder; |
| 89 this.url = url; |
| 90 this.totalTests = 0; |
| 91 this.totalSuccessful = 0; |
| 92 this.totalTimeouts = 0; |
| 93 this.testIndex = testIndex; |
| 94 |
| 95 var li = reporter.localDoc.createElement('li'); |
| 96 var div = reporter.localDoc.createElement('div'); |
| 97 var check = reporter.localDoc.createElement('input'); |
| 98 check.type = 'checkbox'; |
| 99 check.checked = true; |
| 100 div.appendChild(check); |
| 101 var button = reporter.localDoc.createElement('input'); |
| 102 button.type = 'button'; |
| 103 button.value = 'run'; |
| 104 button.onclick = function() { |
| 105 reporter.runTest(url); |
| 106 }; |
| 107 if (reporter.noWebGL) { |
| 108 button.disabled = true; |
| 109 } |
| 110 div.appendChild(button); |
| 111 var a = reporter.localDoc.createElement('a'); |
| 112 a.href = url; |
| 113 a.target = "_blank"; |
| 114 var node = reporter.localDoc.createTextNode(url); |
| 115 a.appendChild(node); |
| 116 div.appendChild(a); |
| 117 li.setAttribute('class', 'testpage'); |
| 118 li.appendChild(div); |
| 119 var ul = reporter.localDoc.createElement('ul'); |
| 120 var node = reporter.localDoc.createTextNode(''); |
| 121 li.appendChild(ul); |
| 122 div.appendChild(node); |
| 123 this.totalsElem = node; |
| 124 this.resultElem = ul; |
| 125 this.elem = li; |
| 126 this.check = check; |
| 127 }; |
| 128 |
| 129 Page.prototype.addResult = function(msg, success) { |
| 130 ++this.totalTests; |
| 131 if (success === undefined) { |
| 132 ++this.totalTimeouts; |
| 133 var result = "timeout"; |
| 134 var css = "timeout"; |
| 135 } else if (success) { |
| 136 ++this.totalSuccessful; |
| 137 var result = "success"; |
| 138 var css = "success"; |
| 139 // don't report success. |
| 140 return; |
| 141 } else { |
| 142 var result = "failed"; |
| 143 var css = "fail"; |
| 144 } |
| 145 |
| 146 var node = this.reporter.localDoc.createTextNode(result + ': ' + msg); |
| 147 var li = this.reporter.localDoc.createElement('li'); |
| 148 li.appendChild(node); |
| 149 li.setAttribute('class', css); |
| 150 this.resultElem.appendChild(li); |
| 151 }; |
| 152 |
| 153 Page.prototype.startPage = function() { |
| 154 this.totalTests = 0; |
| 155 this.totalSuccessful = 0; |
| 156 this.totalTimeouts = 0; |
| 157 // remove previous results. |
| 158 while (this.resultElem.hasChildNodes()) { |
| 159 this.resultElem.removeChild(this.resultElem.childNodes[0]); |
| 160 } |
| 161 this.totalsElem.textContent = ''; |
| 162 return this.check.checked && this.folder.checked(); |
| 163 }; |
| 164 |
| 165 Page.prototype.firstTestIndex = function() { |
| 166 return this.testIndex; |
| 167 }; |
| 168 |
| 169 Page.prototype.finishPage = function(success) { |
| 170 var msg = ' (' + this.totalSuccessful + ' of ' + |
| 171 this.totalTests + ' passed)'; |
| 172 if (success === undefined) { |
| 173 var css = 'testpagetimeout'; |
| 174 msg = '(*timeout*)'; |
| 175 ++this.totalTests; |
| 176 ++this.totalTimeouts; |
| 177 } else if (this.totalSuccessful != this.totalTests) { |
| 178 var css = 'testpagefail'; |
| 179 } else { |
| 180 var css = 'testpagesuccess'; |
| 181 } |
| 182 this.elem.setAttribute('class', css); |
| 183 this.totalsElem.textContent = msg; |
| 184 }; |
| 185 |
| 186 var Folder = function(reporter, folder, depth, opt_name) { |
| 187 this.reporter = reporter; |
| 188 this.depth = depth; |
| 189 this.name = opt_name || ""; |
| 190 this.subFolders = {}; |
| 191 this.pages = []; |
| 192 this.items = []; |
| 193 var that = this; |
| 194 |
| 195 var doc = reporter.localDoc; |
| 196 var li = doc.createElement('li'); |
| 197 var div = doc.createElement('div'); |
| 198 var check = doc.createElement('input'); |
| 199 check.type = 'checkbox'; |
| 200 check.checked = true; |
| 201 div.appendChild(check); |
| 202 var button = doc.createElement('input'); |
| 203 button.type = 'button'; |
| 204 button.value = 'run'; |
| 205 button.onclick = function() { |
| 206 that.run(); |
| 207 }; |
| 208 if (reporter.noWebGL) { |
| 209 button.disabled = true; |
| 210 } |
| 211 div.appendChild(button); |
| 212 var h = doc.createElement('span'); |
| 213 h.appendChild(doc.createTextNode(this.name)); |
| 214 div.appendChild(h); |
| 215 var ul = doc.createElement('ul'); |
| 216 li.appendChild(div); |
| 217 li.appendChild(ul); |
| 218 this.childUL = ul; |
| 219 this.elem = li; |
| 220 this.check = check; |
| 221 }; |
| 222 |
| 223 Folder.prototype.checked = function() { |
| 224 return this.check.checked && |
| 225 (this.folder ? this.folder.checked() : true); |
| 226 }; |
| 227 |
| 228 Folder.prototype.firstTestIndex = function() { |
| 229 return this.items[0].firstTestIndex(); |
| 230 }; |
| 231 |
| 232 Folder.prototype.numChildren = function() { |
| 233 var numChildren = 0; |
| 234 for (var name in this.subFolders) { |
| 235 numChildren += this.subFolders[name].numChildren(); |
| 236 } |
| 237 return numChildren + this.pages.length; |
| 238 }; |
| 239 |
| 240 Folder.prototype.run = function() { |
| 241 var firstTestIndex = this.firstTestIndex(); |
| 242 var count = this.numChildren(); |
| 243 log("run tests: " + firstTestIndex + " to " + (firstTestIndex + count - 1)) |
| 244 testHarness.runTests(firstTestIndex, count); |
| 245 }; |
| 246 |
| 247 Folder.prototype.getSubFolder = function(name) { |
| 248 var subFolder = this.subFolders[name]; |
| 249 if (subFolder === undefined) { |
| 250 subFolder = new Folder(this.reporter, this, this.depth + 1, name); |
| 251 this.subFolders[name] = subFolder; |
| 252 this.items.push(subFolder); |
| 253 this.childUL.appendChild(subFolder.elem); |
| 254 } |
| 255 return subFolder; |
| 256 }; |
| 257 |
| 258 Folder.prototype.getOrCreateFolder = function(url) { |
| 259 var parts = url.split('/'); |
| 260 var folder = this; |
| 261 for (var pp = 0; pp < parts.length - 1; ++pp) { |
| 262 folder = folder.getSubFolder(parts[pp]); |
| 263 } |
| 264 return folder; |
| 265 }; |
| 266 |
| 267 Folder.prototype.addPage = function(page) { |
| 268 this.pages.push(page); |
| 269 this.items.push(page); |
| 270 this.childUL.appendChild(page.elem); |
| 271 }; |
| 272 |
| 273 var Reporter = function() { |
| 274 this.localDoc = document; |
| 275 this.resultElem = document.getElementById("results"); |
| 276 this.fullResultsElem = document.getElementById("fullresults"); |
| 277 var node = this.localDoc.createTextNode(''); |
| 278 this.fullResultsElem.appendChild(node); |
| 279 this.fullResultsNode = node; |
| 280 this.iframe = document.getElementById("testframe"); |
| 281 this.currentPageElem = null; |
| 282 this.totalPages = 0; |
| 283 this.pagesByURL = {}; |
| 284 var canvas = document.getElementById("webglcheck"); |
| 285 var ctx = create3DContext(canvas); |
| 286 this.noWebGL = !ctx; |
| 287 this.contextInfo = {}; |
| 288 this.root = new Folder(this, null, 0, "all"); |
| 289 this.resultElem.appendChild(this.root.elem); |
| 290 |
| 291 if (ctx) { |
| 292 this.contextInfo["VENDOR"] = ctx.getParameter(ctx.VENDOR); |
| 293 this.contextInfo["VERSION"] = ctx.getParameter(ctx.VERSION); |
| 294 this.contextInfo["RENDERER"] = ctx.getParameter(ctx.RENDERER); |
| 295 this.contextInfo["RED_BITS"] = ctx.getParameter(ctx.RED_BITS); |
| 296 this.contextInfo["GREEN_BITS"] = ctx.getParameter(ctx.GREEN_BITS); |
| 297 this.contextInfo["BLUE_BITS"] = ctx.getParameter(ctx.BLUE_BITS); |
| 298 this.contextInfo["ALPHA_BITS"] = ctx.getParameter(ctx.ALPHA_BITS); |
| 299 this.contextInfo["DEPTH_BITS"] = ctx.getParameter(ctx.DEPTH_BITS); |
| 300 this.contextInfo["STENCIL_BITS"] = ctx.getParameter(ctx.STENCIL_BITS); |
| 301 |
| 302 var ext = ctx.getExtension("WEBGL_debug_renderer_info"); |
| 303 if (ext) { |
| 304 this.contextInfo["UNMASKED_VENDOR"] = ctx.getParameter(ext.UNMASKED_VEND
OR_WEBGL); |
| 305 this.contextInfo["UNMASKED_RENDERER"] = ctx.getParameter(ext.UNMASKED_RE
NDERER_WEBGL); |
| 306 } |
| 307 } |
| 308 }; |
| 309 |
| 310 Reporter.prototype.runTest = function(url) { |
| 311 var page = this.pagesByURL[url]; |
| 312 page.startPage(); |
| 313 this.currentPage = page; |
| 314 this.iframe.src = url; |
| 315 }; |
| 316 |
| 317 Reporter.prototype.getFolder = function(url) { |
| 318 return this.root.getOrCreateFolder(url); |
| 319 }; |
| 320 |
| 321 Reporter.prototype.addPage = function(url) { |
| 322 var folder = this.getFolder(url); |
| 323 var page = new Page(this, folder, this.totalPages, url); |
| 324 folder.addPage(page); |
| 325 ++this.totalPages; |
| 326 this.pagesByURL[url] = page; |
| 327 }; |
| 328 |
| 329 Reporter.prototype.startPage = function(url) { |
| 330 var page = this.pagesByURL[url]; |
| 331 this.currentPage = page; |
| 332 return page.startPage(); |
| 333 }; |
| 334 |
| 335 Reporter.prototype.addResult = function(msg, success) { |
| 336 if (this.currentPage != null) { |
| 337 this.currentPage.addResult(msg, success); |
| 338 } |
| 339 }; |
| 340 |
| 341 Reporter.prototype.finishPage = function(success) { |
| 342 if (this.currentPage != null) { |
| 343 this.currentPage.finishPage(success); |
| 344 this.currentPage = null; |
| 345 } |
| 346 }; |
| 347 |
| 348 Reporter.prototype.displayFinalResults = function(msg, success) { |
| 349 if (success) { |
| 350 var totalTests = 0; |
| 351 var totalSuccessful = 0; |
| 352 var totalTimeouts = 0; |
| 353 for (var url in this.pagesByURL) { |
| 354 var page = this.pagesByURL[url]; |
| 355 totalTests += page.totalTests; |
| 356 totalSuccessful += page.totalSuccessful; |
| 357 totalTimeouts += page.totalTimeouts; |
| 358 } |
| 359 var timeout = ''; |
| 360 if (totalTimeouts > 0) { |
| 361 timeout = ', ' + totalTimeouts + ' timed out'; |
| 362 } |
| 363 var msg = ' (' + totalSuccessful + ' of ' + |
| 364 totalTests + ' passed' + timeout + ')'; |
| 365 this.fullResultsNode.textContent = msg; |
| 366 |
| 367 // generate a text summary |
| 368 var tx = ""; |
| 369 tx += "WebGL Conformance Test Results\n"; |
| 370 tx += "Version " + OPTIONS.version + "\n"; |
| 371 tx += "\n"; |
| 372 tx += "-------------------\n\n"; |
| 373 tx += "User Agent: " + (navigator.userAgent ? navigator.userAgent : "(navi
gator.userAgent is null)") + "\n"; |
| 374 tx += "WebGL VENDOR: " + this.contextInfo["VENDOR"] + "\n"; |
| 375 tx += "WebGL VERSION: " + this.contextInfo["VERSION"] + "\n"; |
| 376 tx += "WebGL RENDERER: " + this.contextInfo["RENDERER"] + "\n"; |
| 377 tx += "Unmasked VENDOR: " + this.contextInfo["UNMASKED_VENDOR"] + "\n"; |
| 378 tx += "Unmasked RENDERER: " + this.contextInfo["UNMASKED_RENDERER"] + "\n"
; |
| 379 tx += "WebGL R/G/B/A/Depth/Stencil bits (default config): " + this.context
Info["RED_BITS"] + "/" + this.contextInfo["GREEN_BITS"] + "/" + this.contextInfo
["BLUE_BITS"] + "/" + this.contextInfo["ALPHA_BITS"] + "/" + this.contextInfo["D
EPTH_BITS"] + "/" + this.contextInfo["STENCIL_BITS"] + "\n"; |
| 380 tx += "\n"; |
| 381 tx += "-------------------\n\n"; |
| 382 tx += "Test Summary (" + totalTests + " total tests):\n"; |
| 383 tx += "Tests PASSED: " + totalSuccessful + "\n"; |
| 384 tx += "Tests FAILED: " + (totalTests - totalSuccessful) + "\n"; |
| 385 tx += "Tests TIMED OUT: " + totalTimeouts + "\n"; |
| 386 tx += "\n"; |
| 387 tx += "-------------------\n\n"; |
| 388 tx += "Individual Test Results (pass / total / timeout):\n\n"; |
| 389 for (var url in this.pagesByURL) { |
| 390 var page = this.pagesByURL[url]; |
| 391 if (!(page.totalTests == 0 && page.totalTimeouts == 0)) { |
| 392 tx += url + ": " + page.totalSuccessful + " / " + |
| 393 page.totalTests + " / " + page.totalTimeouts + "\n"; |
| 394 } |
| 395 } |
| 396 tx += "\n"; |
| 397 tx += "-------------------\n\n"; |
| 398 tx += "Generated on: " + (new Date()).toString() + "\n"; |
| 399 |
| 400 var r = document.getElementById("testResultsAsText"); |
| 401 while (r.firstChild) r.removeChild(r.firstChild); |
| 402 r.appendChild(document.createTextNode(tx)); |
| 403 document.getElementById("showTextSummary").style.visibility = "visible"; |
| 404 } else { |
| 405 var e = document.getElementById("error"); |
| 406 e.innerHTML = msg; |
| 407 } |
| 408 }; |
| 409 |
| 410 Reporter.prototype.ready = function() { |
| 411 var loading = document.getElementById("loading"); |
| 412 loading.style.display = "none"; |
| 413 if (!this.noWebGL) { |
| 414 var button = document.getElementById("runTestsButton"); |
| 415 button.disabled = false; |
| 416 } |
| 417 }; |
| 418 |
| 419 Reporter.prototype.reportFunc = function(type, msg, success) { |
| 420 switch (type) { |
| 421 case reportType.ADD_PAGE: |
| 422 return this.addPage(msg); |
| 423 case reportType.READY: |
| 424 return this.ready(); |
| 425 case reportType.START_PAGE: |
| 426 return this.startPage(msg); |
| 427 case reportType.TEST_RESULT: |
| 428 return this.addResult(msg, success); |
| 429 case reportType.FINISH_PAGE: |
| 430 return this.finishPage(success); |
| 431 case reportType.FINISHED_ALL_TESTS: |
| 432 return this.displayFinalResults(msg, success); |
| 433 default: |
| 434 throw 'unhandled'; |
| 435 break; |
| 436 }; |
| 437 }; |
| 438 |
| 439 var getURLOptions = function(obj) { |
| 440 var s = window.location.href; |
| 441 var q = s.indexOf("?"); |
| 442 var e = s.indexOf("#"); |
| 443 if (e < 0) { |
| 444 e = s.length; |
| 445 } |
| 446 var query = s.substring(q + 1, e); |
| 447 var pairs = query.split("&"); |
| 448 for (var ii = 0; ii < pairs.length; ++ii) { |
| 449 var keyValue = pairs[ii].split("="); |
| 450 var key = keyValue[0]; |
| 451 var value = decodeURIComponent(keyValue[1]); |
| 452 obj[key] = value; |
| 453 } |
| 454 }; |
| 455 |
| 456 getURLOptions(OPTIONS); |
| 457 |
| 458 document.getElementById("testVersion").innerHTML = OPTIONS.version; |
| 459 |
| 460 var reporter = new Reporter(); |
| 461 var iframe = document.getElementById("testframe"); |
| 462 var testHarness = new WebGLTestHarnessModule.TestHarness( |
| 463 iframe, |
| 464 '00_test_list.txt', |
| 465 function(type, msg, success) { |
| 466 return reporter.reportFunc(type, msg, success); |
| 467 }, |
| 468 OPTIONS); |
| 469 window.webglTestHarness = testHarness; |
| 470 var button = document.getElementById("runTestsButton"); |
| 471 button.disabled = true; |
| 472 button.onclick = function() { |
| 473 testHarness.runTests(); |
| 474 }; |
| 475 var textbutton = document.getElementById("showTextSummary"); |
| 476 textbutton.onclick = function() { |
| 477 log("click"); |
| 478 var htmldiv = document.getElementById("testResultsHTML"); |
| 479 var textdiv = document.getElementById("testResultsText"); |
| 480 if (textdiv.style.display == "none") { |
| 481 textdiv.style.display = "block"; |
| 482 htmldiv.style.display = "none"; |
| 483 textbutton.setAttribute("value", "display html summary"); |
| 484 } else { |
| 485 textdiv.style.display = "none"; |
| 486 htmldiv.style.display = "block"; |
| 487 textbutton.setAttribute("value", "display text summary"); |
| 488 } |
| 489 }; |
| 490 if (reporter.noWebGL) { |
| 491 button.disabled = true; |
| 492 var elem = document.getElementById("nowebgl"); |
| 493 elem.style.display = ""; |
| 494 } |
| 495 } |
| 496 </script> |
| 497 </head> |
| 498 <body onload="start()"> |
| 499 <table border="2"> |
| 500 <tr style="height: 300px;"> |
| 501 <td> |
| 502 <table> |
| 503 <tr><td><img src="http://www.khronos.org/img/api_logos/webgl-logo.png" /><br />W
ebGL Conformance Test Runner<br/>Version <span id="testVersion"></span><br/><inp
ut type="button" value="run tests" id="runTestsButton"/><br/><input type="button
" style="visibility: hidden;" value="display text summary" id="showTextSummary"/
> |
| 504 <div id="nowebgl" class="nowebgl" style="display: none;">This browser does not a
ppear to support WebGL</div></td></tr> |
| 505 <tr><td><div id="loading">Loading Tests...</div> |
| 506 <div style="border: 1px">Results: <span id="fullresults"></span></div> |
| 507 <canvas id="webglcheck" style="display: none;"></canvas></td></tr> |
| 508 <tr><td><div id="error-wrap"><pre id="error"></pre></div></td></tr> |
| 509 </table> |
| 510 </td> |
| 511 <td> |
| 512 <iframe id="testframe" scrolling="yes" width="100%" height="100%"></iframe> |
| 513 </td> |
| 514 </tr> |
| 515 <tr> |
| 516 <td colspan="2"> |
| 517 <div style="text-align: left; width: 100%; height: 100%; overflow: auto;"> |
| 518 <div id="testResultsHTML"><ul id="results"></ul></div> |
| 519 <div style="display: none;" id="testResultsText"><pre id="testResultsAsText"></p
re></div> |
| 520 </div> |
| 521 </td> |
| 522 </tr> |
| 523 </table> |
| 524 </body> |
| 525 </html> |
OLD | NEW |