Changes between Initial Version and Version 1 of Writing DumpAsMarkup Tests


Ignore:
Timestamp:
Jul 26, 2010 2:26:21 PM (14 years ago)
Author:
rniwa@webkit.org
Comment:

Added "Writing DumpAsMarkup Tests" page

Legend:

Unmodified
Added
Removed
Modified

  • Writing DumpAsMarkup Tests

    v1 v1  
     1= Benefits of dumpAsMarkup Tests =
     2
     3 * Platform independent - dumpAsMarkup outputs plain text as the expected results and can be shared among all platforms.
     4 * Easier to read expected results - dumpAsMarkup's output is HTML with extra annotation.
     5
     6= Limitation =
     7
     8 * Can't test rendering - Since dumpAsMarkup test does not produce .png files or render tree outputs, we can't use dumpAsMarkup to test the correctness of rendering.
     9
     10= How to Use =
     11
     12Including the following line makes your layout test a dumpAsMarkup test:
     13{{{
     14<script src="<path to LayoutTests>/resources/dump-as-markup.js"></script>
     15}}}
     16
     17dump-as-markup.js then replace the document body by the DOM tree on the page load.  If your test requires the test to be continued after the page load (e.g. uses setTimeout), then call Markup.waitUntilDone() before the page loads and Markup.notifyDone() to output the results and finish the test.  Markup's waitUntilDone and notifyDone automatically calls layoutTestController's counterparts.
     18
     19For example, if I have:
     20{{{
     21<script src="../../resources/dump-as-markup.js"></script>
     22<div id=foo>This is a dumpAsMarkup test.</div>
     23<script> window.getSelection().selectAllChildren(foo); </script>
     24}}}
     25
     26I get:
     27{{{
     28
     29<HTML>
     30<HEAD>
     31<SCRIPT src="../../resources/dump-as-markup.js"></SCRIPT>
     32<#text>
     33</#text>
     34</HEAD>
     35<BODY>
     36<DIV id="foo">
     37<#text><selection-anchor>This is a dumpAsMarkup test.<selection-focus></#text>
     38</DIV>
     39<#text>
     40</#text>
     41<SCRIPT> window.getSelection().selectAllChildren(foo); </SCRIPT>
     42<#text>
     43</#text>
     44</BODY>
     45</HTML>
     46}}}
     47
     48Notice <#text> and <selection-*> annotates the document.
     49
     50== Output Subtree ==
     51
     52If you want to output a subtree of the DOM, call Markup.setNodeToDump(<node>) where <node> is a HTMLElement object for which you want to print the subtree. You can also specify the id of an element.
     53
     54For example, if I have:
     55{{{
     56<script src="../../resources/dump-as-markup.js"></script>
     57<div id="test"><a href="http://webkit.org/">WebKit</a> is <strong>awesome</strong></div>
     58<p>But cluttered expected result sucks :(</p>
     59<script>
     60Markup.description('This is a dumpAsMarkup test.')
     61Markup.setNodeToDump('test')
     62</script>
     63}}}
     64
     65I get:
     66{{{
     67This is a dumpAsMarkup test.
     68
     69<DIV id="test">
     70<A href="http://webkit.org/">
     71<#text>WebKit</#text>
     72</A>
     73<#text> is </#text>
     74<STRONG>
     75<#text>awesome</#text>
     76</STRONG>
     77</DIV>
     78}}}
     79
     80Note "This is a dumpAsMarkup test." is added by Markup.description. The sentence will not be printed in DRT if we had it in a div like the earlier example because the entire document body is replaced by the output.
     81
     82== Dump Multiple Times ==
     83
     84To dump the entire DOM or a subtree multiple times, call Markup.dump(<node>, <description>).
     85
     86For example, if I have:
     87{{{
     88<script src="../../resources/dump-as-markup.js"></script>
     89<div id="test"><a href="http://webkit.org/">WebKit</a> is <strong>awesome</strong></div>
     90<p>But cluttered expected result sucks :(</p>
     91<script>
     92Markup.description('This test calls dump twice.')
     93Markup.setNodeToDump('test')
     94Markup.dump('test', 'before change')
     95document.getElementById('test').lastChild.innerText += ' because of you!'
     96Markup.dump(null, 'after change')
     97</script>
     98}}}
     99
     100I get:
     101{{{
     102This test calls dump twice.
     103
     104before change:
     105<DIV id="test">
     106<A href="http://webkit.org/">
     107<#text>WebKit</#text>
     108</A>
     109<#text> is </#text>
     110<STRONG>
     111<#text>awesome</#text>
     112</STRONG>
     113</DIV>
     114
     115after change:
     116<DIV id="test">
     117<A href="http://webkit.org/">
     118<#text>WebKit</#text>
     119</A>
     120<#text> is </#text>
     121<STRONG>
     122<#text>awesome because of you!</#text>
     123</STRONG>
     124</DIV>
     125}}}
     126
     127Notice that I call dump twice and the DOM is dumped exactly twice (onload didn't dump).  You may still use Markup.waitUntilDone() and Markup.notifyDone() to avoid DRT finishing the test prematurely.
     128
     129'''Note''': as is implemented, the script adds pre element at the end of the document temporarily when you call dump and your script should not interfere with those pre tags.