The Tor Browser: dom/tests/mochitest/ajax/scriptaculous/test/unit/builder

Incorporate requested changes from Mozilla in review:
https://bugzilla.mozilla.org/show_bug.cgi?id=1123480#c6

     1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

     2         "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

     3 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

     4 <head>

     5   <title>script.aculo.us Unit test file</title>

     6   <meta http-equiv="content-type" content="text/html; charset=utf-8" />

     7   <script src="../../lib/prototype.js" type="text/javascript"></script>

     8   <script src="../../src/scriptaculous.js" type="text/javascript"></script>

     9   <script src="../../src/unittest.js" type="text/javascript"></script>

    10   <link rel="stylesheet" href="../test.css" type="text/css" />

    11 </head>

    12 <body>

    13 <h1>script.aculo.us Unit test file</h1>

    14 <p>

    15   Tests for builder.js

    16 </p>

    18 <!-- Log output -->

    19 <div id="testlog"> </div>

    21 <div id="result"></div>

    23 <!-- Tests follow -->

    24 <script type="text/javascript" language="javascript" charset="utf-8">

    25 // <![CDATA[

    27   // Serializes a node and its contents to plain old HTML

    28   // IMPORTANT: style attributes can't be correctly serialized cross-browser wise,

    29   // so the contents of style attributes must match what IE thinks is correct

    30   function serializeNode(node){

    31     if(node.nodeType == 3) return node.nodeValue;

    32     node = $(node);

    33     var tag = node.tagName.toLowerCase();

    34     return '<' + ([tag].concat($A(node.attributes).map(function(attr){

    35       // Filter out stuff that we don't need

    36       if(attr.nodeName == '_extended' || attr.nodeName == '_counted' ||

    37         typeof attr.nodeValue == 'function' ||!Element.hasAttribute(node, attr.nodeName)) return;

    38       // remove trailing ; in style attributes on Firefox

    39       var value = node.readAttribute(attr.nodeName);

    40       if(attr.nodeName == 'style' && value.endsWith(';'))

    41         value = value.substr(0, value.length-1);

    42       return attr.nodeName + '="' + value + '"'

    43     }).compact().sort())).join(' ') + '>' + $A(node.childNodes).map(serializeNode).join('') +

    44     '</' + tag + '>';

    45   }

    47   new Test.Unit.Runner({

    49     setup: function() {

    50       $('result').innerHTML = '';

    51     },

    53     testBuilderBasics: function() { with(this) {

    54       var element = Builder.node('div');

    55       assertEqual('DIV', element.nodeName);

    57       var element = Builder.node('div',{id:'mydiv'})

    58       assertEqual('mydiv', element.id);

    60       var element = Builder.node('div',{id:'mydiv',className:'one two'})

    61       assertEqual('mydiv', element.id);

    62       assertEqual('one two', element.className);

    64       var element = Builder.node('span','text 123 <blah>');

    65       assertEqual('SPAN', element.nodeName);

    66       assertEqual('text 123 &lt;blah&gt;', element.innerHTML);

    68       var element = Builder.node('span',123);

    69       assertEqual('SPAN', element.nodeName);

    70       assertEqual('123', element.innerHTML);

    72       var element = Builder.node('span',['test']);

    73       assertEqual('SPAN', element.nodeName);

    74       assertEqual('test', element.innerHTML);

    76       var element = Builder.node('span',['test',123]);

    77       assertEqual('SPAN', element.nodeName);

    78       assertEqual('test123', element.innerHTML);

    80       var element = Builder.node('span',{},['test',123]);

    81       assertEqual('SPAN', element.nodeName);

    82       assertEqual('test123', element.innerHTML);

    84       var element = Builder.node('span',{id:'myspan'},['test',123]);

    85       assertEqual('SPAN', element.nodeName);

    86       assertEqual('myspan', element.id);

    87       assertEqual('test123', element.innerHTML);

    89       var element = Builder.node('div',[1,2,[3],[[[4],5],6],7,8,[[[[9]]],0]]);

    90       assertEqual('1234567890',element.innerHTML);

    92       var element = Builder.node('div',[1,'2',['3'],[[[4],'5'],6],7,'8',[[[['9']]],0]]);

    93       assertEqual('1234567890',element.innerHTML);

    95       var element = Builder.node('div',{id:'mydiv'},[1,2,[3],[[[4],5],6],7,8,[[[[9]]],0]]);

    96       assertEqual('1234567890',element.innerHTML);

    98       var element = Builder.node('div',{id:'mydiv'},[1,'2',['3'],[[[4],'5'],6],7,'8',[[[['9']]],0]]);

    99       assertEqual('1234567890',element.innerHTML);

   100       assertEqual(10, element.childNodes.length);

   102       var element = Builder.node('div', Builder.node('span'));

   103       assertEqual(1, element.childNodes.length);

   104       assertEqual('SPAN', element.childNodes[0].tagName);

   106       var element = Builder.node('div', {id:'mydiv'}, Builder.node('span'));

   107       assertEqual(1, element.childNodes.length);

   108       assertEqual('mydiv', element.id);

   109       assertEqual('SPAN', element.childNodes[0].tagName);

   110     }},

   112     testBuilderClassAndFor: function() { with(this) {

   113       var elt = Builder.node('div', { className: 'demoClass' });

   114       assertEqual('demoClass', elt.className);

   115       var elt = Builder.node('label', { htmlFor: 'mydiv' });

   116       assertEqual('mydiv', elt.htmlFor);

   117     }},

   119     testBuilderAllXHTMLTags: function() { with(this) {

   120       var XHTML_TAGS = [

   121         'a','abbr','acronym','address','applet','area',

   122         'b','bdo','big','blockquote','br','button',

   123         'caption','cite','code','col','colgroup',

   124         'dd','del','dfn','div','dl','dt',

   125         'em',

   126         'fieldset','form',

   127         'h1','h2','h3','h4','h5','h6','hr',

   128         'i','iframe','img','input','ins',

   129         'kbd',

   130         'label','legend','li',

   131         'map',

   132         'object','ol','optgroup','option',

   133         'p','param','pre',

   134         'q',

   135         'samp','script','select','small','span','strong','style','sub','sup',

   136         'table','tbody','td','textarea','tfoot','th','thead','tr','tt',

   137         'ul','var']

   139       XHTML_TAGS.each(function(tag) {

   140         try {

   141           var element = Builder.node(tag);

   142           assertNotNull(element, 'Tag "'+tag+'" expected, but was null.');

   143           assertEqual(tag.toUpperCase(), element.nodeName);

   145           var element = Builder.node(tag,{id:'tag_'+tag+'_test_id'});

   146           assertEqual(tag.toUpperCase(), element.nodeName);

   147           assertEqual('tag_'+tag+'_test_id', element.id, 'Setting id attribute for "'+tag+'" failed!');

   148         } catch(e) {

   149           assert(false, 'Error while creating node of type '+tag+'. Note: Firefox bug in 1.0.X on option and optgroup, fixed in 1.5b1. Internet Explorer 6 doesn\'t support the ABBR tag and has no standard DOM implementation for tables.');

   150         }

   151       });

   152     }},

   154     // special case, because requires workarounds on IE and Firefox < 1.5

   155     testBuilderOptionTag: function() { with(this) {

   156       assertEqual('', Builder.node('option').innerHTML);

   157       assertEqual('test', Builder.node('option','test').innerHTML);

   158       assertEqual('', Builder.node('option',{className:'test'}).innerHTML);

   159       assertEqual('test', Builder.node('option',{className:'test'},'test').innerHTML);

   160       assertEqual('test', Builder.node('option',{},'test').innerHTML);

   162       var selectElement = Builder.node('select');

   163       var optionElement = Builder.node('option',{className:'test',id:'option_123'},123);

   164       selectElement.appendChild(optionElement);

   165       document.body.appendChild(selectElement);

   166       assertEqual('123', $('option_123').innerHTML);

   167     }},

   169     testBuilderContatenation: function() { with(this) {

   170       var element = Builder.node('div', [Builder.node('span')]);

   171       assertEqual('DIV', element.nodeName);

   172       assertEqual(1, element.childNodes.length);

   173       assertEqual('SPAN', element.firstChild.nodeName);

   175       var element = Builder.node('div', [Builder.node('span'),'text']);

   176       assertEqual(2, element.childNodes.length);

   177       assertEqual(0, element.firstChild.childNodes.length);

   178       assertEqual('DIV', element.nodeName);

   179       assertEqual('SPAN', element.firstChild.nodeName);

   180       assertEqual(3, element.firstChild.nextSibling.nodeType);

   182       var element = Builder.node('div', [Builder.node('span',[Builder.node('strong','blah')]),'text']);

   183       assertEqual(2, element.childNodes.length);

   184       assertEqual(1, element.firstChild.childNodes.length);

   185       assertEqual('DIV', element.nodeName);

   186       assertEqual('SPAN', element.firstChild.nodeName);

   187       assertEqual('STRONG', element.firstChild.firstChild.nodeName);

   188       assertEqual('blah', element.firstChild.firstChild.innerHTML);

   189       assertEqual(3, element.firstChild.nextSibling.nodeType);

   190     }},

   192     testBuilderComplexExample: function() { with(this) {

   193       var element = Builder.node('div',{id:'ghosttrain'},[

   194         Builder.node('div',{style:'font-weight: bold; font-size: 11px'},[

   195           Builder.node('h1','Ghost Train'),

   196           "testtext", 2, 3, 4,

   197           Builder.node('ul',[

   198             Builder.node('li',{onclick:'alert(\'test\')'},'click me')

   199           ]),

   200         ]),

   201       ]);

   202       assertEqual('DIV', element.nodeName);

   204       $('result').appendChild(element);

   206       // browsers aren't sure about upper and lower case on elements

   207       assertEqual(

   208         '<div id="ghosttrain"><div style="font-weight: bold; font-size: 11px">' +

   209         '<h1>Ghost Train</h1>testtext234<ul><li onclick="alert(\'test\')">click me</li></ul></div></div>',

   210         serializeNode($('result').childNodes[0]));

   211     }},

   213     testBuilderShortcuts: function() { with(this) {

   214       Builder.dump();

   216       var element = DIV(SPAN());

   217       assertEqual('SPAN', element.childNodes[0].tagName);

   219       var element = DIV({id:'test'},SPAN());

   220       assertEqual('SPAN', element.childNodes[0].tagName);

   222       var element = DIV({id:'ghosttrain'},[

   223          DIV({style:'font-weight: bold; font-size: 11px'},[

   224            H1('Ghost Train'),

   225            "testtext", 2, 3, 4,

   226            UL([

   227              LI({onclick:'alert(\'test\')'},'click me')

   228            ]),

   229          ]),

   230        ]);

   231       assertEqual('DIV', element.nodeName);

   233       $('result').appendChild(element);

   235       assertEqual(

   236         '<div id="ghosttrain"><div style="font-weight: bold; font-size: 11px">' +

   237         '<h1>Ghost Train</h1>testtext234<ul><li onclick="alert(\'test\')">click me</li></ul></div></div>',

   238         serializeNode($('result').childNodes[0]));

   239     }},

   241     testBuilderBuild: function() { with(this) {

   242       ['<span>this is <b>neat!</b></span>',' \n<span>this is <b>neat!</b></span>\n '].each(

   243         function(html){

   244           var node = Builder.build(html);

   245           assertEqual('<span>this is <b>neat!</b></span>', serializeNode(node));

   246         });

   247     }},

   249     testBuilderAttributeEscaping: function() { with(this) {

   250       var element = Builder.node('div',{blah:"<foo'bar&baz\"bat>"});

   251       assertEqual("<foo'bar&baz\"bat>", $(element).readAttribute('blah'));

   252     }}

   254   });

   255 // ]]>

   256 </script>

   257 </body>

   258 </html>

The Tor Browser / file revision

dom/tests/mochitest/ajax/scriptaculous/test/unit/builder_test.html@b8a032363ba2

dom/tests/mochitest/ajax/scriptaculous/test/unit/builder_test.html