From 5f8de423f190bbb79a62f804151bc24824fa32d8 Mon Sep 17 00:00:00 2001
From: "Matt A. Tobin" <mattatobin@localhost.localdomain>
Date: Fri, 2 Feb 2018 04:16:08 -0500
Subject: Add m-esr52 at 52.6.0

---
 .../test/unit/_ajax_inplaceeditor_result.html      |   1 +
 .../test/unit/_ajax_inplaceeditor_text.html        |   1 +
 .../test/unit/_ajax_updater_result.html            |  20 +
 .../test/unit/_autocomplete_result.html            |  11 +
 .../test/unit/_autocomplete_result_nobr.html       |   1 +
 .../test/unit/ajax_autocompleter_test.html         | 232 +++++++++++
 .../test/unit/ajax_inplaceeditor_test.html         | 152 +++++++
 .../ajax/scriptaculous/test/unit/bdd_test.html     | 138 +++++++
 .../ajax/scriptaculous/test/unit/builder_test.html | 258 ++++++++++++
 .../scriptaculous/test/unit/dragdrop_test.html     | 131 ++++++
 .../ajax/scriptaculous/test/unit/effects_test.html | 250 ++++++++++++
 .../ajax/scriptaculous/test/unit/element_test.html | 104 +++++
 .../ajax/scriptaculous/test/unit/icon.png          | Bin 0 -> 281 bytes
 .../ajax/scriptaculous/test/unit/loading_test.html |  41 ++
 .../test/unit/position_clone_test.html             | 312 +++++++++++++++
 .../ajax/scriptaculous/test/unit/slider_test.html  | 438 +++++++++++++++++++++
 .../scriptaculous/test/unit/sortable_test.html     | 205 ++++++++++
 .../ajax/scriptaculous/test/unit/string_test.html  |  67 ++++
 .../ajax/scriptaculous/test/unit/unit_test.html    | 154 ++++++++
 19 files changed, 2516 insertions(+)
 create mode 100644 dom/tests/mochitest/ajax/scriptaculous/test/unit/_ajax_inplaceeditor_result.html
 create mode 100644 dom/tests/mochitest/ajax/scriptaculous/test/unit/_ajax_inplaceeditor_text.html
 create mode 100644 dom/tests/mochitest/ajax/scriptaculous/test/unit/_ajax_updater_result.html
 create mode 100644 dom/tests/mochitest/ajax/scriptaculous/test/unit/_autocomplete_result.html
 create mode 100644 dom/tests/mochitest/ajax/scriptaculous/test/unit/_autocomplete_result_nobr.html
 create mode 100644 dom/tests/mochitest/ajax/scriptaculous/test/unit/ajax_autocompleter_test.html
 create mode 100644 dom/tests/mochitest/ajax/scriptaculous/test/unit/ajax_inplaceeditor_test.html
 create mode 100644 dom/tests/mochitest/ajax/scriptaculous/test/unit/bdd_test.html
 create mode 100644 dom/tests/mochitest/ajax/scriptaculous/test/unit/builder_test.html
 create mode 100644 dom/tests/mochitest/ajax/scriptaculous/test/unit/dragdrop_test.html
 create mode 100644 dom/tests/mochitest/ajax/scriptaculous/test/unit/effects_test.html
 create mode 100644 dom/tests/mochitest/ajax/scriptaculous/test/unit/element_test.html
 create mode 100644 dom/tests/mochitest/ajax/scriptaculous/test/unit/icon.png
 create mode 100644 dom/tests/mochitest/ajax/scriptaculous/test/unit/loading_test.html
 create mode 100644 dom/tests/mochitest/ajax/scriptaculous/test/unit/position_clone_test.html
 create mode 100644 dom/tests/mochitest/ajax/scriptaculous/test/unit/slider_test.html
 create mode 100644 dom/tests/mochitest/ajax/scriptaculous/test/unit/sortable_test.html
 create mode 100644 dom/tests/mochitest/ajax/scriptaculous/test/unit/string_test.html
 create mode 100644 dom/tests/mochitest/ajax/scriptaculous/test/unit/unit_test.html

(limited to 'dom/tests/mochitest/ajax/scriptaculous/test/unit')

