test_bug490949.html 3.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113
  1. <!DOCTYPE HTML>
  2. <html>
  3. <!--
  4. https://bugzilla.mozilla.org/show_bug.cgi?id=490949
  5. -->
  6. <head>
  7. <title>Test for Bug 490949</title>
  8. <script type="application/javascript" src="/MochiKit/MochiKit.js"></script>
  9. <script type="application/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
  10. <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
  11. </head>
  12. <body>
  13. <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=490949">Mozilla Bug 490949</a>
  14. <p id="display"></p>
  15. <div id="content" style="display: none">
  16. <canvas id="canvas" width="100" height="100"> </canvas>
  17. </div>
  18. <pre id="test">
  19. <script type="application/javascript">
  20. SimpleTest.waitForExplicitFinish();
  21. var canvas = document.getElementById('canvas');
  22. var first, second, third;
  23. RemoteCanvas = function() {
  24. this.url = "bug490949-iframe.html";
  25. };
  26. RemoteCanvas.CANVAS_WIDTH = 100;
  27. RemoteCanvas.CANVAS_HEIGHT = 100;
  28. RemoteCanvas.prototype.load = function(cb) {
  29. this.cb = cb;
  30. var windowWidth = window.innerWidth - 25;
  31. var iframe;
  32. iframe = document.createElement("iframe");
  33. iframe.id = "test-iframe";
  34. iframe.height = "10px";
  35. iframe.width = windowWidth + "px";
  36. iframe.style.visibility = "hidden";
  37. iframe.src = this.url;
  38. // Here is where the magic happens... add a listener to the
  39. // frame's onload event - it will call handleEvent
  40. iframe.addEventListener("load", this, true);
  41. //append to the end of the page
  42. window.document.body.appendChild(iframe);
  43. };
  44. RemoteCanvas.prototype.reload = function(cb, force) {
  45. this.cb = cb;
  46. window.frames[0].location.reload(force);
  47. }
  48. RemoteCanvas.prototype.handleEvent = function() {
  49. // Look back up the iframe by id
  50. var ldrFrame = document.getElementById("test-iframe");
  51. // Get a reference to the window object you need for the
  52. // SpecialPowers.snapshotRect method
  53. var remoteWindow = ldrFrame.contentWindow;
  54. //Draw canvas
  55. canvas.style.width = RemoteCanvas.CANVAS_WIDTH + "px";
  56. canvas.style.height = RemoteCanvas.CANVAS_HEIGHT + "px";
  57. canvas.width = RemoteCanvas.CANVAS_WIDTH;
  58. canvas.height = RemoteCanvas.CANVAS_HEIGHT;
  59. var windowWidth = window.innerWidth - 25;
  60. var windowHeight = window.innerHeight;
  61. var rect = { left: 0, top: 0, width: windowWidth, height: windowHeight };
  62. var snapshot = SpecialPowers.snapshotRect(remoteWindow, rect, "rgb(0,0,0)");
  63. var ctx = canvas.getContext("2d");
  64. ctx.clearRect(0, 0,
  65. RemoteCanvas.CANVAS_WIDTH,
  66. RemoteCanvas.CANVAS_HEIGHT);
  67. ctx.save();
  68. ctx.scale(RemoteCanvas.CANVAS_WIDTH / windowWidth,
  69. RemoteCanvas.CANVAS_HEIGHT / windowHeight);
  70. ctx.drawImage(snapshot, 0, 0);
  71. ctx.restore();
  72. this.cb();
  73. };
  74. function checkFirst()
  75. {
  76. first = canvas.toDataURL();
  77. remoteCanvas.reload(checkForceReload, true);
  78. }
  79. function checkForceReload()
  80. {
  81. second = canvas.toDataURL();
  82. ok(first != second, "We got the wrong image.");
  83. remoteCanvas.reload(checkLazyReload, false);
  84. }
  85. function checkLazyReload()
  86. {
  87. third = canvas.toDataURL();
  88. ok(second != third, "We got the wrong image.");
  89. SimpleTest.finish();
  90. }
  91. var remoteCanvas = new RemoteCanvas();
  92. remoteCanvas.load(checkFirst);
  93. </script>
  94. </pre>
  95. </body>
  96. </html>