ManualTests/window-sizing.html - WebKit - Git at Google

 <html>
 <head>
 <script>
 var w;
 function Open(sFeatures)
 {
     if (w && !w.closed)
 	w.close();

     w = window.open("resources/popup200x200.html", "popup", sFeatures);

 }

 function test1()
 {
     Open("width=200, height=200, left = 0, top = 0, scrollbars, resizable");

     setConsole(document.getElementById('console1'));
     clearConsole();
     shouldBe("w.innerHeight", 200);
     shouldBe("w.innerWidth", 200);
     shouldBe("w.outerWidth", 200);
     shouldBe("w.screenLeft", 0);
     shouldBe("w.screenTop", 22); // empirical result of low dpi testing
     shouldBe("w.outerHeight", 223); // empirical result of low dpi testing
 }

 function test2()
 {
     console = document.getElementById('console2');
     Open("width=200, height=200, left = 0, top = 0, scrollbars, menubar, status, toolbar, resizable");

     setConsole(document.getElementById('console2'));
     clearConsole();
     shouldBe("w.innerHeight", 200);
     shouldBe("w.innerWidth", 200);
     shouldBe("w.outerWidth", 200);
     shouldBe("w.screenLeft", 0);
     shouldBe("w.screenTop", 22); // empirical result of low dpi testing
     shouldBe("w.outerHeight", 313); // empirical result of low dpi testing
 }

 function test3()
 {
     Open("width=200,height=200,left=" + (screen.width - 200) + ",screenY=0, resizable");
     w.moveBy(0, screen.height - w.screenTop - w.outerHeight);

     // should be no-ops
     w.moveTo(w.screenLeft - 100, w.screenTop + 100);
     w.moveBy(100, -100);
     w.resizeTo(w.outerWidth - 100 , w.outerHeight - 100);
     w.resizeBy(100, 100);

     setConsole(document.getElementById('console3'));
     clearConsole();
     shouldBe("w.innerHeight", 200);
     shouldBe("w.innerWidth", 200);
     shouldBe("w.outerWidth", 200);
     shouldBe("w.screenLeft", screen.width - 200);
     shouldBe("w.screenTop", screen.height - w.outerHeight);
     shouldBe("w.outerHeight", 223); // empirical result of low dpi testing
 }

 var console;
 function print(message, color)
 {
     var paragraph = document.createElement("div");
     paragraph.appendChild(document.createTextNode(message));
     paragraph.style.fontFamily = "monospace";
     if (color)
         paragraph.style.color = color;
     console.appendChild(paragraph);
 }

 function clearConsole()
 {
     console.innerHTML = "";
 }

 function setConsole(c)
 {
     console = c;
 }

 function shouldBe(a, b)
 {
     var evalA = eval(a);
     if (evalA == b)
         print("PASS: " + a + " should be " + b + " and is.", "green");
     else
         print("FAIL: " + a + " should be " + b + " but instead is " + evalA + ".", "red");
 }
 </script>
 </head>
 <body>

 <p>This test checks our support for window sizing and positioning.</p>
 <p>To test: Click each button below. Check to make sure that the window it opens has the specified attributes.
    Also check for a series of 'PASS' messages below the button.</p>
 <p style="color:red">NOTE: Make sure to test at magnified resolutions.</p>
 <p>To test @ 2X resolution:</p>
 <ol>
 <li>Open Quartz Debug (/Developer/Applications/Performance Tools).</li>
 <li>Select Tools -> Show User Interface Resolution.</li>
 <li>Set the resolution to 2.0.</li>
 <li>Restart Safari.</li>
 </ol>
 <hr>

 <p>Window size (no toolbars): You should see a red 1 pixel border along every edge of this page, and no scrollbars.</p>
 <input type="button" value="open it!" onclick="test1()">
 <div id='console1'></div>
 <hr>

 <p>Window size (all toolbars): You should see a red 1 pixel border along every edge of this page, and no scrollbars.</p>
 <input type="button" value="open it!" onclick="test2()">
 <div id='console2'></div>
 <hr>

 <p>Window positioning: This window should be aligned exactly to the bottom right corner of the screen.</p>
 <input type="button" value="open it!" onclick="test3()">
 <div id='console3'></div>
 <hr>

 </body>
 </html>
	<html>
	<head>
	<script>
	var w;
	function Open(sFeatures)
	{
	if (w && !w.closed)
	w.close();

	w = window.open("resources/popup200x200.html", "popup", sFeatures);

	}

	function test1()
	{
	Open("width=200, height=200, left = 0, top = 0, scrollbars, resizable");

	setConsole(document.getElementById('console1'));
	clearConsole();
	shouldBe("w.innerHeight", 200);
	shouldBe("w.innerWidth", 200);
	shouldBe("w.outerWidth", 200);
	shouldBe("w.screenLeft", 0);
	shouldBe("w.screenTop", 22); // empirical result of low dpi testing
	shouldBe("w.outerHeight", 223); // empirical result of low dpi testing
	}

	function test2()
	{
	console = document.getElementById('console2');
	Open("width=200, height=200, left = 0, top = 0, scrollbars, menubar, status, toolbar, resizable");

	setConsole(document.getElementById('console2'));
	clearConsole();
	shouldBe("w.innerHeight", 200);
	shouldBe("w.innerWidth", 200);
	shouldBe("w.outerWidth", 200);
	shouldBe("w.screenLeft", 0);
	shouldBe("w.screenTop", 22); // empirical result of low dpi testing
	shouldBe("w.outerHeight", 313); // empirical result of low dpi testing
	}

	function test3()
	{
	Open("width=200,height=200,left=" + (screen.width - 200) + ",screenY=0, resizable");
	w.moveBy(0, screen.height - w.screenTop - w.outerHeight);

	// should be no-ops
	w.moveTo(w.screenLeft - 100, w.screenTop + 100);
	w.moveBy(100, -100);
	w.resizeTo(w.outerWidth - 100 , w.outerHeight - 100);
	w.resizeBy(100, 100);

	setConsole(document.getElementById('console3'));
	clearConsole();
	shouldBe("w.innerHeight", 200);
	shouldBe("w.innerWidth", 200);
	shouldBe("w.outerWidth", 200);
	shouldBe("w.screenLeft", screen.width - 200);
	shouldBe("w.screenTop", screen.height - w.outerHeight);
	shouldBe("w.outerHeight", 223); // empirical result of low dpi testing
	}

	var console;
	function print(message, color)
	{
	var paragraph = document.createElement("div");
	paragraph.appendChild(document.createTextNode(message));
	paragraph.style.fontFamily = "monospace";
	if (color)
	paragraph.style.color = color;
	console.appendChild(paragraph);
	}

	function clearConsole()
	{
	console.innerHTML = "";
	}

	function setConsole(c)
	{
	console = c;
	}

	function shouldBe(a, b)
	{
	var evalA = eval(a);
	if (evalA == b)
	print("PASS: " + a + " should be " + b + " and is.", "green");
	else
	print("FAIL: " + a + " should be " + b + " but instead is " + evalA + ".", "red");
	}
	</script>
	</head>
	<body>

	<p>This test checks our support for window sizing and positioning.</p>
	<p>To test: Click each button below. Check to make sure that the window it opens has the specified attributes.
	Also check for a series of 'PASS' messages below the button.</p>
	<p style="color:red">NOTE: Make sure to test at magnified resolutions.</p>
	<p>To test @ 2X resolution:</p>
	<ol>
	<li>Open Quartz Debug (/Developer/Applications/Performance Tools).</li>
	<li>Select Tools -> Show User Interface Resolution.</li>
	<li>Set the resolution to 2.0.</li>
	<li>Restart Safari.</li>
	</ol>
	<hr>

	<p>Window size (no toolbars): You should see a red 1 pixel border along every edge of this page, and no scrollbars.</p>
	<input type="button" value="open it!" onclick="test1()">
	<div id='console1'></div>
	<hr>

	<p>Window size (all toolbars): You should see a red 1 pixel border along every edge of this page, and no scrollbars.</p>
	<input type="button" value="open it!" onclick="test2()">
	<div id='console2'></div>
	<hr>

	<p>Window positioning: This window should be aligned exactly to the bottom right corner of the screen.</p>
	<input type="button" value="open it!" onclick="test3()">
	<div id='console3'></div>
	<hr>

	</body>
	</html>