diff --git a/dom/tests/mochitest/ajax/scriptaculous/test/unit/_ajax_inplaceeditor_result.html b/dom/tests/mochitest/ajax/scriptaculous/test/unit/_ajax_inplaceeditor_result.html
new file mode 100644
index 000000000..55dcbeae1
--- /dev/null
+++ b/dom/tests/mochitest/ajax/scriptaculous/test/unit/_ajax_inplaceeditor_result.html
@@ -0,0 +1 @@
+Server received: To be edited
\ No newline at end of file
diff --git a/dom/tests/mochitest/ajax/scriptaculous/test/unit/_ajax_inplaceeditor_text.html b/dom/tests/mochitest/ajax/scriptaculous/test/unit/_ajax_inplaceeditor_text.html
new file mode 100644
index 000000000..a6f35d132
--- /dev/null
+++ b/dom/tests/mochitest/ajax/scriptaculous/test/unit/_ajax_inplaceeditor_text.html
@@ -0,0 +1 @@
+Text from server
\ No newline at end of file
diff --git a/dom/tests/mochitest/ajax/scriptaculous/test/unit/_ajax_updater_result.html b/dom/tests/mochitest/ajax/scriptaculous/test/unit/_ajax_updater_result.html
new file mode 100644
index 000000000..5f11f56ce
--- /dev/null
+++ b/dom/tests/mochitest/ajax/scriptaculous/test/unit/_ajax_updater_result.html
@@ -0,0 +1,20 @@
+Test text
+
+<script type="text/javascript" language="javascript" charset="utf-8">
+// <![CDATA[
+  alert('fragment1 hit!');
+// ]]>
+</script>
+
+more test text
+
+
+<script>alert('fragment2 hit!')</script>
+
+
+even more test text
+
+<script type="text/javascript">
+  alert('fragment3 hit!');
+</script> some other test text
+
diff --git a/dom/tests/mochitest/ajax/scriptaculous/test/unit/_autocomplete_result.html b/dom/tests/mochitest/ajax/scriptaculous/test/unit/_autocomplete_result.html
new file mode 100644
index 000000000..f03b34ffc
--- /dev/null
+++ b/dom/tests/mochitest/ajax/scriptaculous/test/unit/_autocomplete_result.html
@@ -0,0 +1,11 @@
+<ul>
+  <li>test1</li><li>test2</li>
+  <li>test3</li>
+<li><b>BOLD</b></li>
+
+  <li><span class="informal">(GET ME NOT)</span>(GET &lt;ME&gt; INSTEAD)</li>
+
+  <li>Here we have <a href="_autocomplete_result.html">a link</a> which should work</li>
+  
+  <li>Here we have some international ©∏Á®Äç†∑rß</li>
+</ul>
\ No newline at end of file
diff --git a/dom/tests/mochitest/ajax/scriptaculous/test/unit/_autocomplete_result_nobr.html b/dom/tests/mochitest/ajax/scriptaculous/test/unit/_autocomplete_result_nobr.html
new file mode 100644
index 000000000..742ff18f1
--- /dev/null
+++ b/dom/tests/mochitest/ajax/scriptaculous/test/unit/_autocomplete_result_nobr.html
@@ -0,0 +1 @@
+<ul><li>test1</li><li>test2</li><li>test3</li><li><b>BOLD</b></li><li><span class="informal">(GET ME NOT)</span>(GET &lt;ME&gt; INSTEAD)</li><li>Here we have <a href="_autocomplete_result.html">a link</a> which should work</li><li>Here we have some international ©∏Á®Äç†∑rß</li></ul>
\ No newline at end of file
diff --git a/dom/tests/mochitest/ajax/scriptaculous/test/unit/ajax_autocompleter_test.html b/dom/tests/mochitest/ajax/scriptaculous/test/unit/ajax_autocompleter_test.html
new file mode 100644
index 000000000..69c1fadc7
--- /dev/null
+++ b/dom/tests/mochitest/ajax/scriptaculous/test/unit/ajax_autocompleter_test.html
@@ -0,0 +1,232 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<head>
+  <title>script.aculo.us Unit test file</title>
+  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
+  <script src="../../lib/prototype.js" type="text/javascript"></script>
+  <script src="../../src/scriptaculous.js" type="text/javascript"></script>
+  <script src="../../src/unittest.js" type="text/javascript"></script>
+  <link rel="stylesheet" href="../test.css" type="text/css" />
+  <style>
+    .selected { background-color: #888; }
+  </style>
+</head>
+<body>
+<h1>script.aculo.us Unit test file</h1>
+<p>
+  Tests for Ajax.Autocompleter in controls.js.
+</p>
+
+<!-- Log output -->
+<div id="testlog"> </div>
+
+<input id="ac_input" type="text" autocomplete="off" />
+<div id="ac_update" style="display:none;border:1px solid black;background-color:white;position:relative;"></div>
+
+<input id="ac_input_br" type="text" autocomplete="off" />
+<div id="ac_update_br" style="display:none;border:1px solid black;background-color:white;position:relative;"></div>
+
+<input id="ac2_input" type="text" autocomplete="off" />
+<div id="ac2_update" style="display:none;border:1px solid black;background-color:white;position:relative;"></div>
+
+<input id="actoken_input" type="text" autocomplete="off" />
+<div id="actoken_update" style="display:none;border:1px solid black;background-color:white;position:relative;"></div>
+
+<input id="dummy_element" type="text" autocomplete="off" />
+
+<!-- Tests follow -->
+<script type="text/javascript" language="javascript" charset="utf-8">
+// <![CDATA[
+
+  
+  new Test.Unit.Runner({
+    
+    // Integration test, tests the entire cycle
+    testAjaxAutocompleter: function() { with(this) {
+      var ac = new Ajax.Autocompleter('ac_input','ac_update','_autocomplete_result.html',
+        { method: 'get' }); //override so we can use a static for the result
+      assertInstanceOf(Ajax.Autocompleter, ac);
+      
+      // box not visible
+      assertNotVisible('ac_update');
+      
+      // focus, but box not visible
+      Event.simulateMouse('ac_input', 'click');
+      assertNotVisible('ac_update');
+      
+      Event.simulateKeys('ac_input','abcdefg');
+      assertEqual('abcdefg', $('ac_input').value);
+      
+      // check box popping up on input
+      wait(1000, function() { with(this) {
+        assertVisible('ac_update');
+        assertEqual('test1', $('ac_update').firstChild.firstChild.innerHTML);
+        assertEqual('test2', $('ac_update').firstChild.firstChild.nextSibling.innerHTML);
+        
+        // intl. characters return (UTF-8)
+        assertEqual('Here we have some international ©∏Á®Äç†∑rß', $('ac_update').firstChild.lastChild.innerHTML);
+                
+        // first entry should be selected
+        assert(Element.hasClassName($('ac_update').firstChild.firstChild, 'selected'),'Selected item should have a className of: selected');
+        
+        Event.simulateKey('ac_input','keypress',{keyCode:Event.KEY_DOWN});
+        
+        // second entry should be selected
+        assert(!Element.hasClassName($('ac_update').firstChild.firstChild),'Item shouldn\'t have a className of: selected');
+        assert(Element.hasClassName($('ac_update').firstChild.firstChild.nextSibling, 'selected'),'Second entry should have a className of: selected');
+        
+        // check selecting with <TAB>
+        Event.simulateKey('ac_input','keypress',{keyCode:Event.KEY_TAB});
+        assertEqual('test2',$('ac_input').value);
+        
+        // check box going away
+        wait(500, function() { with(this) {
+          assertNotVisible('ac_update');
+          
+          // check selecting with mouse click
+          Event.simulateKeys('ac_input','3');
+          assertEqual('test23', $('ac_input').value);
+          wait(1000, function() { with(this) {
+            assertVisible('ac_update');
+            Event.simulateMouse($('ac_update').firstChild.childNodes[4],'click');
+                    
+            wait(1000, function() { with(this) {
+              // tests if removal of 'informal' nodes and HTML escaping works
+              assertEqual('(GET <ME> INSTEAD)',$('ac_input').value);
+              assertNotVisible('ac_update');
+              
+                // check cancelling with <ESC>
+                Event.simulateKeys('ac_input','abcdefg');
+                
+                wait(1000, function() { with(this) {
+                  assertVisible('ac_update');
+                  assertEqual('(GET <ME> INSTEAD)abcdefg', $('ac_input').value);
+                  
+                  Event.simulateKey('ac_input','keypress',{keyCode:Event.KEY_DOWN});
+                  Event.simulateKey('ac_input','keypress',{keyCode:Event.KEY_ESC});
+
+                  assertEqual('(GET <ME> INSTEAD)abcdefg', $('ac_input').value);
+                }});
+            }});
+          }});
+        }});
+      }});
+    }},
+    
+    testAfterUpdateElement: function() { with(this) {
+      var ac = new Ajax.Autocompleter('ac2_input','ac2_update','_autocomplete_result.html',
+        { method: 'get',
+          afterUpdateElement: function(element,selectedElement) { 
+            element.value = 'afterupdate:' + selectedElement.tagName; 
+          }
+         });
+      assertInstanceOf(Ajax.Autocompleter, ac);
+      
+      Event.simulateMouse('ac2_input', 'click');
+      Event.simulateKeys('ac2_input','abcdefg');
+      
+      wait(1000, function() { with(this) {
+        assertVisible('ac2_update');
+        Event.simulateKey('ac2_input','keypress',{keyCode:Event.KEY_TAB});
+        
+        assertEqual('afterupdate:LI',$('ac2_input').value);
+      }});
+    }},
+    
+    testTokenizing: function() { with(this) {
+      var actoken = new Ajax.Autocompleter('actoken_input','ac_update','_autocomplete_result.html',
+        { tokens:',', method: 'get' });
+      assertInstanceOf(Ajax.Autocompleter, actoken);
+      
+      Event.simulateKeys('actoken_input','abc');
+      
+      wait(1000, function() { with(this) {
+        Event.simulateKey('actoken_input','keypress',{keyCode:Event.KEY_TAB});
+        assertEqual('test1',$('actoken_input').value);
+        Event.simulateKeys('actoken_input',',abc');
+        wait(1000, function() { with(this) {
+          Event.simulateKey('actoken_input','keypress',{keyCode:Event.KEY_DOWN});
+          Event.simulateKey('actoken_input','keypress',{keyCode:Event.KEY_TAB});
+          assertEqual('test1,test2',$('actoken_input').value);
+        }});
+      }});
+    }},
+    
+    // Same integration test, results has no linebreaks
+    testAjaxAutocompleterNoLinebreaksInResult: function() { with(this) {
+      var ac = new Ajax.Autocompleter('ac_input_br','ac_update_br','_autocomplete_result_nobr.html',
+        { method: 'get' }); //override so we can use a static for the result
+      assertInstanceOf(Ajax.Autocompleter, ac);
+
+      // box not visible
+      assertNotVisible('ac_update_br');
+
+      // focus, but box not visible
+      Event.simulateMouse('ac_input_br', 'click');
+      assertNotVisible('ac_update_br');
+
+      Event.simulateKeys('ac_input_br','abcdefg');
+      assertEqual('abcdefg', $('ac_input_br').value);
+
+      // check box popping up on input
+      wait(1000, function() { with(this) {
+        assertVisible('ac_update_br');
+        assertEqual('test1', $('ac_update_br').firstChild.firstChild.innerHTML);
+        assertEqual('test2', $('ac_update_br').firstChild.firstChild.nextSibling.innerHTML);
+
+        // intl. characters return (UTF-8)
+        assertEqual('Here we have some international ©∏Á®Äç†∑rß', $('ac_update_br').firstChild.lastChild.innerHTML);
+
+        // first entry should be selected
+        assert(Element.hasClassName($('ac_update_br').firstChild.firstChild, 'selected'),'Selected item should have a className of: selected');
+
+        Event.simulateKey('ac_input_br','keypress',{keyCode:Event.KEY_DOWN});
+
+        // second entry should be selected
+        assert(!Element.hasClassName($('ac_update_br').firstChild.firstChild),'Item shouldn\'t have a className of: selected');
+        assert(Element.hasClassName($('ac_update_br').firstChild.firstChild.nextSibling, 'selected'),'Second entry should have a className of: selected');
+
+        // check selecting with <TAB>
+        Event.simulateKey('ac_input_br','keypress',{keyCode:Event.KEY_TAB});
+        assertEqual('test2',$('ac_input_br').value);
+
+        // check box going away
+        wait(500, function() { with(this) {
+          assertNotVisible('ac_update_br');
+
+          // check selecting with mouse click
+          Event.simulateKeys('ac_input_br','3');
+          assertEqual('test23', $('ac_input_br').value);
+          wait(1000, function() { with(this) {
+            assertVisible('ac_update_br');
+            Event.simulateMouse($('ac_update_br').firstChild.childNodes[4],'click');
+
+            wait(1000, function() { with(this) {
+              // tests if removal of 'informal' nodes and HTML escaping works
+              assertEqual('(GET <ME> INSTEAD)',$('ac_input_br').value);
+              assertNotVisible('ac_update_br');
+
+                // check cancelling with <ESC>
+                Event.simulateKeys('ac_input_br','abcdefg');
+
+                wait(1000, function() { with(this) {
+                  assertVisible('ac_update_br');
+                  assertEqual('(GET <ME> INSTEAD)abcdefg', $('ac_input_br').value);
+
+                  Event.simulateKey('ac_input_br','keypress',{keyCode:Event.KEY_DOWN});
+                  Event.simulateKey('ac_input_br','keypress',{keyCode:Event.KEY_ESC});
+
+                  assertEqual('(GET <ME> INSTEAD)abcdefg', $('ac_input_br').value);
+                }});
+            }});
+          }});
+        }});
+      }});
+    }}
+
+  });
+// ]]>
+</script>
+</body>
+</html>
\ No newline at end of file
diff --git a/dom/tests/mochitest/ajax/scriptaculous/test/unit/ajax_inplaceeditor_test.html b/dom/tests/mochitest/ajax/scriptaculous/test/unit/ajax_inplaceeditor_test.html
new file mode 100644
index 000000000..c68f09422
--- /dev/null
+++ b/dom/tests/mochitest/ajax/scriptaculous/test/unit/ajax_inplaceeditor_test.html
@@ -0,0 +1,152 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<head>
+  <title>script.aculo.us Unit test file</title>
+  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
+  <script src="../../lib/prototype.js" type="text/javascript"></script>
+  <script src="../../src/scriptaculous.js" type="text/javascript"></script>
+  <script src="../../src/unittest.js" type="text/javascript"></script>
+  <link rel="stylesheet" href="../test.css" type="text/css" />
+</head>
+<body>
+<h1>script.aculo.us Unit test file</h1>
+<p>
+  Tests for Ajax.InPlaceEditor in controls.js
+</p>
+
+<!-- Log output -->
+<div id="testlog"> </div>
+
+<h1 id="tobeedited">To be edited</h1>
+<a id="tobeeditedEditControl" href="#">edit</a>
+
+<div id="tobeeditedMultiLine">First line<br/>Second line<br/>Third line</div>
+
+<!-- Tests follow -->
+<script type="text/javascript" language="javascript" charset="utf-8">
+// <![CDATA[
+
+  new Test.Unit.Runner({
+
+    setup: function() { with(this) {
+      inPlaceEditor = new Ajax.InPlaceEditor($('tobeedited'), '_ajax_inplaceeditor_result.html', {
+        externalControl: $('tobeeditedEditControl'),
+        ajaxOptions: {method: 'get'} //override so we can use a static for the result
+      });
+      inPlaceEditorMultiLine = new Ajax.InPlaceEditor($('tobeeditedMultiLine'), '_ajax_inplaceeditor_result.html', {
+        ajaxOptions: {method: 'get'} //override so we can use a static for the result
+      });
+    }},
+
+    teardown: function() { with(this) {
+      inPlaceEditor.dispose();
+    }},
+
+    testDisposesProperly: function() { with(this) {
+      assertEqual("transparent", Element.getStyle('tobeedited','background-color'));
+      inPlaceEditor.dispose();
+      assertEqual("transparent", Element.getStyle('tobeedited','background-color'));
+      assertVisible($('tobeedited'));
+      Event.simulateMouse('tobeedited','click');
+      assertVisible($('tobeedited'));
+    }},
+
+    testUsesTextAreaWhenMoreThanOneRows: function() { with(this) {
+      inPlaceEditor.options.rows = 5;
+      inPlaceEditor.enterEditMode();
+      assertEqual("TEXTAREA", document.forms[0].firstChild.tagName);
+      assertEqual("BR", document.forms[0].childNodes[1].tagName);
+    }},
+
+    testCanSpecifyAllTextsThroughOptions: function() { with(this) {
+       // swedish translation ;-)
+      inPlaceEditor.options.okText = "spara";
+      inPlaceEditor.options.cancelText = "avbryt";
+      inPlaceEditor.options.savingText = "Sparar...";
+      inPlaceEditor.enterEditMode();
+      assertEqual("spara", document.forms[0].lastChild.previousSibling.value);
+      assertEqual("avbryt", document.forms[0].lastChild.innerHTML);
+      inPlaceEditor.showSaving();
+      assertEqual("Sparar...", $('tobeedited').innerHTML);
+    }},
+
+    testCanSpecifyFormIdThroughOptions: function() { with(this) {
+      inPlaceEditor.enterEditMode();
+      // default form id
+      assertEqual("tobeedited-inplaceeditor", document.forms[0].id);
+      inPlaceEditor.leaveEditMode();
+      inPlaceEditor.options.formId = "myFormId";
+      inPlaceEditor.enterEditMode();
+      assertEqual("myFormId", document.forms[0].id);
+    }},
+
+    testCantEditWhileSaving: function() { with(this) {
+      inPlaceEditor.onLoading();
+      Event.simulateMouse('tobeedited','mouseover');
+      assertEqual("transparent", Element.getStyle('tobeedited','background-color'));
+      Event.simulateMouse('tobeedited','click');
+      assertVisible($('tobeedited'));
+    }},
+
+    testCallbackFunctionGetsCalled: function() { with(this) {
+      called = false;
+      inPlaceEditor.options.callback = function(form) {
+        called = true;
+      }
+      Event.simulateMouse('tobeedited','click');
+      Event.simulateMouse(document.forms[0].childNodes[1],'click');
+      assert(called, "callback was not called");
+    }},
+
+    testCanUseExternalElementToGoIntoEditMode: function() { with(this) {
+      Event.simulateMouse('tobeeditedEditControl','click');
+      assertNotNull(document.forms[0], "external control didn't work");
+      // doesn't work if you click it again while in edit mode
+      Event.simulateMouse('tobeeditedEditControl','click');
+      assertNull(document.forms[1], "external control created two forms");
+      assertNotVisible($('tobeeditedEditControl'));
+      Event.simulateMouse(document.forms[0].childNodes[2],'click');
+      assertVisible($('tobeeditedEditControl'));
+    }},
+
+    testHasLineBreaksDetectsHTMLLineBreaks: function() { with(this) {
+      assert(inPlaceEditorMultiLine.hasHTMLLineBreaks("Line 1<br/>Line 2"));
+      assert(inPlaceEditorMultiLine.hasHTMLLineBreaks("Line 1<br>Line 2"));
+      assert(inPlaceEditorMultiLine.hasHTMLLineBreaks("<p>Line 1</p>Line 2"));
+      assert(inPlaceEditorMultiLine.hasHTMLLineBreaks("Line 1<BR/>Line 2"));
+      assert(inPlaceEditorMultiLine.hasHTMLLineBreaks("Line 1<BR>Line 2"));
+      assert(inPlaceEditorMultiLine.hasHTMLLineBreaks("<P>Line 1</P>Line 2"));
+      assert(inPlaceEditorMultiLine.hasHTMLLineBreaks("<P>Line 1<P>Line 2"));
+      assert(!inPlaceEditorMultiLine.hasHTMLLineBreaks("One line"));
+    }},
+
+    testConvertsHTMLLineBreaksIntoNewLines: function() { with(this) {
+      assertEqual("Line 1\nLine 2", inPlaceEditorMultiLine.convertHTMLLineBreaks("Line 1<br/>Line 2"));
+      assertEqual("Line 1\nLine 2", inPlaceEditorMultiLine.convertHTMLLineBreaks("Line 1<br>Line 2"));
+      // <p> not supported (too hard)
+      //assertEqual("Line 1\nLine 2", inPlaceEditorMultiLine.convertHTMLLineBreaks("<p>Line 1</p>Line 2"));
+      assertEqual("Line 1\nLine 2", inPlaceEditorMultiLine.convertHTMLLineBreaks("Line 1<BR/>Line 2"));
+      assertEqual("Line 1\nLine 2", inPlaceEditorMultiLine.convertHTMLLineBreaks("Line 1<BR>Line 2"));
+      // <p> not supported (too hard)
+      //assertEqual("Line 1\nLine 2", inPlaceEditorMultiLine.convertHTMLLineBreaks("<P>Line 1</P>Line 2"));
+      // unclosed <P>s not supported yet
+      //assertEqual("Line 1\nLine 2", inPlaceEditorMultiLine.convertHTMLLineBreaks("<P>Line 1<P>Line 2"));
+      // <p> not supported (too hard)
+      //assertEqual("Line 1\nLine 2\nLine 3\nLine 4", inPlaceEditorMultiLine.convertHTMLLineBreaks("<P>Line 1</P>Line 2<br>Line 3<p>Line 4</P>"));
+      assertEqual("One line", inPlaceEditorMultiLine.convertHTMLLineBreaks("One line"));
+    }},
+
+    testConvertsParagraphsAndBRsIntoLineBreaks: function() { with(this) {
+      inPlaceEditorMultiLine.enterEditMode();
+      assertEqual("TEXTAREA", document.forms[0].firstChild.tagName);
+      assertEqual("First line\nSecond line\nThird line", document.forms[0].firstChild.value)
+      // doesn't automatically determine size yet
+      //assertEqual(3, document.forms[0].firstChild.rows);
+    }}
+
+  });
+// ]]>
+</script>
+</body>
+</html>
diff --git a/dom/tests/mochitest/ajax/scriptaculous/test/unit/bdd_test.html b/dom/tests/mochitest/ajax/scriptaculous/test/unit/bdd_test.html
new file mode 100644
index 000000000..02cb10bff
--- /dev/null
+++ b/dom/tests/mochitest/ajax/scriptaculous/test/unit/bdd_test.html
@@ -0,0 +1,138 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<head>
+  <title>script.aculo.us Unit test file</title>
+  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
+  <script src="../../lib/prototype.js" type="text/javascript"></script>
+  <script src="../../src/scriptaculous.js" type="text/javascript"></script>
+  <script src="../../src/unittest.js" type="text/javascript"></script>
+  <link rel="stylesheet" href="../test.css" type="text/css" />
+</head>
+<body>
+<h1>script.aculo.us Unit test file</h1>
+
+<!-- Log output -->
+<div id="testlog"> </div>
+
+<div id="d">initial</div>
+
+<!-- Tests follow -->
+<script type="text/javascript" language="javascript" charset="utf-8">
+// <![CDATA[
+var moo = 0;
+
+var assertMethods = [];
+for(method in Test.Unit.Assertions.prototype) {
+  if(/^assert/.test(method)) assertMethods.push(method);
+}
+
+var testObj = {
+  isNice: function(){
+    return true;
+  },
+  isBroken: function(){
+    return false;
+  }
+}
+
+Test.context("BDD-style testing",{
+  
+  setup: function() {
+    $('d').update('setup!');
+    moo++;
+  },
+  
+  teardown: function() {
+    moo--;
+  },
+  
+  'should run setup before each specification': function(){
+    assert($('d').innerHTML == 'setup!');
+    assert(moo == 1);
+  },
+  
+  'should run teardown after each specification': function(){
+    assert(moo == 1);
+  },
+  
+  'should provide extensions to tie in isSomething and respondsTo object methods': function(){
+    Object.extend(testObj, Test.BDDMethods);
+    
+    testObj.shouldBe('nice');
+    testObj.shouldNotBe('broken');
+    
+    testObj.shouldRespondTo('isNice');
+    testObj.shouldRespondTo('isBroken');
+  },
+  
+  'should automatically add extensions to strings': function(){
+    'a'.shouldEqual('a');
+    'a'.shouldNotEqual('b');
+    'a'.shouldNotBeNull();
+    'a'.shouldBeA(String);
+    
+    var aString = 'boo!';
+    aString.shouldEqual('boo!');
+    aString.shouldBeA(String);
+    aString.shouldNotBeA(Number);
+  },
+  
+  'should automatically add extensions to numbers': function(){
+    var n = 123;    
+    n.shouldEqual(123);
+    n.shouldNotEqual(4);
+    
+    n.shouldBeA(Number);
+    n.shouldNotBeA(Test);
+  },
+  
+  'should automatically add extensions to arrays': function(){
+    ['a'].shouldNotBeA(String);
+    [1,2,3].shouldBeAn(Array);
+    [1,2,3].shouldEqualEnum([1,2,3]);
+  },
+  
+  'should support the eval() method': function(){
+    eval('2*2').shouldEqual(4);
+  },
+  
+  'should support equality assertion': function(){
+    assertEqual(1, 1);
+    assertEqual('a', 'a');
+    assertEqual(1, '1');
+    
+    var x = 1;
+    var y = 1;
+    assertEqual(1, x)
+    assertEqual(x, y);
+  },
+  
+  'should provide all assertions': function(){
+    assertMethods.each(function(m){
+      assert(typeof this[m] == 'function');
+    }.bind(this)); 
+  },
+  
+  'should support deferred execution': function(){
+    wait(10,function(){
+      'a'.shouldEqual('a');
+    });
+    
+    wait(10,function(){
+      'a'.shouldEqual('a');
+      wait(10,function(){
+        'a'.shouldEqual('a');
+        wait(10,function(){
+          'a'.shouldEqual('a');
+        });
+      });
+    });
+  }
+  
+});
+
+// ]]>
+</script>
+</body>
+</html>
\ No newline at end of file
diff --git a/dom/tests/mochitest/ajax/scriptaculous/test/unit/builder_test.html b/dom/tests/mochitest/ajax/scriptaculous/test/unit/builder_test.html
new file mode 100644
index 000000000..347519838
--- /dev/null
+++ b/dom/tests/mochitest/ajax/scriptaculous/test/unit/builder_test.html
@@ -0,0 +1,258 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<head>
+  <title>script.aculo.us Unit test file</title>
+  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
+  <script src="../../lib/prototype.js" type="text/javascript"></script>
+  <script src="../../src/scriptaculous.js" type="text/javascript"></script>
+  <script src="../../src/unittest.js" type="text/javascript"></script>
+  <link rel="stylesheet" href="../test.css" type="text/css" />
+</head>
+<body>
+<h1>script.aculo.us Unit test file</h1>
+<p>
+  Tests for builder.js
+</p>
+
+<!-- Log output -->
+<div id="testlog"> </div>
+
+<div id="result"></div>
+
+<!-- Tests follow -->
+<script type="text/javascript" language="javascript" charset="utf-8">
+// <![CDATA[
+
+  // Serializes a node and its contents to plain old HTML
+  // IMPORTANT: style attributes can't be correctly serialized cross-browser wise,
+  // so the contents of style attributes must match what IE thinks is correct
+  function serializeNode(node){
+    if(node.nodeType == 3) return node.nodeValue;
+    node = $(node);
+    var tag = node.tagName.toLowerCase();
+    return '<' + ([tag].concat($A(node.attributes).map(function(attr){
+      // Filter out stuff that we don't need
+      if(attr.nodeName == '_extended' || attr.nodeName == '_counted' || 
+        typeof attr.nodeValue == 'function' ||!Element.hasAttribute(node, attr.nodeName)) return;
+      // remove trailing ; in style attributes on Firefox
+      var value = node.readAttribute(attr.nodeName);
+      if(attr.nodeName == 'style' && value.endsWith(';'))
+        value = value.substr(0, value.length-1); 
+      return attr.nodeName + '="' + value + '"'
+    }).compact().sort())).join(' ') + '>' + $A(node.childNodes).map(serializeNode).join('') + 
+    '</' + tag + '>';
+  }
+
+  new Test.Unit.Runner({
+
+    setup: function() {
+      $('result').innerHTML = '';
+    },
+
+    testBuilderBasics: function() { with(this) {
+      var element = Builder.node('div');
+      assertEqual('DIV', element.nodeName);
+
+      var element = Builder.node('div',{id:'mydiv'})
+      assertEqual('mydiv', element.id);
+            
+      var element = Builder.node('div',{id:'mydiv',className:'one two'})
+      assertEqual('mydiv', element.id);
+      assertEqual('one two', element.className);
+      
+      var element = Builder.node('span','text 123 <blah>');
+      assertEqual('SPAN', element.nodeName);
+      assertEqual('text 123 &lt;blah&gt;', element.innerHTML);
+      
+      var element = Builder.node('span',123);
+      assertEqual('SPAN', element.nodeName);
+      assertEqual('123', element.innerHTML);
+      
+      var element = Builder.node('span',['test']);
+      assertEqual('SPAN', element.nodeName);
+      assertEqual('test', element.innerHTML);
+      
+      var element = Builder.node('span',['test',123]);
+      assertEqual('SPAN', element.nodeName);
+      assertEqual('test123', element.innerHTML);
+      
+      var element = Builder.node('span',{},['test',123]);
+      assertEqual('SPAN', element.nodeName);
+      assertEqual('test123', element.innerHTML);
+      
+      var element = Builder.node('span',{id:'myspan'},['test',123]);
+      assertEqual('SPAN', element.nodeName);
+      assertEqual('myspan', element.id);
+      assertEqual('test123', element.innerHTML);
+      
+      var element = Builder.node('div',[1,2,[3],[[[4],5],6],7,8,[[[[9]]],0]]);
+      assertEqual('1234567890',element.innerHTML);
+      
+      var element = Builder.node('div',[1,'2',['3'],[[[4],'5'],6],7,'8',[[[['9']]],0]]);
+      assertEqual('1234567890',element.innerHTML);
+      
+      var element = Builder.node('div',{id:'mydiv'},[1,2,[3],[[[4],5],6],7,8,[[[[9]]],0]]);
+      assertEqual('1234567890',element.innerHTML);
+      
+      var element = Builder.node('div',{id:'mydiv'},[1,'2',['3'],[[[4],'5'],6],7,'8',[[[['9']]],0]]);
+      assertEqual('1234567890',element.innerHTML);
+      assertEqual(10, element.childNodes.length);
+      
+      var element = Builder.node('div', Builder.node('span'));
+      assertEqual(1, element.childNodes.length);
+      assertEqual('SPAN', element.childNodes[0].tagName);
+      
+      var element = Builder.node('div', {id:'mydiv'}, Builder.node('span'));
+      assertEqual(1, element.childNodes.length);
+      assertEqual('mydiv', element.id);
+      assertEqual('SPAN', element.childNodes[0].tagName);
+    }},
+
+    testBuilderClassAndFor: function() { with(this) {
+      var elt = Builder.node('div', { className: 'demoClass' });
+      assertEqual('demoClass', elt.className);
+      var elt = Builder.node('label', { htmlFor: 'mydiv' });
+      assertEqual('mydiv', elt.htmlFor);
+    }},
+    
+    testBuilderAllXHTMLTags: function() { with(this) {
+      var XHTML_TAGS = [
+        'a','abbr','acronym','address','applet','area',
+        'b','bdo','big','blockquote','br','button',
+        'caption','cite','code','col','colgroup',
+        'dd','del','dfn','div','dl','dt',
+        'em',
+        'fieldset','form',
+        'h1','h2','h3','h4','h5','h6','hr',
+        'i','iframe','img','input','ins',
+        'kbd',
+        'label','legend','li',
+        'map',
+        'object','ol','optgroup','option',
+        'p','param','pre',
+        'q',
+        'samp','script','select','small','span','strong','style','sub','sup',
+        'table','tbody','td','textarea','tfoot','th','thead','tr','tt',
+        'ul','var']
+        
+      XHTML_TAGS.each(function(tag) {
+        try {
+          var element = Builder.node(tag);
+          assertNotNull(element, 'Tag "'+tag+'" expected, but was null.');
+          assertEqual(tag.toUpperCase(), element.nodeName);
+        
+          var element = Builder.node(tag,{id:'tag_'+tag+'_test_id'});
+          assertEqual(tag.toUpperCase(), element.nodeName);
+          assertEqual('tag_'+tag+'_test_id', element.id, 'Setting id attribute for "'+tag+'" failed!');
+        } catch(e) {
+          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.');
+        }
+      });
+    }},
+    
+    // special case, because requires workarounds on IE and Firefox < 1.5
+    testBuilderOptionTag: function() { with(this) {
+      assertEqual('', Builder.node('option').innerHTML);
+      assertEqual('test', Builder.node('option','test').innerHTML);
+      assertEqual('', Builder.node('option',{className:'test'}).innerHTML);
+      assertEqual('test', Builder.node('option',{className:'test'},'test').innerHTML);
+      assertEqual('test', Builder.node('option',{},'test').innerHTML);
+      
+      var selectElement = Builder.node('select');
+      var optionElement = Builder.node('option',{className:'test',id:'option_123'},123);
+      selectElement.appendChild(optionElement);
+      document.body.appendChild(selectElement);
+      assertEqual('123', $('option_123').innerHTML);
+    }},
+    
+    testBuilderContatenation: function() { with(this) {
+      var element = Builder.node('div', [Builder.node('span')]);
+      assertEqual('DIV', element.nodeName);
+      assertEqual(1, element.childNodes.length);
+      assertEqual('SPAN', element.firstChild.nodeName);
+      
+      var element = Builder.node('div', [Builder.node('span'),'text']);
+      assertEqual(2, element.childNodes.length);
+      assertEqual(0, element.firstChild.childNodes.length);
+      assertEqual('DIV', element.nodeName);
+      assertEqual('SPAN', element.firstChild.nodeName);
+      assertEqual(3, element.firstChild.nextSibling.nodeType);
+      
+      var element = Builder.node('div', [Builder.node('span',[Builder.node('strong','blah')]),'text']);
+      assertEqual(2, element.childNodes.length);
+      assertEqual(1, element.firstChild.childNodes.length);
+      assertEqual('DIV', element.nodeName);
+      assertEqual('SPAN', element.firstChild.nodeName);
+      assertEqual('STRONG', element.firstChild.firstChild.nodeName);
+      assertEqual('blah', element.firstChild.firstChild.innerHTML);
+      assertEqual(3, element.firstChild.nextSibling.nodeType);
+    }},
+  
+    testBuilderComplexExample: function() { with(this) {      
+      var element = Builder.node('div',{id:'ghosttrain'},[
+        Builder.node('div',{style:'font-weight: bold; font-size: 11px'},[
+          Builder.node('h1','Ghost Train'),
+          "testtext", 2, 3, 4,
+          Builder.node('ul',[
+            Builder.node('li',{onclick:'alert(\'test\')'},'click me')
+          ]),
+        ]),
+      ]);
+      assertEqual('DIV', element.nodeName);
+      
+      $('result').appendChild(element);
+      
+      // browsers aren't sure about upper and lower case on elements
+      assertEqual(
+        '<div id="ghosttrain"><div style="font-weight: bold; font-size: 11px">' + 
+        '<h1>Ghost Train</h1>testtext234<ul><li onclick="alert(\'test\')">click me</li></ul></div></div>',
+        serializeNode($('result').childNodes[0]));
+    }},
+    
+    testBuilderShortcuts: function() { with(this) {
+      Builder.dump();
+      
+      var element = DIV(SPAN());
+      assertEqual('SPAN', element.childNodes[0].tagName);
+      
+      var element = DIV({id:'test'},SPAN());
+      assertEqual('SPAN', element.childNodes[0].tagName);
+      
+      var element = DIV({id:'ghosttrain'},[
+         DIV({style:'font-weight: bold; font-size: 11px'},[
+           H1('Ghost Train'),
+           "testtext", 2, 3, 4,
+           UL([
+             LI({onclick:'alert(\'test\')'},'click me')
+           ]),
+         ]),
+       ]);
+      assertEqual('DIV', element.nodeName);
+      
+      $('result').appendChild(element);
+      
+      assertEqual(
+        '<div id="ghosttrain"><div style="font-weight: bold; font-size: 11px">' +
+        '<h1>Ghost Train</h1>testtext234<ul><li onclick="alert(\'test\')">click me</li></ul></div></div>',
+        serializeNode($('result').childNodes[0]));
+    }},
+    
+    testBuilderBuild: function() { with(this) {
+      ['<span>this is <b>neat!</b></span>',' \n<span>this is <b>neat!</b></span>\n '].each(
+        function(html){
+          var node = Builder.build(html);
+          assertEqual('<span>this is <b>neat!</b></span>', serializeNode(node));
+        });
+    }},
+    
+    testBuilderAttributeEscaping: function() { with(this) {
+      var element = Builder.node('div',{blah:"<foo'bar&baz\"bat>"});
+      assertEqual("<foo'bar&baz\"bat>", $(element).readAttribute('blah'));
+    }}
+
+  });
+// ]]>
+</script>
+</body>
+</html>
diff --git a/dom/tests/mochitest/ajax/scriptaculous/test/unit/dragdrop_test.html b/dom/tests/mochitest/ajax/scriptaculous/test/unit/dragdrop_test.html
new file mode 100644
index 000000000..686bd0f6f
--- /dev/null
+++ b/dom/tests/mochitest/ajax/scriptaculous/test/unit/dragdrop_test.html
@@ -0,0 +1,131 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<head>
+  <title>script.aculo.us Unit test file</title>
+  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
+  <script src="../../lib/prototype.js" type="text/javascript"></script>
+  <script src="../../src/scriptaculous.js" type="text/javascript"></script>
+  <script src="../../src/unittest.js" type="text/javascript"></script>
+  <link rel="stylesheet" href="../test.css" type="text/css" />
+  <style type="text/css" media="screen">
+  /* <![CDATA[ */
+    #div_absolute_test { position: absolute }
+  /* ]]> */
+  </style>
+  
+</head>
+<body>
+<h1>script.aculo.us Unit test file</h1>
+<p>
+  Test of drag &amp; drop functions in dragdrop.js
+</p>
+
+<!-- Log output -->
+<div id="testlog"> </div>
+
+<p id="p_test">p_test</p>
+<p id="p_test2">p_test2</p>
+<p id="p_test3">p_test3</p>
+<img id="img_test" src="icon.png" alt="img_text"/>
+<div id="droppable_test">droppable_test</div>
+
+<div id="div_test">div_test</div>
+<div id="div_absolute_test">div_absolute_test</div>
+<div id="div_absolute_inline_test" style="position:absolute">div_absolute_inline_test</div>
+
+<div id="droppable_container">
+  <div id="d1">droppable_test</div>
+  <div id="d2">droppable_test</div>
+</div>
+
+<div id="droppable_container_2">
+  <div id="d3">droppable_test</div>
+</div>
+
+<!-- Tests follow -->
+<script type="text/javascript" language="javascript" charset="utf-8">
+// <![CDATA[
+
+  new Test.Unit.Runner({
+    
+    testDraggableBasics: function() { with(this) {
+      var d = new Draggable('p_test');
+      assertInstanceOf(Draggable, d);
+    }},
+
+    testDraggableStartEffect: function() { with(this) {
+      var d = new Draggable('p_test2');
+      assert(d.options.starteffect, 'There should be a default start effect.');
+      d = new Draggable('p_test3', { endeffect: Prototype.EmptyFunction });
+      assert(undefined === d.options.startEffect, 'There should be no default start effect.');
+    }},
+    
+    testAutoPositioning: function() { with(this) {
+      assertEqual('static', Element.getStyle('div_test','position'));
+      new Draggable('div_test');
+      new Draggable('div_absolute_test');
+      new Draggable('div_absolute_inline_test');
+      assertEqual('relative', Element.getStyle('div_test','position'));
+      assertEqual('absolute', Element.getStyle('div_absolute_test','position'));
+      assertEqual('absolute', Element.getStyle('div_absolute_inline_test','position'));
+    }},
+    
+    testDroppbalesBasics: function() { with(this) {
+      assertEqual(0, Droppables.drops.length);
+      assertEqual('static', Element.getStyle('droppable_test','position'));
+      
+      Droppables.add('droppable_test');
+      assertEqual(1, Droppables.drops.length);
+      assertEqual('relative', Element.getStyle('droppable_test','position'));
+      
+      Droppables.remove('droppable_test');
+      assertEqual(0, Droppables.drops.length);
+      
+      // accept option should take strings or array of strings
+      Droppables.add('droppable_test',{accept:'document'});
+      assertEqual(['document'].inspect(), Droppables.drops[0].accept.inspect());
+      Droppables.remove('droppable_test');
+      
+      Droppables.add('droppable_test',{accept:['document','image']});
+      assertEqual(['document','image'].inspect(), Droppables.drops[0].accept.inspect());
+      Droppables.remove('droppable_test');
+    }},
+    
+    testDroppableContainment: function() { with(this) {
+      // Droppable containers should be cached
+      Droppables.add('droppable_test', {
+        containment:'droppable_container' });
+      assertEqual(1, Droppables.drops[0]._containers.length);
+      assertEqual($('droppable_container'), Droppables.drops[0]._containers[0]);
+      assert(Droppables.isContained($('d1'), Droppables.drops[0]));
+      assert(Droppables.isContained($('d2'), Droppables.drops[0]));
+      assert(!Droppables.isContained($('d3'), Droppables.drops[0]));
+      Droppables.remove('droppable_test');
+      
+      Droppables.add('droppable_test', {
+        containment:['droppable_container','droppable_container_2'] });
+      assertEqual(2,  Droppables.drops[0]._containers.length);
+      assertEqual($('droppable_container'), Droppables.drops[0]._containers[0]);
+      assertEqual($('droppable_container_2'), Droppables.drops[0]._containers[1]);
+      assert(Droppables.isContained($('d1'), Droppables.drops[0]));
+      assert(Droppables.isContained($('d2'), Droppables.drops[0]));
+      assert(Droppables.isContained($('d3'), Droppables.drops[0]));
+      Droppables.remove('droppable_test');
+    }},
+    
+    testDroppablesIsAffected: function() { with(this) {
+      Droppables.add('droppable_test');
+      
+      Position.prepare();
+      assert(!Droppables.isAffected([-10, -10], null, Droppables.drops[0]));
+      
+      var p = Position.page($('droppable_test'));
+      assert(Droppables.isAffected(p, null, Droppables.drops[0]));
+    }}
+    
+  }, "testlog");
+// ]]>
+</script>
+</body>
+</html>
diff --git a/dom/tests/mochitest/ajax/scriptaculous/test/unit/effects_test.html b/dom/tests/mochitest/ajax/scriptaculous/test/unit/effects_test.html
new file mode 100644
index 000000000..4fb629658
--- /dev/null
+++ b/dom/tests/mochitest/ajax/scriptaculous/test/unit/effects_test.html
@@ -0,0 +1,250 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<head>
+  <title>script.aculo.us Unit test file</title>
+  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
+  <script src="../../lib/prototype.js" type="text/javascript"></script>
+  <script src="../../src/scriptaculous.js" type="text/javascript"></script>
+  <script src="../../src/unittest.js" type="text/javascript"></script>
+  <link rel="stylesheet" href="../test.css" type="text/css" />
+  <style type="text/css" media="screen">
+    #rotfl {
+      color: red;
+      font-family: serif;
+      font-style: italic;
+      font-size: 40px;
+      background: #fed;
+      padding: 1em;
+      width: 400px;
+    } 
+    .final {
+      color: #fff;
+      font-style: italic;
+      font-size: 20px;
+      background: #000;
+      opacity: 0.5;
+    }
+  </style>
+</head>
+<body>
+<h1>script.aculo.us Unit test file</h1>
+<p>
+  Tests for effects.js
+</p>
+
+<!-- generated elements go in here -->
+<div id="sandbox"></div>
+
+<!-- Log output -->
+<div id="testlog"> </div>
+
+<div class="morphing blub" style="font-size:25px;color:#f00">Well</div>
+<div class="morphing">You know</div>
+<div id="blah" style="border:1px solid black;width:100px">Whoo-hoo!</div>
+
+<div id="error_message">ERROR MESSAGE</div>
+<div id="error_message_2">SECOND ERROR MESSAGE</div>
+<div id="error_message_3" style="border:1px solid red; width:100px; color: #f00">THIRD ERROR MESSAGE</div>
+
+<ul class="error-list" id="error_test_ul">
+  <li>Lorem ipsum dolor sit amet, consectetur adipisicing elit,</li>
+  <li>sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</li>
+  <li>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris</li>
+  <li>nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in</li>
+  <li>reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.</li>
+</ul>
+
+<div id="rotfl">ROTFL</div>
+
+<!-- Tests follow -->
+<script type="text/javascript" language="javascript" charset="utf-8">
+// <![CDATA[
+
+  var TAGS =
+    ['div','span','ol','ul','table','p','h1','h2','h3','h4','h5','h6'];
+
+  var COMBINED_EFFECTS =
+    ['Fade','Appear','BlindUp','BlindDown','Puff','SwitchOff','DropOut','Shake',
+     'SlideUp','SlideDown','Pulsate','Squish','Fold','Grow','Shrink'];
+  
+  var COMBINED_RJS_EFFECTS = $w('fade appear blind_up blind_down puff switch_off '+
+    'drop_out shake slide_up slide_down pulsate squish fold grow shrink');
+     
+  var tmp, tmp2;
+
+  new Test.Unit.Runner({
+
+    setup: function() { with (this) {
+      $('sandbox').innerHTML = "";
+    }},
+    
+    teardown: function() { with(this) {
+      // remove all queued effects
+      Effect.Queue.each(function(e) { e.cancel() });
+    }},
+    
+    testBackwardsCompat: function() { with(this) {
+      assertInstanceOf(Effect.Opacity, new Effect2.Fade('sandbox'));
+    }},
+    
+    testExceptionOnNonExistingElement: function() { with(this) {
+      assertRaise('ElementDoesNotExistError', 
+        function(){new Effect.Opacity('nothing-to-see-here')});
+      assertRaise('ElementDoesNotExistError', 
+        function(){new Effect.Move('nothing-to-see-here')});
+      assertRaise('ElementDoesNotExistError', 
+        function(){new Effect.Scale('nothing-to-see-here')});
+      assertRaise('ElementDoesNotExistError', 
+        function(){new Effect.Highlight('nothing-to-see-here')});
+    }},
+    
+    testEffectsQueue: function() { with(this) {
+      var e1 = new Effect.Highlight('sandbox');
+      var e2 = new Effect.Appear('sandbox');
+      
+      assertEqual(2, Effect.Queue.effects.length);
+      
+      tmp = 0;
+      Effect.Queue.each(function(e) { tmp++ });
+      assertEqual(2, tmp);
+      
+      // the internal interval timer should be active
+      assertNotNull(Effect.Queue.interval);
+      e1.cancel();
+      e2.cancel();
+      assertEqual(0, Effect.Queue.effects.length);
+      
+      // should be inactive after all effects are removed from queue
+      assertNull(Effect.Queue.interval);
+      
+      // should be in e3,e1,e2 order
+      var e1 = new Effect.Highlight('sandbox');
+      var e2 = new Effect.Appear('sandbox',{queue:'end'});
+      var e3 = new Effect.Fade('sandbox',{queue:'front'});
+      assert(e2.startOn > e1.startOn);
+      assert(e3.startOn < e1.startOn);
+      assert(e3.startOn < e2.startOn);
+      assertEqual(3, Effect.Queue.effects.length);
+      
+      Effect.Queue.each(function(e) { e.cancel() });
+      assertEqual(0, Effect.Queue.effects.length);
+    }},
+    
+    testScopedEffectsQueue: function() { with(this) {
+      var e1 = new Effect.Highlight('sandbox', {queue: {scope:'myscope'} } );
+      var e2 = new Effect.Appear('sandbox', {queue: {scope:'myscope'} } );
+      var e3 = new Effect.Highlight('sandbox', {queue: {scope:'secondscope'} } );
+      var e4 = new Effect.Appear('sandbox');
+     
+      assertEqual(2, Effect.Queues.get('myscope').effects.length);
+      assertEqual(1, Effect.Queues.get('secondscope').effects.length);
+      assertEqual(1, Effect.Queues.get('global').effects.length);
+      assertEqual(Effect.Queue.effects.length, Effect.Queues.get('global').effects.length);
+     
+      var tmp = 0;
+      Effect.Queues.get('myscope').effects.each(function(e) { tmp++ });
+      assertEqual(2, tmp);
+     
+      // the internal interval timer should be active
+      assertNotNull(Effect.Queues.get('myscope').interval);
+      assertNotNull(Effect.Queues.get('secondscope').interval);
+      assertNotNull(Effect.Queues.get('global').interval);
+    
+      e1.cancel(); e2.cancel(); e3.cancel(); e4.cancel();
+     
+      assertEqual(0, Effect.Queues.get('myscope').effects.length);
+      assertEqual(0, Effect.Queues.get('secondscope').effects.length);
+      assertEqual(0, Effect.Queues.get('global').effects.length);
+     
+      // should be inactive after all effects are removed from queues
+      assertNull(Effect.Queues.get('myscope').interval);
+      assertNull(Effect.Queues.get('secondscope').interval);
+      assertNull(Effect.Queues.get('global').interval);
+     
+      // should be in e3 and e4 together and then e1,e2 order
+      var e1 = new Effect.Highlight('sandbox', {queue: {scope:'myscope'} } );
+      var e2 = new Effect.Appear('sandbox', {queue: {position: 'end', scope:'myscope'} } );
+      var e3 = new Effect.Fade('sandbox', {queue: {position: 'front', scope:'myscope'} } );
+      var e4 = new Effect.Appear('sandbox');
+      assert(e2.startOn > e1.startOn);
+      assert(e3.startOn < e1.startOn);
+      assert(e3.startOn < e2.startOn);
+      assert(e3.startOn = e4.startOn);
+      assertEqual(3, Effect.Queues.get('myscope').effects.length);
+     
+      Effect.Queues.get('myscope').each(function(e) { e.cancel() });
+      assertEqual(0, Effect.Queues.get('myscope').effects.length);
+    
+      Effect.Queues.get('global').each(function(e) { e.cancel() });
+      assertEqual(0, Effect.Queues.get('global').effects.length);
+     
+      // should only allow the first two effects and ignore the third
+      var e1 = new Effect.Highlight('sandbox', {queue: {scope:'myscope', limit: 2} } );
+      var e2 = new Effect.Appear('sandbox', {queue: {position: 'end', scope:'myscope', limit: 2} } );
+      var e3 = new Effect.Fade('sandbox', {queue: {position: 'front', scope:'myscope', limit: 2} } );
+     
+      assertEqual(2, Effect.Queues.get('myscope').effects.length);
+    }},
+    
+    testEffectMultiple: function() { with(this) {
+      $('sandbox').appendChild(Builder.node('div',{id:'test_1'}));
+      $('sandbox').appendChild(Builder.node('div',{id:'test_2'},[Builder.node('div',{id:'test_2a'})]));
+      $('sandbox').appendChild(Builder.node('div',{id:'test_3'}));
+      
+      // only direct child elements
+      Effect.multiple('sandbox',Effect.Fade);
+      assertEqual(3, Effect.Queue.effects.length);
+      
+      Effect.Queue.each(function(e) { e.cancel() });
+      assertEqual(0, Effect.Queue.effects.length);
+      
+      // call with array
+      Effect.multiple(['test_1','test_3'],Effect.Puff);
+      assertEqual(2, Effect.Queue.effects.length);
+    }},
+    
+    testEffectTagifyText: function() { with(this) {
+      $('sandbox').innerHTML = "Blah<strong>bleb</strong> Blub";
+      assertEqual(3, $('sandbox').childNodes.length);
+      Effect.tagifyText('sandbox');
+      assertEqual(10, $('sandbox').childNodes.length);
+      
+      Effect.multiple('sandbox', Effect.Fade);
+      assertEqual(10, Effect.Queue.effects.length);
+    }},
+
+    // test if all combined effects correctly initialize themselves
+    testCombinedEffectsInitialize: function() { with(this) {
+      COMBINED_EFFECTS.each(function(fx,idx){
+        info('Effect.'+fx);
+        $('sandbox').innerHTML = "";
+        $('sandbox').appendChild(
+          Builder.node('div',{id:'test_element'},
+            Builder.node('span','test'))); //some effects require a child element
+            
+        // should work with new Effect.Blah syntax
+        var effect = new Effect[fx]('test_element');
+        assertEqual(0, effect.currentFrame);
+        
+        // and without the 'new'
+        var effect = Effect[fx]('test_element');
+        assertEqual(0, effect.currentFrame);
+        
+        // and, for visualEffect
+        assert($('test_element') == $('test_element').visualEffect(COMBINED_RJS_EFFECTS[idx]));
+        
+        // options parsing (shake, squish and grow are special here)
+        if(!['Shake','Squish','Grow'].include(fx)) {
+          var effect = Effect[fx]('test_element',{duration:2.0});
+          assertEqual(2.0, effect.options.duration, fx);
+        }
+      });
+    }},
+    
+  });
+
+// ]]>
+</script>
+</body>
+</html>
diff --git a/dom/tests/mochitest/ajax/scriptaculous/test/unit/element_test.html b/dom/tests/mochitest/ajax/scriptaculous/test/unit/element_test.html
new file mode 100644
index 000000000..88fcb3f41
--- /dev/null
+++ b/dom/tests/mochitest/ajax/scriptaculous/test/unit/element_test.html
@@ -0,0 +1,104 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<head>
+  <title>script.aculo.us Unit test file</title>
+  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
+  <script src="../../lib/prototype.js" type="text/javascript"></script>
+  <script src="../../src/scriptaculous.js" type="text/javascript"></script>
+  <script src="../../src/unittest.js" type="text/javascript"></script>
+  <link rel="stylesheet" href="../test.css" type="text/css" />
+  <style type="text/css" media="screen">
+    #style_test_1 { color:rgb(0, 0, 255); background-color: rgb(0, 0, 255); }
+    blah { color:rgb(0, 255, 0); }
+    #op2 { opacity:0.5;filter:alpha(opacity=50)progid:DXImageTransform.Microsoft.Blur(strength=10);}
+  </style>
+</head>
+<body>
+<h1>script.aculo.us Unit test file</h1>
+<p>
+  Tests for Element extensions in effects.js
+</p>
+
+<!-- Log output -->
+<div id="testlog"> </div>
+
+<!-- Test elements follow -->
+<div id="test_1" class="a bbbbbbbbbbbb cccccccccc dddd"> </div>
+
+<div id="test_2" class="classA-foobar classB-foobar"> </div> <span> </span> 
+
+<div id="style_test_1" style="display:none;"></div>
+<div id="style_test_2" class="blah" style="font-size:11px;"></div>
+
+<div id="style_test_3">blah</div>
+
+<div id="test_whitespace"> <span> </span> 
+
+
+
+<div><div></div> </div><span> </span>
+</div>
+
+<!-- Test Element opacity functions -->
+<img id="op1" alt="op2" src="icon.png" style="opacity:0.5;filter:alpha(opacity=50)" />
+<img id="op2" alt="op2" src="icon.png"/>
+<img id="op3" alt="op3" src="icon.png"/>
+<img id="op4-ie" alt="op3" src="icon.png" style="filter:alpha(opacity=30)" />
+
+<!-- Test Element.childrenWithClassName -->
+<div id="Container" class="moo hoo">
+  <span id="1" class="firstClass">First class</span>
+  <span id="2" class="secondClass">Second class</span>
+  <span id="3" class="firstClass secondClass">First and Second class</span>
+  <span id="4" class="thirdClass">Third class <span id="5" class="firstClass">Nested First class</span></span>
+  
+  <div id="collect">1<span class="ignore"><span class="someclass">2</span>3</span><ul><li class="ignore">4</li></ul></div>
+  
+</div>
+
+<div id="perftest1"><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span></div>
+
+<!-- Tests follow -->
+<script type="text/javascript" language="javascript" charset="utf-8">
+// <![CDATA[
+
+  new Test.Unit.Runner({
+    
+    testElementCollectTextNodes: function() { with(this) {
+      assertEqual('1234', Element.collectTextNodes('collect'));
+      assert(benchmark(function(){
+        Element.collectTextNodes('collect')
+      },50) < 1000);
+      
+      benchmark(function(){
+        Element.collectTextNodes('collect')
+      },10,'Element.collectTextNodes');
+      
+      assertEqual('1234', Element.collectTextNodesIgnoreClass('collect', 'somethingcompletelydifferent'));
+      assertEqual('1',    $('collect').collectTextNodesIgnoreClass('ignore'));
+      benchmark(function(){
+        Element.collectTextNodesIgnoreClass('collect','ignore')
+      },10,'Element.collectTextNodesIgnoreClass');
+      
+      assertEqual('134',  Element.collectTextNodesIgnoreClass('collect', 'someclass'));
+    }},
+    
+    testVisualEffect: function() { with(this) {
+      assert($('style_test_3') == $('style_test_3').visualEffect('fade'));
+      wait(1500,function(){
+        assert(!$('style_test_3').visible())
+      });
+    }},
+        
+    testParseStylePerformance: function() { with(this) {
+      benchmark(function(){
+        "font:12px/15pt Verdana;opacity:0.4;border:4px dotted red".parseStyle();
+      },100);
+    }}
+
+  }, "testlog");
+// ]]>
+</script>
+</body>
+</html>
\ No newline at end of file
diff --git a/dom/tests/mochitest/ajax/scriptaculous/test/unit/icon.png b/dom/tests/mochitest/ajax/scriptaculous/test/unit/icon.png
new file mode 100644
index 000000000..f752986b7
Binary files /dev/null and b/dom/tests/mochitest/ajax/scriptaculous/test/unit/icon.png differ
diff --git a/dom/tests/mochitest/ajax/scriptaculous/test/unit/loading_test.html b/dom/tests/mochitest/ajax/scriptaculous/test/unit/loading_test.html
new file mode 100644
index 000000000..d36f96ccc
--- /dev/null
+++ b/dom/tests/mochitest/ajax/scriptaculous/test/unit/loading_test.html
@@ -0,0 +1,41 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<head>
+  <title>script.aculo.us Unit test file</title>
+  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
+  <script src="../../lib/prototype.js" type="text/javascript"></script>
+  <script src="../../src/scriptaculous.js?load=effects,dragdrop" type="text/javascript"></script>
+  <script src="../../src/unittest.js" type="text/javascript"></script>
+  <link rel="stylesheet" href="../test.css" type="text/css" />
+</head>
+<body>
+<h1>script.aculo.us Unit test file</h1>
+<p>
+  Test dynamic loading in scriptaculous.js
+</p>
+
+<!-- Log output -->
+<div id="testlog"> </div>
+
+<!-- Tests follow -->
+<script type="text/javascript" language="javascript" charset="utf-8">
+// <![CDATA[
+
+  new Test.Unit.Runner({
+    
+    testDynamicLoading: function() { with(this) {
+      
+      // not loaded: controls
+      assertNull(Ajax.Autocompleter || null);
+      assertNull(Form.Element.DelayedObserver || null);
+      
+      // we loading dragdrop
+      assertNotNull(Draggable || null);
+    }}
+    
+  }, "testlog");
+// ]]>
+</script>
+</body>
+</html>
\ No newline at end of file
diff --git a/dom/tests/mochitest/ajax/scriptaculous/test/unit/position_clone_test.html b/dom/tests/mochitest/ajax/scriptaculous/test/unit/position_clone_test.html
new file mode 100644
index 000000000..0644c631b
--- /dev/null
+++ b/dom/tests/mochitest/ajax/scriptaculous/test/unit/position_clone_test.html
@@ -0,0 +1,312 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<head>
+  <title>script.aculo.us Unit test file</title>
+  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
+  <script src="../../lib/prototype.js" type="text/javascript"></script>
+  <script src="../../src/scriptaculous.js" type="text/javascript"></script>
+  <script src="../../src/unittest.js" type="text/javascript"></script>
+  <link rel="stylesheet" href="../test.css" type="text/css" />
+</head>
+<body>
+<h1>script.aculo.us Unit test file</h1>
+<p>
+  Tests for Postion.clone (to be moved to Prototype)
+</p>
+
+<!-- Log output -->
+<div id="testlog"> </div>
+
+<!-- Tests follow -->
+<script type="text/javascript" language="javascript" charset="utf-8">
+// <![CDATA[
+
+  function prepareTarget(contained, position1, position2) {
+    var target;
+    if($('target_div')) Element.remove('target_div');
+    if($('container_div')) Element.remove('container_div');
+    if(contained) {
+      target = Builder.node('div', 
+        {id: 'container_div', style: 'position:' + position1},
+        [Builder.node('div', {id: 'target_div', style: 'position: ' +position2})]);
+    } else {
+      target = Builder.node('div', 
+        {id: 'target_div', style: 'position:' + position1}, '456');
+    }
+    document.body.appendChild(target);
+    Position.clone($('source_div'),$('target_div'));
+  }
+  
+  function prepareTargetHidden(contained, position1, position2) {
+    var target;
+    if($('target_div')) Element.remove('target_div');
+    if($('container_div')) Element.remove('container_div');
+    if(contained) {
+      target = Builder.node('div', 
+        {id: 'container_div', style: 'position:' + position1},
+        [Builder.node('div', {id: 'target_div', style: 'display:none; position: ' +position2})]);
+    } else {
+      target = Builder.node('div', 
+        {id: 'target_div', style: 'display:none; position:' + position1}, '456');
+    }
+    document.body.appendChild(target);
+    Position.clone($('source_div'),$('target_div'));
+    Element.show($('target_div'));
+  }
+  
+  new Test.Unit.Runner({
+    
+    teardown: function() {
+      Element.remove($('source_div'));
+    },
+
+    testPositionCloneFromAbsolute: function() { with(this) {
+      var source = Builder.node('div', 
+        {id: 'source_div', style: 'position:absolute; top:20px; left:120px; width:100px; height:50px;'}, '123');
+      document.body.appendChild(source);
+      var expected = Object.inspect([120, 20]);
+      assertEqual(expected, Object.inspect(Position.page($('source_div'))));
+      
+      prepareTarget(false, 'absolute');    
+      assertEqual(expected, Object.inspect(Position.page($('target_div'))),
+        "Clone to absolute BODY child");
+      
+      prepareTarget(false, 'fixed');    
+      assertEqual(expected, Object.inspect(Position.page($('target_div'))),
+        "Clone to fixed BODY child");
+            
+      prepareTarget(true, 'absolute', 'absolute');    
+      assertEqual(expected, Object.inspect(Position.page($('target_div'))),
+        "Clone to absolute child of absolute BODY child");
+      
+      prepareTarget(true, 'absolute', 'fixed');    
+      assertEqual(expected, Object.inspect(Position.page($('target_div'))),
+        "Clone to fixed child of absolute BODY child");
+      
+      prepareTarget(true, 'relative', 'absolute');    
+      assertEqual(expected, Object.inspect(Position.page($('target_div'))),
+        "Clone to absolute child of relative BODY child");
+
+      prepareTarget(true, 'relative', 'fixed');    
+      assertEqual(expected, Object.inspect(Position.page($('target_div'))),
+        "Clone to fixed child of relative BODY child");
+      
+      prepareTarget(true, 'static', 'absolute');    
+      assertEqual(expected, Object.inspect(Position.page($('target_div'))),
+        "Clone to absolute child of static BODY child");
+
+      prepareTarget(true, 'static', 'fixed');    
+      assertEqual(expected, Object.inspect(Position.page($('target_div'))),
+        "Clone to fixed child of static BODY child");
+    }},
+    
+    testPositionCloneFromRelative: function() { with(this) {
+      var source = Builder.node('div', 
+        {id: 'source_div', style: 'position:relative; top:20px; left:120px; width:100px; height:50px;'}, '123');
+      document.body.appendChild(source);
+      var expected =  Object.inspect(Position.page($('source_div')));
+      assertEqual(expected, Object.inspect(Position.page($('source_div'))));
+
+      prepareTarget(false, 'absolute');    
+      assertEqual(expected, Object.inspect(Position.page($('target_div'))),
+        "Clone to absolute BODY child");
+
+      prepareTarget(false, 'fixed');    
+      assertEqual(expected, Object.inspect(Position.page($('target_div'))),
+        "Clone to fixed BODY child");
+
+      prepareTarget(true, 'absolute', 'absolute');    
+      assertEqual(expected, Object.inspect(Position.page($('target_div'))),
+        "Clone to absolute child of absolute BODY child");
+
+      prepareTarget(true, 'absolute', 'fixed');    
+      assertEqual(expected, Object.inspect(Position.page($('target_div'))),
+        "Clone to fixed child of absolute BODY child");
+
+      prepareTarget(true, 'relative', 'absolute');    
+      assertEqual(expected, Object.inspect(Position.page($('target_div'))),
+        "Clone to absolute child of relative BODY child");
+
+      prepareTarget(true, 'relative', 'fixed');    
+      assertEqual(expected, Object.inspect(Position.page($('target_div'))),
+        "Clone to fixed child of relative BODY child");
+
+      prepareTarget(true, 'static', 'absolute');    
+      assertEqual(expected, Object.inspect(Position.page($('target_div'))),
+        "Clone to absolute child of static BODY child");
+
+      prepareTarget(true, 'static', 'fixed');    
+      assertEqual(expected, Object.inspect(Position.page($('target_div'))),
+        "Clone to fixed child of static BODY child");
+    }},
+    
+    testPositionCloneFromStatic: function() { with(this) {
+      var source = Builder.node('div', 
+        {id: 'source_div', style: 'top:20px; left:120px; width:100px; height:50px;'}, '123');
+      document.body.appendChild(source);
+      var expected =  Object.inspect(Position.page($('source_div')));
+      assertEqual(expected, Object.inspect(Position.page($('source_div'))));
+    
+      prepareTarget(false, 'absolute');    
+      assertEqual(expected, Object.inspect(Position.page($('target_div'))),
+        "Clone to absolute BODY child");
+
+      prepareTarget(false, 'fixed');    
+      assertEqual(expected, Object.inspect(Position.page($('target_div'))),
+        "Clone to fixed BODY child");
+
+      prepareTarget(true, 'absolute', 'absolute');    
+      assertEqual(expected, Object.inspect(Position.page($('target_div'))),
+        "Clone to absolute child of absolute BODY child");
+
+      prepareTarget(true, 'absolute', 'fixed');    
+      assertEqual(expected, Object.inspect(Position.page($('target_div'))),
+        "Clone to fixed child of absolute BODY child");
+
+      prepareTarget(true, 'relative', 'absolute');    
+      assertEqual(expected, Object.inspect(Position.page($('target_div'))),
+        "Clone to absolute child of relative BODY child");
+
+      prepareTarget(true, 'relative', 'fixed');    
+      assertEqual(expected, Object.inspect(Position.page($('target_div'))),
+        "Clone to fixed child of relative BODY child");
+
+      prepareTarget(true, 'static', 'absolute');    
+      assertEqual(expected, Object.inspect(Position.page($('target_div'))),
+        "Clone to absolute child of static BODY child");
+
+      prepareTarget(true, 'static', 'fixed');    
+      assertEqual(expected, Object.inspect(Position.page($('target_div'))),
+        "Clone to fixed child of static BODY child");
+    }},
+    
+    testPositionCloneFromAbsoluteWithHiddenTarget: function() { with(this) {
+      var source = Builder.node('div', 
+        {id: 'source_div', style: 'position:absolute; top:20px; left:120px; width:100px; height:50px;'}, '123');
+      document.body.appendChild(source);
+      var expected = Object.inspect([120, 20]);
+      assertEqual(expected, Object.inspect(Position.page($('source_div'))));
+    
+      prepareTargetHidden(false, 'absolute');    
+      assertEqual(expected, Object.inspect(Position.page($('target_div'))),
+        "Clone to absolute BODY child");
+    
+      prepareTargetHidden(false, 'fixed');    
+      assertEqual(expected, Object.inspect(Position.page($('target_div'))),
+        "Clone to fixed BODY child");
+    
+      prepareTargetHidden(true, 'absolute', 'absolute');    
+      assertEqual(expected, Object.inspect(Position.page($('target_div'))),
+        "Clone to absolute child of absolute BODY child");
+    
+      prepareTargetHidden(true, 'absolute', 'fixed');    
+      assertEqual(expected, Object.inspect(Position.page($('target_div'))),
+        "Clone to fixed child of absolute BODY child");
+    
+      prepareTargetHidden(true, 'relative', 'absolute');    
+      assertEqual(expected, Object.inspect(Position.page($('target_div'))),
+        "Clone to absolute child of relative BODY child");
+    
+      prepareTargetHidden(true, 'relative', 'fixed');    
+      assertEqual(expected, Object.inspect(Position.page($('target_div'))),
+        "Clone to fixed child of relative BODY child");
+    
+      prepareTargetHidden(true, 'static', 'absolute');    
+      assertEqual(expected, Object.inspect(Position.page($('target_div'))),
+        "Clone to absolute child of static BODY child");
+    
+      prepareTargetHidden(true, 'static', 'fixed');    
+      assertEqual(expected, Object.inspect(Position.page($('target_div'))),
+        "Clone to fixed child of static BODY child");
+    }},
+    
+    testPositionCloneFromRelativeWithHiddenTarget: function() { with(this) {
+      var source = Builder.node('div', 
+        {id: 'source_div', style: 'position:relative; top:20px; left:120px; width:100px; height:50px;'}, '123');
+      document.body.appendChild(source);
+      var expected =  Object.inspect(Position.page($('source_div')));
+      assertEqual(expected, Object.inspect(Position.page($('source_div'))));
+    
+      prepareTargetHidden(false, 'absolute');    
+      assertEqual(expected, Object.inspect(Position.page($('target_div'))),
+        "Clone to absolute BODY child");
+    
+      prepareTargetHidden(false, 'fixed');    
+      assertEqual(expected, Object.inspect(Position.page($('target_div'))),
+        "Clone to fixed BODY child");
+    
+      prepareTargetHidden(true, 'absolute', 'absolute');    
+      assertEqual(expected, Object.inspect(Position.page($('target_div'))),
+        "Clone to absolute child of absolute BODY child");
+    
+      prepareTargetHidden(true, 'absolute', 'fixed');    
+      assertEqual(expected, Object.inspect(Position.page($('target_div'))),
+        "Clone to fixed child of absolute BODY child");
+    
+      prepareTargetHidden(true, 'relative', 'absolute');    
+      assertEqual(expected, Object.inspect(Position.page($('target_div'))),
+        "Clone to absolute child of relative BODY child");
+    
+      prepareTargetHidden(true, 'relative', 'fixed');    
+      assertEqual(expected, Object.inspect(Position.page($('target_div'))),
+        "Clone to fixed child of relative BODY child");
+    
+      prepareTargetHidden(true, 'static', 'absolute');    
+      assertEqual(expected, Object.inspect(Position.page($('target_div'))),
+        "Clone to absolute child of static BODY child");
+    
+      prepareTargetHidden(true, 'static', 'fixed');    
+      assertEqual(expected, Object.inspect(Position.page($('target_div'))),
+        "Clone to fixed child of static BODY child");
+    }},
+    
+    testPositionCloneFromStaticWithHiddenTarget: function() { with(this) {
+      var source = Builder.node('div', 
+        {id: 'source_div', style: 'top:20px; left:120px; width:100px; height:50px;'}, '123');
+      document.body.appendChild(source);
+      var expected =  Object.inspect(Position.page($('source_div')));
+      assertEqual(expected, Object.inspect(Position.page($('source_div'))));
+    
+      prepareTargetHidden(false, 'absolute');    
+      assertEqual(expected, Object.inspect(Position.page($('target_div'))),
+        "Clone to absolute BODY child");
+    
+      prepareTargetHidden(false, 'fixed');    
+      assertEqual(expected, Object.inspect(Position.page($('target_div'))),
+        "Clone to fixed BODY child");
+    
+      prepareTargetHidden(true, 'absolute', 'absolute');    
+      assertEqual(expected, Object.inspect(Position.page($('target_div'))),
+        "Clone to absolute child of absolute BODY child");
+    
+      prepareTargetHidden(true, 'absolute', 'fixed');    
+      assertEqual(expected, Object.inspect(Position.page($('target_div'))),
+        "Clone to fixed child of absolute BODY child");
+    
+      prepareTargetHidden(true, 'relative', 'absolute');    
+      assertEqual(expected, Object.inspect(Position.page($('target_div'))),
+        "Clone to absolute child of relative BODY child");
+    
+      prepareTargetHidden(true, 'relative', 'fixed');    
+      assertEqual(expected, Object.inspect(Position.page($('target_div'))),
+        "Clone to fixed child of relative BODY child");
+    
+      prepareTargetHidden(true, 'static', 'absolute');    
+      assertEqual(expected, Object.inspect(Position.page($('target_div'))),
+        "Clone to absolute child of static BODY child");
+    
+      prepareTargetHidden(true, 'static', 'fixed');    
+      assertEqual(expected, Object.inspect(Position.page($('target_div'))),
+        "Clone to fixed child of static BODY child");
+    }}
+    
+  });
+
+// ]]>
+</script>
+
+<!-- Test elements will be inserted after this -->
+
+</body>
+</html>
\ No newline at end of file
diff --git a/dom/tests/mochitest/ajax/scriptaculous/test/unit/slider_test.html b/dom/tests/mochitest/ajax/scriptaculous/test/unit/slider_test.html
new file mode 100644
index 000000000..018b45d07
--- /dev/null
+++ b/dom/tests/mochitest/ajax/scriptaculous/test/unit/slider_test.html
@@ -0,0 +1,438 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<head>
+  <title>script.aculo.us Unit test file</title>
+  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
+  <script src="../../lib/prototype.js" type="text/javascript"></script>
+  <script src="../../src/scriptaculous.js" type="text/javascript"></script>
+  <script src="../../src/unittest.js" type="text/javascript"></script>
+  <link rel="stylesheet" href="../test.css" type="text/css" />
+</head>
+<body>
+<h1>script.aculo.us Unit test file</h1>
+<p>
+  Tests for slider.js
+</p>
+
+<div id="track1" style="width:200px;background-color:#aaa;height:5px;">
+  <div id="handle1" style="width:15px;height:25px;background-color:#f00;"> </div>
+</div>
+
+<div id="track2-vertical" style="height:100px;background-color:#aaa;width:5px;">
+  <div id="handle2-vertical" style="width:25px;height:10px;background-color:#f00;"> </div>
+</div>
+
+<div id="track2-horizontal" style="height:5px;background-color:#aaa;width:100px;">
+  <div id="handle2-horizontal" style="width:10px;height:25px;background-color:#f00;"> </div>
+</div>
+
+<div id="track3" style="width:300px;background-color:#cfb;height:30px;">
+  <span id="handle3-1">1</span>
+  <span id="handle3-2">2</span>
+  <span id="handle3-3">3</span>
+</div>  
+
+<div id="track4" style="width:300px;position:relative;background-color:#cbf;height:30px;">
+  <span id="handle4-1" style="top:0;left:0;position:absolute;background-color:#f00;">1</span>
+  <span id="handle4-2" style="top:0;left:0;position:absolute;background-color:#0f0;">2</span>
+  <span id="handle4-3" style="top:0;left:0;position:absolute;background-color:#00f;">3</span>
+</div>
+
+<div id="track5" style="width:300px;background-color:#cbf;height:30px;position:relative;z-index:0;">
+  <div id="handle5-1" style="top:0;left:0;position:absolute;background-color:#f00;z-index:2">1</div>
+  <div id="handle5-2" style="top:0;left:0;position:absolute;background-color:#0f0;z-index:2">2</div>
+  <div id="handle5-3" style="top:0;left:0;position:absolute;background-color:#00f;z-index:2">3</div>
+  
+  <div id="span5-1" style="top:0;left:0;position:absolute;background-color:#000;height:20px;z-index:1;"> </div>
+  <div id="span5-2" style="top:0;left:0;position:absolute;background-color:#444;height:20px;z-index:1;"> </div>
+</div>
+
+<div id="track6" style="width:20px;background-color:#cbf;height:100px;position:relative;z-index:0;">
+  <div id="handle6-1" style="top:0;left:0;height:13px;position:absolute;background-color:#f00;z-index:2">1</div>
+  <div id="handle6-2" style="top:0;left:0;height:13px;position:absolute;background-color:#0f0;z-index:2">2</div>
+  <div id="handle6-3" style="top:0;left:0;height:13px;position:absolute;background-color:#00f;z-index:2">3</div>
+  
+  <div id="span6-1" style="top:0;left:0;position:absolute;background-color:#000;width:20px;z-index:1;"> </div>
+  <div id="span6-2" style="top:0;left:0;position:absolute;background-color:#444;width:20px;z-index:1;"> </div>
+</div>
+
+<div id="track7" style="width:200px;background-color:#cbf;height:30px;position:relative;z-index:0;">
+  <div id="handle7-1" style="top:0;left:0;position:absolute;background-color:#f88;z-index:2">1</div>
+  <div id="handle7-2" style="top:0;left:0;position:absolute;background-color:#8f8;z-index:2">2</div>
+  <div id="handle7-3" style="top:0;left:0;position:absolute;background-color:#88f;z-index:2">3</div>
+  
+  <div id="span7-1" style="top:0;left:0;position:absolute;background-color:#000;height:20px;z-index:1;"> </div>
+  <div id="span7-2" style="top:0;left:0;position:absolute;background-color:#444;height:20px;z-index:1;"> </div>
+  
+  <div id="span7-start" style="top:0;left:0;position:absolute;background-color:#f00;height:20px;z-index:1;"> </div>
+  <div id="span7-end" style="top:0;left:0;position:absolute;background-color:#00f;height:20px;z-index:1;"> </div>
+</div>
+
+
+<div id="debug"> </div>
+
+<!-- Log output -->
+<div id="testlog"> </div>
+
+<!-- Tests follow -->
+<script type="text/javascript" language="javascript" charset="utf-8">
+// <![CDATA[
+  var globalValue;
+
+  new Test.Unit.Runner({
+
+    testSliderBasics: function() { with(this) {
+      var slider = new Control.Slider('handle1', 'track1');
+      assertInstanceOf(Control.Slider, slider);
+      assertEqual(Prototype.Browser.IE ? 5 : 4, Event.observers.length);
+      
+      assertEqual('horizontal', slider.axis);
+      assertEqual(false, slider.disabled);
+      assertEqual(0, slider.value);
+      
+      slider.dispose();
+    }},
+    
+    testSliderValues: function() { with(this) {
+      ['horizontal', 'vertical'].each( function(axis) {
+        var slider = new Control.Slider('handle2-'+axis, 'track2-'+axis, {values:[0.2,0.4,0.6,0.8,1],axis:axis});
+        assertEqual(axis, slider.axis);
+        assertEqual(0.2, slider.value);
+        
+        slider.setValue(0.35);
+        assertEqual(0.4, slider.value);
+        
+        slider.setValueBy(0.1);
+        assertEqual(0.6, slider.value);
+        slider.setValueBy(-0.6);
+        assertEqual(0.2, slider.value);
+        
+        slider.setValue(1);
+        assertEqual(1, slider.value);
+        
+        slider.setValue(-2);
+        assertEqual(0.2, slider.value);
+        
+        slider.setValue(55555);
+        assertEqual(1, slider.value);
+        
+        // leave active to be able to play around with the sliders
+        // slider.dispose();
+      });
+      assertEqual("90px", $('handle2-horizontal').style.left);    
+      assertEqual("90px", $('handle2-vertical').style.top);
+    }},
+    
+    testSliderInitialValues: function() { with(this) {
+      var slider = new Control.Slider('handle1', 'track1',{sliderValue:0.5});
+      assertEqual(0.5, slider.value);
+      
+      var slider = new Control.Slider(['handle4-1','handle4-2','handle4-3'], 'track4', {
+        sliderValue:[50,145,170],
+        values:[50,150,160,170,180],
+        range:$R(50,180)
+      });
+      assertEqual(50, slider.value);
+      assertEqual(50, slider.values[0]);
+      assertEqual(150, slider.values[1]);
+      assertEqual(170, slider.values[2]);
+      slider.dispose();
+      
+      var slider = new Control.Slider(['handle4-1','handle4-2','handle4-3'], 'track4', {
+        sliderValue:[50,145,170],
+        values:[50,150,160,170,180]
+      });
+      assertEqual(50, slider.value);
+      assertEqual(50, slider.values[0]);
+      assertEqual(150, slider.values[1]);
+      assertEqual(170, slider.values[2]);
+      slider.dispose();
+      
+      var slider = new Control.Slider(['handle4-1','handle4-2','handle4-3'], 'track4', {
+        restricted:true,
+        sliderValue:[50,145,170],
+        values:[50,150,160,170,180]
+      });
+      assertEqual(50, slider.value);
+      assertEqual(50, slider.values[0]);
+      assertEqual(150, slider.values[1]);
+      assertEqual(170, slider.values[2]);
+      slider.dispose();
+    }},
+    
+    testSliderOnChange: function() { with(this) {
+      var slider = new Control.Slider('handle1', 'track1', { onChange:function(v){ globalValue = v; } });
+      slider.setValue(1);
+      assert(1, globalValue);
+      assert(1, slider.value);
+      
+      slider.setDisabled();
+      slider.setValue(0.5);
+      assert(1, globalValue);
+      assert(1, slider.value);
+      
+      slider.setEnabled();
+      slider.setValue(0.2);
+      assert(0.2, globalValue);
+      assert(0.2, slider.value);
+      
+      // s.event should be null if setValue is called from script
+      var slider = new Control.Slider(['handle3-1','handle3-2','handle3-3'], 'track3', {
+        onChange:function(v, s){ if(!s.event) globalValue = v; } });
+       
+      slider.setValue(0.5,1);
+      assertEqual([0,0.5,0].inspect(), globalValue.inspect());
+      assert(!slider.event);
+       
+      slider.dispose();
+    }},
+    
+    testMultipleHandles: function() { with(this) {
+      var slider = new Control.Slider(['handle3-1','handle3-2','handle3-3'], 'track3', {range:$R(0,300)});
+      assertInstanceOf(Control.Slider, slider);
+      
+      slider.setValue(20, 0);
+      slider.setValue(50, 1);
+      slider.setValue(70, 2);
+      assertEqual(20, slider.values[0]);
+      assertEqual(50, slider.values[1]);
+      assertEqual(70, slider.values[2]);
+      assertEqual("20px", slider.handles[0].style.left);
+      assertEqual("49px", slider.handles[1].style.left);
+      assertEqual("68px", slider.handles[2].style.left);
+      
+      // should change last manipulated handled by -10,
+      // so check for handle with idx 2
+      slider.setValueBy(-10);
+      assertEqual(60, slider.values[2]);
+      
+      slider.setValueBy(10, 0);
+      assertEqual(20, slider.values[0]);
+      slider.setValueBy(10, 1);
+      assertEqual(60, slider.values[1]);
+      slider.setValueBy(20, slider.activeHandleIdx);
+      assertEqual(80, slider.values[1]);
+    }},
+    
+    testMultipleHandlesValues: function() { with(this) {
+      var slider = new Control.Slider(['handle4-1','handle4-2','handle4-3'], 'track4', {values:[50,150,160,170,180],range:$R(50,180)});
+      assertInstanceOf(Control.Slider, slider);
+      
+      slider.setValue(20, 0);
+      slider.setValue(150, 2);
+      slider.setValue(179, 1);
+      
+      assertEqual(50, slider.values[0]);
+      assertEqual(150, slider.values[2]);
+      assertEqual(180, slider.values[1]);
+      
+      assertEqual("0px", slider.handles[0].style.left);
+      assertEqual("225px", slider.handles[2].style.left);
+      assertEqual("293px", slider.handles[1].style.left);
+      
+      assertEqual($R(50,150).inspect(), slider.getRange().inspect());
+      assertEqual(30, slider.getRange(1).end-slider.getRange(1).start);
+    }},
+    
+    testMultipleHandlesSpans: function() { with(this) {
+      var slider = new Control.Slider(['handle5-1','handle5-2','handle5-3'], 'track5',
+        {spans:['span5-1','span5-2'],range:$R(0,300)});
+      assertInstanceOf(Control.Slider, slider);
+      
+      slider.setValue(20,  0);
+      slider.setValue(100, 1);
+      slider.setValue(150, 2);
+  
+      assertEqual("20px", $('span5-1').style.left);
+      assertEqual("78px", $('span5-1').style.width);
+      assertEqual("98px", $('span5-2').style.left);
+      assertEqual("49px", $('span5-2').style.width);
+      
+      slider.setValue(30, 0);
+      slider.setValue(110, 1);
+      slider.setValue(90, 2);
+  
+      assertEqual("29px", $('span5-1').style.left);
+      assertEqual("59px", $('span5-1').style.width);
+      assertEqual("88px", $('span5-2').style.left);
+      assertEqual("20px", $('span5-2').style.width);
+      
+      slider.dispose();
+    }},
+    
+    testMultipleHandlesSpansStartEnd: function() { with(this) {
+      var slider = new Control.Slider(['handle7-1','handle7-2','handle7-3'], 'track7',
+        { spans:['span7-1','span7-2'],
+          startSpan:'span7-start',
+          endSpan:'span7-end',
+          range:$R(0,200) });
+      assertInstanceOf(Control.Slider, slider);
+      
+      slider.setValue(20,  0);
+      slider.setValue(100, 1);
+      slider.setValue(150, 2);
+      assertEqual("0px", $('span7-start').style.left);
+      assertEqual("19px", $('span7-start').style.width);
+      assertEqual("145px", $('span7-end').style.left);
+      assertEqual("48px", $('span7-end').style.width);
+      
+      slider.dispose();
+    }},
+    
+    testSingleHandleSpansStartEnd: function() { with(this) {
+      var slider = new Control.Slider('handle7-1', 'track7',
+        { spans:['span7-1','span7-2'],
+          startSpan:'span7-start',
+          endSpan:'span7-end',
+          range:$R(0,200) });
+      assertInstanceOf(Control.Slider, slider);
+      
+      slider.setValue(20,  0);
+      assertEqual("0px", $('span7-start').style.left);
+      assertEqual("19px", $('span7-start').style.width);
+      assertEqual("19px", $('span7-end').style.left);
+      assertEqual("174px", $('span7-end').style.width);
+      
+      slider.dispose();
+    }},
+    
+    testMultipleHandlesStyles: function() { with(this) {
+      var slider = new Control.Slider(['handle7-1','handle7-2','handle7-3'], 'track7',
+        { spans:['span7-1','span7-2'],
+          startSpan:'span7-start',
+          endSpan:'span7-end',
+          range:$R(0,200) });
+      assertInstanceOf(Control.Slider, slider);
+      assert(Element.hasClassName('handle7-1','selected'));
+      assert(!Element.hasClassName('handle7-2','selected'));
+      assert(!Element.hasClassName('handle7-3','selected'));
+      
+      slider.setValue(20,  0);
+      assert(Element.hasClassName('handle7-1','selected'));
+      assert(!Element.hasClassName('handle7-2','selected'));
+      assert(!Element.hasClassName('handle7-3','selected'));
+            
+      slider.setValue(100, 1);
+      assert(!Element.hasClassName('handle7-1','selected'));
+      assert(Element.hasClassName('handle7-2','selected'));
+      assert(!Element.hasClassName('handle7-3','selected'));
+      
+      slider.setValue(150, 2);
+      assert(!Element.hasClassName('handle7-1','selected'));
+      assert(!Element.hasClassName('handle7-2','selected'));
+      assert(Element.hasClassName('handle7-3','selected'));
+      
+      slider.dispose();
+    }},
+    
+    testMultipleHandlesSpansRestricted: function() { with(this) {
+      var slider = new Control.Slider(['handle5-1','handle5-2','handle5-3'], 'track5', 
+        {restricted:true,spans:['span5-1','span5-2'],range:$R(0,300)});
+      assertInstanceOf(Control.Slider, slider);
+      
+      slider.setValue(20, 0);
+      slider.setValue(100, 1);
+      slider.setValue(150,  2);      
+      assertEqual(0, slider.values[0]);
+      assertEqual(0, slider.values[1]);
+      assertEqual(150, slider.values[2]);
+      
+      slider.setValue(150, 2);
+      slider.setValue(100, 1);
+      slider.setValue(20,  0);
+      assertEqual(20, slider.values[0]);
+      assertEqual(100, slider.values[1]);
+      assertEqual(150, slider.values[2]);
+      assertEqual("20px", $('span5-1').style.left);
+      assertEqual("78px", $('span5-1').style.width);
+      assertEqual("98px", $('span5-2').style.left);
+      assertEqual("49px", $('span5-2').style.width);
+      
+      slider.setValue(30, 0);
+      slider.setValue(110, 1);
+      slider.setValue(90, 2);
+      assertEqual(30, slider.values[0]);
+      assertEqual(110, slider.values[1]);
+      assertEqual(110, slider.values[2], '???');
+  
+      assertEqual("29px", $('span5-1').style.left);
+      assertEqual("78px", $('span5-1').style.width);
+      assertEqual("107px", $('span5-2').style.left);
+      assertEqual("0px", $('span5-2').style.width);
+      
+      slider.dispose();
+    }},
+    
+    testMultipleHandlesSpansVertical: function() { with(this) {
+      var slider = new Control.Slider(['handle6-1','handle6-2','handle6-3'], 'track6', {axis:'vertical',spans:['span6-1','span6-2'],range:$R(0,100)});
+      assertInstanceOf(Control.Slider, slider);
+      
+      slider.setValue(20, 0);
+      slider.setValue(80, 1);
+      slider.setValue(90, 2);
+  
+      assertEqual("17px", $('span6-1').style.top);
+      assertEqual("52px", $('span6-1').style.height);
+      assertEqual("70px", $('span6-2').style.top);
+      assertEqual("9px", $('span6-2').style.height);
+      
+      slider.setValue(30, 0);
+      slider.setValue(20, 1);
+      slider.setValue(95, 2);
+  
+      assertEqual("17px", $('span6-1').style.top);
+      assertEqual("9px", $('span6-1').style.height);
+      assertEqual("26px", $('span6-2').style.top);
+      assertEqual("57px", $('span6-2').style.height);
+    }},
+    
+    testRange: function() { with(this) {
+      var slider = new Control.Slider('handle1','track1');
+      assertEqual(0, slider.value);
+      slider.setValue(1);
+      assertEqual("185px", $('handle1').style.left);
+      slider.dispose();
+      
+      var slider = new Control.Slider('handle1','track1',{range:$R(10,20)});
+      assertEqual(10, slider.value);
+      assertEqual("0px", $('handle1').style.left);
+      slider.setValue(15);
+      assertEqual("93px", $('handle1').style.left);
+      slider.setValue(20);
+      assertEqual("185px", $('handle1').style.left);
+      slider.dispose();      
+    }},
+    
+    // test for #3732
+    testRangeValues: function() { with(this) {
+      // test for non-zero starting range
+      var slider = new Control.Slider('handle1','track1',{
+        range:$R(1,3), values:[1,2,3]
+      });
+      assertEqual(1, slider.value);
+      assertEqual("0px", $('handle1').style.left);
+      slider.setValue(2);
+      assertEqual("93px", $('handle1').style.left);
+      slider.setValue(3);
+      assertEqual("185px", $('handle1').style.left);
+      slider.dispose();
+      
+      // test zero-starting range
+      var slider = new Control.Slider('handle1','track1',{
+        range:$R(0,2), values:[0,1,2]
+      });
+      assertEqual(0, slider.value);
+      assertEqual("0px", $('handle1').style.left);
+      slider.setValue(1);
+      assertEqual("93px", $('handle1').style.left);
+      slider.setValue(2);
+      assertEqual("185px", $('handle1').style.left);
+      slider.dispose();
+    }}
+    
+  }, "testlog");
+// ]]>
+</script>
+</body>
+</html>
\ No newline at end of file
diff --git a/dom/tests/mochitest/ajax/scriptaculous/test/unit/sortable_test.html b/dom/tests/mochitest/ajax/scriptaculous/test/unit/sortable_test.html
new file mode 100644
index 000000000..c2bafd0b9
--- /dev/null
+++ b/dom/tests/mochitest/ajax/scriptaculous/test/unit/sortable_test.html
@@ -0,0 +1,205 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<head>
+  <title>script.aculo.us Unit test file</title>
+  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
+  <script src="../../lib/prototype.js" type="text/javascript"></script>
+  <script src="../../src/scriptaculous.js" type="text/javascript"></script>
+  <script src="../../src/unittest.js" type="text/javascript"></script>
+  <link rel="stylesheet" href="../test.css" type="text/css" />
+</head>
+<body>
+<h1>script.aculo.us Unit test file</h1>
+<p>
+  Test of sortable functions in dragdrop.js
+</p>
+
+<!-- Log output -->
+<div id="testlog"> </div>
+
+
+<ul id="sortable1">
+  <li id="item_1" class="a">item 1</li>
+  <li id="item_2" class="c b">item 1<ul><li id="item_99">!!!</li></ul></li>
+  <li id="item_3" class="b">item 1</li>
+  <li id="item_xy" class="x y">item 1</li>
+  <!-- a comment -->
+</ul>
+
+<div id="sortable2">
+  <div id="item_4">item 4</div>  <div id="item_5">item 5</div>
+  <img src="icon.png" alt="img"/>
+  <!-- a comment -->
+</div>
+
+<div id="sortable3">
+  
+</div>
+
+<!-- 
+  By default, _ is the only valid seperator
+  for the DOM ids. Complex element ids as in
+  the form of "some_element_id_1" should also
+  be parsed correctly (only the last part should
+  be serialized)
+-->
+<ul id="sortable_complex">
+  <li id="a_b_item_1" class="a">item 1</li>
+  <li id="ab_item_2" class="c b">item 1
+    <ul>
+      <li id="item_99">!!!</li>
+    </ul>
+  </li>
+  <li id="a-b-item_3z_33" class="b">item 1</li>
+  <li id="a-item-xy" class="x y">item 1</li>
+  <!-- a comment -->
+</ul>
+
+
+<ul id="sortable_specialcreate">
+  <li id="y1item">item 1</li>
+  <li id="y2item">item 1<ul><li id="yyyy9928282hjhd">!!!</li></ul></li>
+</ul>
+
+<ul id="sortable_specialformat">
+  <li id="x1item">item 1</li>
+  <li id="x2item">item 1<ul><li id="xxxxx88888item">!!!</li></ul></li>
+</ul>
+
+<!-- Tests follow -->
+<script type="text/javascript" language="javascript" charset="utf-8">
+// <![CDATA[
+
+  new Test.Unit.Runner({
+    
+    setup: function() { with(this) {
+      Sortable.create('sortable1',{only:['a','b']});
+      Sortable.create('sortable2',{tag:'div'});
+      Sortable.create('sortable3');
+      Sortable.create('sortable_specialcreate',{ format:/(\d+)/ });
+      Sortable.create('sortable_specialformat');
+      Sortable.create('sortable_complex');
+    }},
+    
+    teardown: function() { with(this) {
+      Sortable.destroy('sortable1');
+      Sortable.destroy('sortable2');
+      Sortable.destroy('sortable3');
+      Sortable.destroy('sortable_specialformat');
+      Sortable.destroy('sortable_specialcreate');
+      Sortable.destroy('sortable_complex');
+    }},
+    
+    testSortableSerializeSequenceBasics: function() { with(this) {
+      assertEqual('sortable1[]=1&sortable1[]=2&sortable1[]=3', Sortable.serialize('sortable1'));      
+      
+      // test empty sortable
+      assertEqual('', Sortable.serialize('sortable3'));
+      assertEnumEqual([], Sortable.sequence('sortable3'));
+      
+      Element.remove('item_4');
+      assertEqual('sortable2[]=5', Sortable.serialize('sortable2'));
+      assertEnumEqual(['5'], Sortable.sequence('sortable2'));
+    }},
+    
+    testSortableSerializeFormat: function() { with(this) {
+      // should correctly serialize from option given to Sortable.create()
+      assertEqual('sortable_specialcreate[]=1&sortable_specialcreate[]=2', 
+        Sortable.serialize('sortable_specialcreate'));
+        
+      benchmark(function(){
+        Sortable.serialize('sortable_specialcreate')
+      },1,'Sortable.serialize');
+      
+      // test special format given explicitly
+      assertEqual('sortable_specialformat[]=1&sortable_specialformat[]=2', 
+        Sortable.serialize('sortable_specialformat', {format:/(\d+)/}));
+ 
+      // return full id
+      assertEqual('sortable_specialformat[]=x1item&sortable_specialformat[]=x2item', 
+        Sortable.serialize('sortable_specialformat', {format:/(.*)/}));
+      
+      // test default format given explicitly
+      assertEqual('sortable1[]=1&sortable1[]=2&sortable1[]=3', 
+        Sortable.serialize('sortable1',{format:/^[^_]*_(.*)$/}));
+        
+      // Ensure default options.format handles longer, more complex list
+      // item IDs
+      assertEqual('sortable_complex[]=1&sortable_complex[]=2&sortable_complex[]=33&sortable_complex[]=',
+        Sortable.serialize('sortable_complex'));
+    }},
+    
+    testSortableSerializeRule: function() { with(this) {
+      var ids = ['x','x-y','test_test','x_y_z','x_y-x_z'];
+      ids.each(function(id){
+        assertEqual('1',
+          (id+'_1').match(Sortable.SERIALIZE_RULE)[1]);
+      });
+      
+      assertNull('x'.match(Sortable.SERIALIZE_RULE));
+    }},
+
+    testSortableSerializeName: function() { with(this) {
+      assertEqual('dumdidu[]=1&dumdidu[]=2',
+      Sortable.serialize('sortable_specialcreate',{name:'dumdidu'}));
+    }},
+    
+    testSortableSequenceFormat: function() { with(this) {
+      // shauld correctly serialize from option given to Sortable.create()
+      assertEnumEqual(['1','2'], 
+        Sortable.sequence('sortable_specialcreate'));
+      
+      // test special format given explicitly
+      assertEnumEqual(['1','2'], 
+        Sortable.sequence('sortable_specialformat', {format:/(\d+)/}));
+ 
+      // return full id
+      assertEnumEqual(['x1item','x2item'], 
+        Sortable.sequence('sortable_specialformat', {format:/(.*)/}));
+      
+      // test default format given explicitly
+      assertEnumEqual(['1','2','3'], 
+        Sortable.sequence('sortable1',{format:/^[^_]*_(.*)$/}));
+    }},
+    
+    testSortableFindElements: function() { with(this) {
+      assertEqual(3, Sortable.findElements($('sortable1'),{tag:'li',only:['a','b']}).length);
+      benchmark(function(){
+        Sortable.findElements($('sortable1'),{tag:'li',only:['a','b']})
+      },1,'Sortable.findElements/1');
+      
+      assertEqual(1, Sortable.findElements($('sortable1'),{tag:'li',only:['x']}).length);
+      assertEqual(1, Sortable.findElements($('sortable1'),{tag:'li',only:'a'}).length);
+      assertEqual(2, Sortable.findElements($('sortable1'),{tag:'li',only:'b'}).length);
+      assertEqual(4, Sortable.findElements($('sortable1'),{tag:'li',only:['a','b','x']}).length);
+    }},
+
+    testSortableSetSequence: function() { with(this) {
+      // make sure assigning current sequence is a no-op 
+      var o = Sortable.sequence('sortable1');
+      Sortable.setSequence('sortable1', ['1','2','3']);
+      assertEnumEqual(o, Sortable.sequence('sortable1'));
+      
+      // check new sequence   
+      Sortable.setSequence('sortable1', ['3','2','1']);
+      assertEnumEqual(['3','2','1'], Sortable.sequence('sortable1'));
+      
+      // non-default format
+      Sortable.setSequence('sortable_specialformat', ['2','1'], { format:/(\d+)/ });
+      assertEnumEqual(['2','1'], Sortable.sequence('sortable_specialformat'));
+      
+      // invalid sequence ids should be ignored
+      Sortable.setSequence('sortable1', ['x', '1', 'y', '2', '3', 'z']);
+      assertEnumEqual(['1', '2', '3'], Sortable.sequence('sortable1'));
+      
+      // elements omitted in new sequence should be cropped
+      Sortable.setSequence('sortable1', ['1', '3']);
+      assertEnumEqual(['1', '3'], Sortable.sequence('sortable1'));
+    }}
+
+  }, "testlog");
+// ]]>
+</script>
+</body>
+</html>
diff --git a/dom/tests/mochitest/ajax/scriptaculous/test/unit/string_test.html b/dom/tests/mochitest/ajax/scriptaculous/test/unit/string_test.html
new file mode 100644
index 000000000..995dba496
--- /dev/null
+++ b/dom/tests/mochitest/ajax/scriptaculous/test/unit/string_test.html
@@ -0,0 +1,67 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<head>
+  <title>script.aculo.us Unit test file</title>
+  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
+  <script src="../../lib/prototype.js" type="text/javascript"></script>
+  <script src="../../src/scriptaculous.js" type="text/javascript"></script>
+  <script src="../../src/unittest.js" type="text/javascript"></script>
+  <link rel="stylesheet" href="../test.css" type="text/css" />
+</head>
+<body>
+<h1>script.aculo.us Unit test file</h1>
+<p>
+  Tests for String.prototype extensions in effects.js
+</p>
+
+<!-- Log output -->
+<div id="testlog"> </div>
+
+<!-- Tests follow -->
+<script type="text/javascript" language="javascript" charset="utf-8">
+// <![CDATA[
+
+  new Test.Unit.Runner({
+    
+    testStringParseColor: function() { with(this) {
+      assertEqual('#000000', "#000000".parseColor());
+      assertEqual('#000000', "rgb(0,0,0)".parseColor());
+      assertEqual('#000000', "rgb(0, 0, 0)".parseColor());
+      assertEqual('#000000', "#000".parseColor());
+
+      assertEqual('#1', "#1".parseColor());
+      assertEqual('#12', "#12".parseColor());
+      assertEqual('#112233', "#123".parseColor());
+      assertEqual('#1234', "#1234".parseColor());
+      assertEqual('#12345', "#12345".parseColor());
+      assertEqual('#123456', "#123456".parseColor());
+      
+      assertEqual('#abcdef', "#aBcDeF".parseColor());
+      assertEqual('#aabbcc', "#aBc".parseColor());
+      
+      assertEqual('white', "white".parseColor());
+      assertEqual('#123456', "#123456".parseColor('#000000'));  // default to #000000 if not parseable
+      assertEqual('#000000', "white".parseColor('#000000'));  // default to #000000 if not parseable
+            
+      assertEqual('#ffffff', "rgb(255,255,255)".parseColor());
+      assertEqual('#ff0000', "rgb(255,0,0)".parseColor());
+      assertEqual('#00ff00', "rgb(0,255,0)".parseColor());
+      assertEqual('#0000ff', "rgb(0,0,255)".parseColor());
+    }},
+    
+    testStringParseStyle: function() { with(this) {
+      var expected = "#<Hash:{'fontSize': '11px'}>";
+
+      assertInspect(expected, "font-size:11px".parseStyle());
+      assertInspect(expected, "font-SIZE:  11px".parseStyle());
+      assertInspect(expected, "font-size:11px  ".parseStyle());
+      assertInspect(expected, " Font-size: 11px  ".parseStyle());
+    }}
+
+  });
+  
+// ]]>
+</script>
+</body>
+</html>
\ No newline at end of file
diff --git a/dom/tests/mochitest/ajax/scriptaculous/test/unit/unit_test.html b/dom/tests/mochitest/ajax/scriptaculous/test/unit/unit_test.html
new file mode 100644
index 000000000..39c078959
--- /dev/null
+++ b/dom/tests/mochitest/ajax/scriptaculous/test/unit/unit_test.html
@@ -0,0 +1,154 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
+<head>
+  <title>script.aculo.us Unit test file</title>
+  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
+  <script src="../../lib/prototype.js" type="text/javascript"></script>
+  <script src="../../src/scriptaculous.js" type="text/javascript"></script>
+  <script src="../../src/unittest.js" type="text/javascript"></script>
+  <link rel="stylesheet" href="../test.css" type="text/css" />
+  <style type="text/css" media="screen">
+  /* <![CDATA[ */
+    #testcss1 { font-size:11px; color: #f00; }
+    #testcss2 { font-size:12px; color: #0f0; display: none; }
+  /* ]]> */
+  </style>
+</head>
+<body>
+<h1>script.aculo.us Unit test file</h1>
+<p>
+  This is a preliminary version mostly for testing the unittest library.
+</p>
+
+<!-- Log output -->
+<div id="testlog"> </div>
+
+<!-- Test elements follow -->
+<div id="test_1" class="a bbbbbbbbbbbb cccccccccc dddd"> </div>
+
+<div id="test_2"> <span> </span> 
+
+
+
+<div><div></div> </div><span> </span>
+</div>
+
+<ul id="tlist"><li id="tlist_1">x1</li><li id="tlist_2">x2</li></ul>
+<ul id="tlist2"><li class="a" id="tlist2_1">x1</li><li id="tlist2_2">x2</li></ul>
+
+<div id="testmoveby" style="background-color:#333;width:100px;">XXXX</div>
+
+<div id="testcss1">testcss1<span id="testcss1_span" style="display:none;">blah</span></div><div id="testcss2">testcss1</div>
+
+<!-- Tests follow -->
+<script type="text/javascript" language="javascript" charset="utf-8">
+// <![CDATA[
+
+  var testObj = {
+    isNice: function(){
+      return true;
+    },
+    isBroken: function(){
+      return false;
+    }
+  }
+
+  new Test.Unit.Runner({
+    
+    testAssertEqual: function() { with(this) {
+      assertEqual(0, 0);
+      assertEqual(0, 0, "test");
+      
+      assertEqual(0,'0');
+      assertEqual(65.0, 65);
+      
+      assertEqual("a", "a");
+      assertEqual("a", "a", "test");
+      
+      assertNotEqual(0, 1);
+      assertNotEqual("a","b");
+      assertNotEqual({},{});
+      assertNotEqual([],[]);
+      assertNotEqual([],{});
+    }},
+    
+    testAssertRespondsTo: function() { with(this) {
+      assertRespondsTo('isNice', testObj);
+      assertRespondsTo('isBroken', testObj);
+    }},
+    
+    testAssertIndentical: function() { with(this) { 
+      assertIdentical(0, 0); 
+      assertIdentical(0, 0, "test"); 
+      assertIdentical(1, 1); 
+      assertIdentical('a', 'a'); 
+      assertIdentical('a', 'a', "test"); 
+      assertIdentical('', ''); 
+      assertIdentical(undefined, undefined); 
+      assertIdentical(null, null); 
+      assertIdentical(true, true); 
+      assertIdentical(false, false); 
+      
+      var obj = {a:'b'};
+      assertIdentical(obj, obj);
+      
+      assertNotIdentical({1:2,3:4},{1:2,3:4});
+      
+      assertIdentical(1, 1.0); // both are typeof == 'number'
+      
+      assertNotIdentical(1, '1');
+      assertNotIdentical(1, '1.0');
+    }},
+    
+    testAssertMatch: function() { with(this) {
+      assertMatch(/knowmad.jpg$/, 'http://script.aculo.us/images/knowmad.jpg');
+      assertMatch(/Fuc/, 'Thomas Fuchs');
+      assertMatch(/^\$(\d{1,3}(\,\d{3})*|(\d+))(\.\d{2})?$/, '$19.95');
+      assertMatch(/(\d{3}\) ?)|(\d{3}[- \.])?\d{3}[- \.]\d{4}(\s(x\d+)?){0,1}$/, '704-343-9330');
+           assertMatch(/^(?:(?:(?:(?:(?:1[6-9]|[2-9]\d)?(?:0[48]|[2468][048]|[13579][26])|(?:(?:16|[2468][048]|[3579][26])00)))(\/|-|\.)(?:0?2\1(?:29)))|(?:(?:(?:1[6-9]|[2-9]\d)?\d{2})(\/|-|\.)(?:(?:(?:0?[13578]|1[02])\2(?:31))|(?:(?:0?[1,3-9]|1[0-2])\2(29|30))|(?:(?:0?[1-9])|(?:1[0-2]))\2(?:0?[1-9]|1\d|2[0-8]))))$/, '2001-06-16');
+      assertMatch(/^((0?[123456789])|(1[012]))\s*:\s*([012345]\d)(\s*:\s*([012345]\d))?\s*[ap]m\s*-\s*((0?[123456789])|(1[012]))\s*:\s*([012345]\d)(\s*:\s*([012345]\d))?\s*[ap]m$/i, '2:00PM-2:15PM');
+      
+    }},
+    
+    testAssertInstanceOf: function() { with(this) {
+      assertInstanceOf(Effect.Opacity, new Effect.Opacity('testcss1',{sync:true}));
+      assertNotInstanceOf(String, new Effect.Opacity('testcss1',{sync:true}));
+      
+      // note: fails with firefox 1.0.X (bug, fixed in Deer Park)
+      assertNotInstanceOf(Effect.Parallel, new Effect.Opacity('testcss1',{sync:true}), "(note: fails with firefox 1.0.X, fixed in Deer Park)");   
+    }},
+    
+    testAssertReturns: function() { with(this) {
+      
+      assertReturnsTrue('isNice',testObj);
+      assertReturnsFalse('isBroken',testObj);
+      
+      assertReturnsTrue('nice',testObj);
+      assertReturnsFalse('broken',testObj);
+      
+    }},
+  
+    testAssertVisible: function() { with(this) {
+      assertVisible('testcss1');
+      assertNotVisible('testcss1_span');
+      assertNotVisible('testcss2', "Due to a Safari bug, this test fails in Safari.");
+      
+      Element.hide('testcss1');
+      assertNotVisible('testcss1');
+      assertNotVisible('testcss1_span');
+      Element.show('testcss1');
+      assertVisible('testcss1');
+      assertNotVisible('testcss1_span');
+      
+      Element.show('testcss1_span');
+      assertVisible('testcss1_span');
+      Element.hide('testcss1');
+      assertNotVisible('testcss1_span'); // hidden by parent
+    }}
+      
+  }, "testlog");
+// ]]>
+</script>
+</body>
+</html>
\ No newline at end of file
-- 
cgit v1.2.3