| terry@google.com | 256453d | 2015-12-18 17:55:16 | [diff] [blame] | 1 | <html> |
| 2 | <head> |
| 3 | <script> |
| 4 | var w; |
| 5 | function Open(sFeatures) |
| 6 | { |
| 7 | if (w && !w.closed) |
| 8 | w.close(); |
| 9 | |
| 10 | w = window.open("resources/popup200x200.html", "popup", sFeatures); |
| 11 | |
| 12 | } |
| 13 | |
| 14 | function test1() |
| 15 | { |
| 16 | Open("width=200, height=200, left = 0, top = 0, scrollbars, resizable"); |
| 17 | |
| 18 | setConsole(document.getElementById('console1')); |
| 19 | clearConsole(); |
| 20 | shouldBe("w.innerHeight", 200); |
| 21 | shouldBe("w.innerWidth", 200); |
| 22 | shouldBe("w.outerWidth", 200); |
| 23 | shouldBe("w.screenLeft", 0); |
| 24 | shouldBe("w.screenTop", 22); // empirical result of low dpi testing |
| 25 | shouldBe("w.outerHeight", 223); // empirical result of low dpi testing |
| 26 | } |
| 27 | |
| 28 | function test2() |
| 29 | { |
| 30 | console = document.getElementById('console2'); |
| 31 | Open("width=200, height=200, left = 0, top = 0, scrollbars, menubar, status, toolbar, resizable"); |
| 32 | |
| 33 | setConsole(document.getElementById('console2')); |
| 34 | clearConsole(); |
| 35 | shouldBe("w.innerHeight", 200); |
| 36 | shouldBe("w.innerWidth", 200); |
| 37 | shouldBe("w.outerWidth", 200); |
| 38 | shouldBe("w.screenLeft", 0); |
| 39 | shouldBe("w.screenTop", 22); // empirical result of low dpi testing |
| 40 | shouldBe("w.outerHeight", 313); // empirical result of low dpi testing |
| 41 | } |
| 42 | |
| 43 | function test3() |
| 44 | { |
| 45 | Open("width=200,height=200,left=" + (screen.width - 200) + ",screenY=0, resizable"); |
| 46 | w.moveBy(0, screen.height - w.screenTop - w.outerHeight); |
| 47 | |
| 48 | // should be no-ops |
| 49 | w.moveTo(w.screenLeft - 100, w.screenTop + 100); |
| 50 | w.moveBy(100, -100); |
| 51 | w.resizeTo(w.outerWidth - 100 , w.outerHeight - 100); |
| 52 | w.resizeBy(100, 100); |
| 53 | |
| 54 | setConsole(document.getElementById('console3')); |
| 55 | clearConsole(); |
| 56 | shouldBe("w.innerHeight", 200); |
| 57 | shouldBe("w.innerWidth", 200); |
| 58 | shouldBe("w.outerWidth", 200); |
| 59 | shouldBe("w.screenLeft", screen.width - 200); |
| 60 | shouldBe("w.screenTop", screen.height - w.outerHeight); |
| 61 | shouldBe("w.outerHeight", 223); // empirical result of low dpi testing |
| 62 | } |
| 63 | |
| 64 | var console; |
| 65 | function print(message, color) |
| 66 | { |
| 67 | var paragraph = document.createElement("div"); |
| 68 | paragraph.appendChild(document.createTextNode(message)); |
| 69 | paragraph.style.fontFamily = "monospace"; |
| 70 | if (color) |
| 71 | paragraph.style.color = color; |
| 72 | console.appendChild(paragraph); |
| 73 | } |
| 74 | |
| 75 | function clearConsole() |
| 76 | { |
| 77 | console.innerHTML = ""; |
| 78 | } |
| 79 | |
| 80 | function setConsole(c) |
| 81 | { |
| 82 | console = c; |
| 83 | } |
| 84 | |
| 85 | function shouldBe(a, b) |
| 86 | { |
| 87 | var evalA = eval(a); |
| 88 | if (evalA == b) |
| 89 | print("PASS: " + a + " should be " + b + " and is.", "green"); |
| 90 | else |
| 91 | print("FAIL: " + a + " should be " + b + " but instead is " + evalA + ".", "red"); |
| 92 | } |
| 93 | </script> |
| 94 | </head> |
| 95 | <body> |
| 96 | |
| 97 | <p>This test checks our support for window sizing and positioning.</p> |
| 98 | <p>To test: Click each button below. Check to make sure that the window it opens has the specified attributes. |
| 99 | Also check for a series of 'PASS' messages below the button.</p> |
| 100 | <p style="color:red">NOTE: Make sure to test at magnified resolutions.</p> |
| 101 | <p>To test @ 2X resolution:</p> |
| 102 | <ol> |
| 103 | <li>Open Quartz Debug (/Developer/Applications/Performance Tools).</li> |
| 104 | <li>Select Tools -> Show User Interface Resolution.</li> |
| 105 | <li>Set the resolution to 2.0.</li> |
| 106 | <li>Restart Safari.</li> |
| 107 | </ol> |
| 108 | <hr> |
| 109 | |
| 110 | <p>Window size (no toolbars): You should see a red 1 pixel border along every edge of this page, and no scrollbars.</p> |
| 111 | <input type="button" value="open it!" onclick="test1()"> |
| 112 | <div id='console1'></div> |
| 113 | <hr> |
| 114 | |
| 115 | <p>Window size (all toolbars): You should see a red 1 pixel border along every edge of this page, and no scrollbars.</p> |
| 116 | <input type="button" value="open it!" onclick="test2()"> |
| 117 | <div id='console2'></div> |
| 118 | <hr> |
| 119 | |
| 120 | <p>Window positioning: This window should be aligned exactly to the bottom right corner of the screen.</p> |
| 121 | <input type="button" value="open it!" onclick="test3()"> |
| 122 | <div id='console3'></div> |
| 123 | <hr> |
| 124 | |
| 125 | </body> |
| 126 | </html> |
