test_animSVGImage.html 3.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123
  1. <!DOCTYPE HTML>
  2. <html>
  3. <!--
  4. https://bugzilla.mozilla.org/show_bug.cgi?id=610419
  5. -->
  6. <head>
  7. <title>Test for Bug 610419</title>
  8. <script type="application/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
  9. <script type="application/javascript" src="/tests/SimpleTest/WindowSnapshot.js"></script>
  10. <script type="application/javascript" src="imgutils.js"></script>
  11. <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css" />
  12. </head>
  13. <body>
  14. <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=610419">Mozilla Bug 610419</a>
  15. <p id="display"></p>
  16. <div id="content">
  17. <div id="referenceDiv" style="height: 100px; width: 100px;
  18. display: none; background: lime"></div>
  19. <img>
  20. </div>
  21. <pre id="test">
  22. <script type="application/javascript;version=1.8">
  23. /** Test for Bug 610419**/
  24. SimpleTest.requestFlakyTimeout("Pre-existing timeouts when converting from mochitest-chrome");
  25. SimpleTest.waitForExplicitFinish();
  26. const FAILURE_TIMEOUT = 120000; // Fail early after 120 seconds (2 minutes)
  27. const gImg = document.getElementsByTagName("img")[0];
  28. var gMyDecoderObserver; // value will be set in main()
  29. var gReferenceSnapshot; // value will be set in takeReferenceSnapshot()
  30. var gPollCounter = 0;
  31. var gIsTestFinished = false;
  32. var gSVGImages = [
  33. "lime-anim-100x100.svg", // SMIL animation
  34. "lime-css-anim-100x100.svg" // CSS animation
  35. ]
  36. var gSVGCurrentImage = 0;
  37. function takeReferenceSnapshot() {
  38. // Take a snapshot of the initial (essentially blank) page
  39. let blankSnapshot = snapshotWindow(window, false);
  40. // Show reference div, & take a snapshot
  41. let referenceDiv = document.getElementById("referenceDiv");
  42. referenceDiv.style.display = "block";
  43. gReferenceSnapshot = snapshotWindow(window, false);
  44. ok(compareSnapshots(blankSnapshot, gReferenceSnapshot, false)[0],
  45. "reference snapshot shouldn't match blank page snapshot");
  46. // Re-hide reference div, and take another snapshot to be sure it's gone
  47. referenceDiv.style.display = "none";
  48. let blankSnapshot2 = snapshotWindow(window, false);
  49. ok(compareSnapshots(blankSnapshot, blankSnapshot2, true)[0],
  50. "reference div should disappear when it becomes display:none");
  51. }
  52. function loadNextImageAndPoll()
  53. {
  54. setTimeout(myPoll, 1);
  55. // kick off image-loading! myPoll handles the rest.
  56. gImg.setAttribute("src", gSVGImages[gSVGCurrentImage]);
  57. }
  58. function myPoll() {
  59. gPollCounter++;
  60. ok(true, "myPoll called");
  61. let currentSnapshot = snapshotWindow(window, false);
  62. if (compareSnapshots(currentSnapshot, gReferenceSnapshot, true)[0]) {
  63. // SUCCESS!
  64. ok(true, "Animated image looks correct, " +
  65. "at call #" + gPollCounter + " to myPoll");
  66. if (++gSVGCurrentImage > gSVGImages.length) {
  67. cleanUpAndFinish();
  68. } else {
  69. loadNextImageAndPoll();
  70. }
  71. }
  72. else
  73. setTimeout(myPoll, 1);
  74. }
  75. function failTest() {
  76. ok(false, "timing out after " + FAILURE_TIMEOUT + "ms. " +
  77. "Animated image still doesn't look correct, " +
  78. "after call #" + gPollCounter + " to myPoll");
  79. cleanUpAndFinish();
  80. }
  81. function cleanUpAndFinish() {
  82. // On the off chance that failTest and myPoll are triggered
  83. // back-to-back, use a flag to prevent multiple calls to SimpleTest.finish.
  84. if (gIsTestFinished) {
  85. return;
  86. }
  87. SimpleTest.finish();
  88. gIsTestFinished = true;
  89. }
  90. function main() {
  91. takeReferenceSnapshot();
  92. // We want to test the cold loading behavior, so clear cache in case an
  93. // earlier test got our image in there already.
  94. clearAllImageCaches();
  95. loadNextImageAndPoll();
  96. // In case something goes wrong, fail earlier than mochitest timeout,
  97. // and with more information.
  98. setTimeout(failTest, FAILURE_TIMEOUT);
  99. }
  100. window.onload = main;
  101. </script>
  102. </pre>
  103. </body>
  104. </html>