blob: a2b5f0ae6133c93974443dda9d0c3481ba2ea26e [file] [log] [blame]
<?php
$title = "Writing New Tests";
include("../header.inc");
?>
<h2>Writing New Tests</h2>
<p>A layout test is simply a web page. The layout test machinery renders the web page, and then dumps the
internal representation, the render tree, with details of the layout. This lets engineers working on the project know
if they do anything that changes the layout. Once we get a test rendering properly, we check it in as part of the layout test suite.
</p>
<p>The following are some guidelines to follow when writing new layout tests:</p>
<ol>
<li>The test should be the smallest possible code fragment that tests the feature.
<li>The test should fit on one page (unless of course it&rsquo;s testing scrolling).
<li>The test should clearly describe what feature it is testing.
<li>The test should clearly describe the expected result. It should be possible through visual inspection alone to determine that the test has
failed.
</ol>
<p>An example of a layout test that follows these guidelines is <tt>fast/events/event-creation.html</tt>.</p>
<p>A layout test should work both in the browser itself, and in the layout test tool. The layout test tool provides an
additional object on the window object called the layout test controller with some methods that control test output.
One you should know about is the <tt>layoutTestController.dumpAsText</tt> method. Calling this from JavaScript within a test arranges
for the output to be written out as plain text rather than as a render tree dump.
This is useful for tests that are testing something other than layout. The event creation test mentioned above is a good example of
how to do this and when it makes sense.</p>
<p><a href="http://www.hixie.ch/resources/fonts/">The Ahem font</a> is useful in testing text layout, since its
glyphs&rsquo; metrics are well known, and it is always available to tests running
in the layout test tool. However, if you want to view tests that use Ahem in Safari,
you should <a href="Ahem.ttf">download Ahem</a>, open it in the Font Book
application, and click on the Install Font button to install it.</p>
<p>The CSS working group has an excellent document on <a href="http://www.w3.org/Style/CSS/Test/guidelines.html">test writing guidelines</a> for CSS tests. <a href="http://trac.webkit.org/projects/webkit/wiki/Writing%20Layout%20Tests%20for%20DumpRenderTree">This wiki article</a> has more information on writing good tests and the DumpRenderTree tool.</p>
<?php
include("../footer.inc");
?>