Bug 768766 - Make css-valid tests use MozReftestInvalidate and mark them as fuzzy. r=roc
authorMatt Woodrow <mwoodrow@mozilla.com>
Wed, 29 Aug 2012 17:48:44 +1200
changeset 108278 39e70f91d826c8599de710a37049051d756c2946
parent 108277 e004a9acf00d936b6f938d1390188b6f9eb94c3a
child 108279 625343f34ca2b6450a9ca698a22074a60851b429
push id23552
push userryanvm@gmail.com
push dateFri, 28 Sep 2012 03:05:08 +0000
treeherdermozilla-central@2d96ee8d9dd4 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersroc
bugs768766
milestone18.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 768766 - Make css-valid tests use MozReftestInvalidate and mark them as fuzzy. r=roc
layout/reftests/css-invalid/input/input-customerror.html
layout/reftests/css-invalid/input/input-type-invalid.html
layout/reftests/css-invalid/input/reftest.list
layout/reftests/css-invalid/textarea/reftest.list
layout/reftests/css-invalid/textarea/textarea-customerror.html
layout/reftests/css-invalid/textarea/textarea-dyn-disabled.html
layout/reftests/css-invalid/textarea/textarea-dyn-not-disabled.html
layout/reftests/css-invalid/textarea/textarea-dyn-not-readonly.html
layout/reftests/css-invalid/textarea/textarea-dyn-readonly.html
layout/reftests/css-ui-invalid/input/input-customerror.html
layout/reftests/css-ui-invalid/input/input-type-invalid.html
layout/reftests/css-ui-invalid/input/reftest.list
layout/reftests/css-ui-invalid/textarea/reftest.list
layout/reftests/css-ui-invalid/textarea/textarea-customerror.html
layout/reftests/css-ui-invalid/textarea/textarea-dyn-disabled.html
layout/reftests/css-ui-invalid/textarea/textarea-dyn-not-disabled.html
layout/reftests/css-ui-invalid/textarea/textarea-dyn-not-readonly-changed.html
layout/reftests/css-ui-invalid/textarea/textarea-dyn-not-readonly-not-changed.html
layout/reftests/css-ui-invalid/textarea/textarea-dyn-readonly.html
layout/reftests/css-ui-invalid/textarea/textarea-required-invalid-changed.html
layout/reftests/css-ui-valid/input/input-customerror.html
layout/reftests/css-ui-valid/input/input-type-invalid.html
layout/reftests/css-ui-valid/input/reftest.list
layout/reftests/css-ui-valid/select/reftest.list
layout/reftests/css-ui-valid/select/select-required-multiple-valid-changed.html
layout/reftests/css-ui-valid/textarea/reftest.list
layout/reftests/css-ui-valid/textarea/textarea-customerror.html
layout/reftests/css-ui-valid/textarea/textarea-dyn-disabled.html
layout/reftests/css-ui-valid/textarea/textarea-dyn-not-disabled-changed.html
layout/reftests/css-ui-valid/textarea/textarea-dyn-not-disabled.html
layout/reftests/css-ui-valid/textarea/textarea-dyn-not-readonly-changed.html
layout/reftests/css-ui-valid/textarea/textarea-dyn-not-readonly.html
layout/reftests/css-ui-valid/textarea/textarea-dyn-readonly.html
layout/reftests/css-ui-valid/textarea/textarea-maxlength-valid-changed.html
layout/reftests/css-valid/input/input-customerror.html
layout/reftests/css-valid/input/input-type-invalid.html
layout/reftests/css-valid/input/reftest.list
layout/reftests/css-valid/textarea/reftest.list
layout/reftests/css-valid/textarea/textarea-customerror.html
layout/reftests/css-valid/textarea/textarea-dyn-disabled.html
layout/reftests/css-valid/textarea/textarea-dyn-not-disabled.html
layout/reftests/css-valid/textarea/textarea-dyn-not-readonly.html
layout/reftests/css-valid/textarea/textarea-dyn-readonly.html
--- a/layout/reftests/css-invalid/input/input-customerror.html
+++ b/layout/reftests/css-invalid/input/input-customerror.html
@@ -1,9 +1,18 @@
 <!DOCTYPE html>
 <html class="reftest-wait">
+  <head>
+    <script>
+      function doTest() {
+        document.getElementById('t').setCustomValidity('foo');
+        document.documentElement.className='';
+      }
+      document.addEventListener("MozReftestInvalidate", doTest, false);
+    </script>
+  </head>
   <!-- Test: if input has a custom error, it should be affected by :invalid
              pseudo-class. -->
   <link rel='stylesheet' type='text/css' href='style.css'>
-  <body onload="document.getElementById('t').setCustomValidity('foo'); document.documentElement.className='';">
+  <body>
     <input class='invalid' id='t'>
   </body>
 </html>
--- a/layout/reftests/css-invalid/input/input-type-invalid.html
+++ b/layout/reftests/css-invalid/input/input-type-invalid.html
@@ -1,19 +1,20 @@
 <!DOCTYPE html>
 <html class="reftest-wait">
   <!-- Test: if an input has a custom error when barred from constraint
              validation then move a type candidate for constraint validation,
              it should not be affected by :valid pseudo-class. -->
   <link rel='stylesheet' type='text/css' href='style.css'>
   <script>
-    function onLoadHandler()
+    function doTest()
     {
       var i = document.getElementById('i');
       i.setCustomValidity('foo');
       i.type = 'text';
       document.documentElement.className='';
     }
+    document.addEventListener("MozReftestInvalidate", doTest, false);
   </script>
-  <body onload="onLoadHandler();">
+  <body>
     <input class='invalid' type='button' id='i'>
   </body>
 </html>
--- a/layout/reftests/css-invalid/input/reftest.list
+++ b/layout/reftests/css-invalid/input/reftest.list
@@ -1,10 +1,10 @@
 == input-valid.html input-ref.html
-== input-customerror.html input-ref.html
+fuzzy(11,4) == input-customerror.html input-ref.html
 fails-if(Android) == input-disabled.html input-ref.html
 fails-if(Android) == input-dyn-disabled.html input-ref.html
 == input-dyn-not-disabled.html input-ref.html
 == input-readonly.html input-ref.html
 == input-dyn-readonly.html input-ref.html
 == input-dyn-not-readonly.html input-ref.html
 == input-maxlength-valid.html input-ref.html
 == input-maxlength-invalid.html input-withtext-ref.html
@@ -14,17 +14,17 @@ fails-if(Android) == input-dyn-disabled.
 == input-reset.html input-button-ref.html
 == input-email-invalid.html input-withtext-ref.html
 == input-email-valid.html input-email-ref.html
 == input-url-invalid.html input-withtext-ref.html
 == input-url-valid.html input-url-ref.html
 == input-pattern-valid.html input-withtext-ref.html
 == input-pattern-invalid.html input-withtext-ref.html
 == input-type-barred.html input-button-ref.html
-== input-type-invalid.html input-ref.html
+fuzzy(11,4) == input-type-invalid.html input-ref.html
 == input-disabled-fieldset-1.html input-fieldset-ref.html
 == input-disabled-fieldset-2.html input-fieldset-ref.html
 == input-fieldset-legend.html input-fieldset-legend-ref.html
 == input-radio-required.html input-radio-ref.html
 == input-radio-customerror.html input-radio-ref.html
 == input-radio-dyn-valid-1.html input-radio-checked-ref.html
 == input-radio-dyn-valid-2.html input-radio-ref.html
 == input-radio-nogroup-required-valid.html input-radio-ref.html
--- a/layout/reftests/css-invalid/textarea/reftest.list
+++ b/layout/reftests/css-invalid/textarea/reftest.list
@@ -1,15 +1,15 @@
 == textarea-valid.html textarea-ref.html
-== textarea-customerror.html textarea-ref.html
+fuzzy(11,4) == textarea-customerror.html textarea-ref.html
 fails-if(Android) == textarea-disabled.html textarea-ref.html
-fails-if(Android) == textarea-dyn-disabled.html textarea-ref.html
-== textarea-dyn-not-disabled.html textarea-ref.html
+fuzzy(11,4) fails-if(Android) == textarea-dyn-disabled.html textarea-ref.html
+fuzzy(11,4) == textarea-dyn-not-disabled.html textarea-ref.html
 == textarea-readonly.html textarea-ref.html
-== textarea-dyn-readonly.html textarea-ref.html
-== textarea-dyn-not-readonly.html textarea-ref.html
+fuzzy(11,4) == textarea-dyn-readonly.html textarea-ref.html
+fuzzy(11,4) == textarea-dyn-not-readonly.html textarea-ref.html
 == textarea-maxlength-valid.html textarea-ref.html
 == textarea-maxlength-invalid.html textarea-withtext-ref.html
 == textarea-required-valid.html textarea-withtext-ref.html
 == textarea-required-invalid.html textarea-ref.html
 == textarea-disabled-fieldset-1.html textarea-fieldset-ref.html
 == textarea-disabled-fieldset-2.html textarea-fieldset-ref.html
 == textarea-fieldset-legend.html textarea-fieldset-legend-ref.html
--- a/layout/reftests/css-invalid/textarea/textarea-customerror.html
+++ b/layout/reftests/css-invalid/textarea/textarea-customerror.html
@@ -1,9 +1,18 @@
 <!DOCTYPE html>
 <html class="reftest-wait">
+  <head>
+    <script>
+      function doTest() {
+        document.getElementById('t').setCustomValidity('foo');
+        document.documentElement.className='';
+      }
+      document.addEventListener("MozReftestInvalidate", doTest, false);
+    </script>
+  </head>
   <!-- Test: if textarea has a custom error, it should be affected by :invalid
              pseudo-class. -->
   <link rel='stylesheet' type='text/css' href='style.css'>
-  <body onload="document.getElementById('t').setCustomValidity('foo'); document.documentElement.className='';">
+  <body>
     <textarea class='invalid' id='t'></textarea>
   </body>
 </html>
--- a/layout/reftests/css-invalid/textarea/textarea-dyn-disabled.html
+++ b/layout/reftests/css-invalid/textarea/textarea-dyn-disabled.html
@@ -1,18 +1,19 @@
 <!DOCTYPE html>
 <html class="reftest-wait">
   <!-- Test: if textarea is disabled and invalid, it is barred from constraint
              validation and should not be affected by :invalid pseudo-class. -->
   <link rel='stylesheet' type='text/css' href='style.css'>
   <script>
-    function onLoadHandler()
+    function doTest()
     {
       var e = document.getElementById('t');
       e.setCustomValidity('foo');
       e.disabled = 'true';
       document.documentElement.className='';
     }
+    document.addEventListener("MozReftestInvalidate", doTest, false);
   </script>
-  <body onload="onLoadHandler();">
+  <body>
     <textarea class='notinvalid' id='t'></textarea>
   </body>
 </html>
--- a/layout/reftests/css-invalid/textarea/textarea-dyn-not-disabled.html
+++ b/layout/reftests/css-invalid/textarea/textarea-dyn-not-disabled.html
@@ -1,19 +1,20 @@
 <!DOCTYPE html>
 <html class="reftest-wait">
   <!-- Test: if textarea is not disabled and invalid, it is candidate for
              constraint validation and should be affected
              by :invalid pseudo-class. -->
   <link rel='stylesheet' type='text/css' href='style.css'>
   <script>
-    function onLoadHandler()
+    function doTest()
     {
       var e = document.getElementById('t');
       e.setCustomValidity('foo');
       e.removeAttribute('disabled');
       document.documentElement.className='';
     }
+    document.addEventListener("MozReftestInvalidate", doTest, false);
   </script>
-  <body onload="onLoadHandler();">
+  <body>
     <textarea class='invalid' id='t' disabled></textarea>
   </body>
 </html>
--- a/layout/reftests/css-invalid/textarea/textarea-dyn-not-readonly.html
+++ b/layout/reftests/css-invalid/textarea/textarea-dyn-not-readonly.html
@@ -1,9 +1,18 @@
 <!DOCTYPE html>
 <html class="reftest-wait">
+  <head>
+    <script>
+      function doTest() {
+        document.getElementById('t').removeAttribute('readonly');
+        document.documentElement.className='';
+      }
+      document.addEventListener("MozReftestInvalidate", doTest, false);
+    </script>
+  </head>
   <!-- Test: if textarea is no longer readonly, it is candidate for constraint
              validation and should be affected by :invalid pseudo-class. -->
   <link rel='stylesheet' type='text/css' href='style.css'>
-  <body onload="document.getElementById('t').removeAttribute('readonly'); document.documentElement.className='';">
+  <body>
     <textarea class='invalid' id='t' readonly required></textarea>
   </body>
 </html>
--- a/layout/reftests/css-invalid/textarea/textarea-dyn-readonly.html
+++ b/layout/reftests/css-invalid/textarea/textarea-dyn-readonly.html
@@ -1,9 +1,18 @@
 <!DOCTYPE html>
 <html class="reftest-wait">
+  <head>
+    <script>
+      function doTest() {
+        document.getElementById('t').readOnly='ro';
+        document.documentElement.className='';
+      }
+      document.addEventListener("MozReftestInvalidate", doTest, false);
+    </script>
+  </head>
   <!-- Test: if textarea is readonly, it is barred from constraint validation
              and should not be affected by :invalid pseudo-class. -->
   <link rel='stylesheet' type='text/css' href='style.css'>
-  <body onload="document.getElementById('t').readOnly='ro'; document.documentElement.className='';">
+  <body>
     <textarea class='notinvalid' id='t' required></textarea>
   </body>
 </html>
--- a/layout/reftests/css-ui-invalid/input/input-customerror.html
+++ b/layout/reftests/css-ui-invalid/input/input-customerror.html
@@ -1,9 +1,18 @@
 <!DOCTYPE html>
 <html class="reftest-wait">
+  <head>
+    <script>
+      function doTest() {
+        document.getElementById('t').setCustomValidity('foo');
+        document.documentElement.className='';
+      }
+      document.addEventListener("MozReftestInvalidate", doTest, false);
+    </script>
+  </head>
   <!-- Test: if input has a custom error, it should be affected by :-moz-ui-invalid
              pseudo-class. -->
   <link rel='stylesheet' type='text/css' href='style.css'>
-  <body onload="document.getElementById('t').setCustomValidity('foo'); document.documentElement.className='';">
+  <body>
     <input class='invalid' id='t'>
   </body>
 </html>
--- a/layout/reftests/css-ui-invalid/input/input-type-invalid.html
+++ b/layout/reftests/css-ui-invalid/input/input-type-invalid.html
@@ -1,19 +1,20 @@
 <!DOCTYPE html>
 <html class="reftest-wait">
   <!-- Test: if an input has a custom error when barred from constraint
              validation then move a type candidate for constraint validation,
              it should not be affected by :valid pseudo-class. -->
   <link rel='stylesheet' type='text/css' href='style.css'>
   <script>
-    function onLoadHandler()
+    function doTest()
     {
       var i = document.getElementById('i');
       i.setCustomValidity('foo');
       i.type = 'text';
       document.documentElement.className='';
     }
+    document.addEventListener("MozReftestInvalidate", doTest, false);
   </script>
-  <body onload="onLoadHandler();">
+  <body>
     <input class='invalid' type='button' id='i'>
   </body>
 </html>
--- a/layout/reftests/css-ui-invalid/input/reftest.list
+++ b/layout/reftests/css-ui-invalid/input/reftest.list
@@ -1,10 +1,10 @@
 == input-valid.html input-ref.html
-== input-customerror.html input-ref.html
+fuzzy(64,4) == input-customerror.html input-ref.html
 fails-if(Android) == input-disabled.html input-ref.html
 fails-if(Android) == input-dyn-disabled.html input-ref.html
 == input-dyn-not-disabled.html input-ref.html
 == input-readonly.html input-ref.html
 == input-dyn-readonly.html input-ref.html
 == input-dyn-not-readonly-not-changed.html input-ref.html
 == input-dyn-not-readonly-changed.html input-ref.html
 == input-maxlength-valid.html input-ref.html
@@ -20,17 +20,17 @@ fails-if(Android) == input-dyn-disabled.
 == input-email-valid.html input-email-ref.html
 == input-url-invalid-changed.html input-withtext-ref.html
 == input-url-invalid-default.html input-withtext-ref.html
 == input-url-valid.html input-url-ref.html
 == input-pattern-valid.html input-withtext-ref.html
 == input-pattern-invalid-default.html input-withtext-ref.html
 == input-pattern-invalid-changed.html input-withtext-ref.html
 == input-type-barred.html input-button-ref.html
-== input-type-invalid.html input-ref.html
+fuzzy(64,4) == input-type-invalid.html input-ref.html
 == input-disabled-fieldset-1.html input-fieldset-ref.html
 == input-disabled-fieldset-2.html input-fieldset-ref.html
 == input-fieldset-legend.html input-fieldset-legend-ref.html
 == input-checkbox-required-invalid-changed.html success-ref.html
 == input-checkbox-required-invalid-default.html success-ref.html
 == input-radio-required-invalid-changed.html success-ref.html
 == input-radio-required-invalid-default.html success-ref.html
 == input-file-required-invalid-changed.html input-file-ref.html
--- a/layout/reftests/css-ui-invalid/textarea/reftest.list
+++ b/layout/reftests/css-ui-invalid/textarea/reftest.list
@@ -1,18 +1,18 @@
 == textarea-valid.html textarea-ref.html
-== textarea-customerror.html textarea-ref.html
+fuzzy(11,4) == textarea-customerror.html textarea-ref.html
 fails-if(Android) == textarea-disabled.html textarea-ref.html
-fails-if(Android) == textarea-dyn-disabled.html textarea-ref.html
-== textarea-dyn-not-disabled.html textarea-ref.html
+fuzzy(11,4) fails-if(Android) == textarea-dyn-disabled.html textarea-ref.html
+fuzzy(11,4) == textarea-dyn-not-disabled.html textarea-ref.html
 == textarea-readonly.html textarea-ref.html
-== textarea-dyn-readonly.html textarea-ref.html
-== textarea-dyn-not-readonly-not-changed.html textarea-ref.html
-== textarea-dyn-not-readonly-changed.html textarea-ref.html
+fuzzy(11,4) == textarea-dyn-readonly.html textarea-ref.html
+fuzzy(11,4) == textarea-dyn-not-readonly-not-changed.html textarea-ref.html
+fuzzy(11,4) == textarea-dyn-not-readonly-changed.html textarea-ref.html
 == textarea-maxlength-valid.html textarea-ref.html
 == textarea-maxlength-invalid.html textarea-withtext-ref.html
 == textarea-maxlength-default-value-invalid.html textarea-withtext-ref.html
 == textarea-required-valid.html textarea-withtext-ref.html
 == textarea-required-invalid.html textarea-ref.html
-== textarea-required-invalid-changed.html textarea-ref.html
+fuzzy(11,4) == textarea-required-invalid-changed.html textarea-ref.html
 == textarea-disabled-fieldset-1.html textarea-fieldset-ref.html
 == textarea-disabled-fieldset-2.html textarea-fieldset-ref.html
 == textarea-novalidate.html textarea-ref.html
--- a/layout/reftests/css-ui-invalid/textarea/textarea-customerror.html
+++ b/layout/reftests/css-ui-invalid/textarea/textarea-customerror.html
@@ -1,9 +1,18 @@
 <!DOCTYPE html>
 <html class="reftest-wait">
+  <head>
+    <script>
+      function doTest() {
+        document.getElementById('t').setCustomValidity('foo');
+        document.documentElement.className='';
+      }
+      document.addEventListener("MozReftestInvalidate", doTest, false);
+    </script>
+  </head>
   <!-- Test: if textarea has a custom error, it should be affected by :-moz-ui-invalid
              pseudo-class. -->
   <link rel='stylesheet' type='text/css' href='style.css'>
-  <body onload="document.getElementById('t').setCustomValidity('foo'); document.documentElement.className='';">
+  <body>
     <textarea class='invalid' id='t'></textarea>
   </body>
 </html>
--- a/layout/reftests/css-ui-invalid/textarea/textarea-dyn-disabled.html
+++ b/layout/reftests/css-ui-invalid/textarea/textarea-dyn-disabled.html
@@ -1,18 +1,19 @@
 <!DOCTYPE html>
 <html class="reftest-wait">
   <!-- Test: if textarea is disabled and invalid, it is barred from constraint
              validation and should not be affected by :-moz-ui-invalid pseudo-class. -->
   <link rel='stylesheet' type='text/css' href='style.css'>
   <script>
-    function onLoadHandler()
+    function doTest()
     {
       var e = document.getElementById('t');
       e.setCustomValidity('foo');
       e.disabled = 'true';
       document.documentElement.className='';
     }
+    document.addEventListener("MozReftestInvalidate", doTest, false);
   </script>
-  <body onload="onLoadHandler();">
+  <body>
     <textarea class='notinvalid' id='t'></textarea>
   </body>
 </html>
--- a/layout/reftests/css-ui-invalid/textarea/textarea-dyn-not-disabled.html
+++ b/layout/reftests/css-ui-invalid/textarea/textarea-dyn-not-disabled.html
@@ -1,19 +1,20 @@
 <!DOCTYPE html>
 <html class="reftest-wait">
   <!-- Test: if textarea is not disabled and invalid, it is candidate for
              constraint validation and should be affected
              by :-moz-ui-invalid pseudo-class. -->
   <link rel='stylesheet' type='text/css' href='style.css'>
   <script>
-    function onLoadHandler()
+    function doTest()
     {
       var e = document.getElementById('t');
       e.setCustomValidity('foo');
       e.removeAttribute('disabled');
       document.documentElement.className='';
     }
+    document.addEventListener("MozReftestInvalidate", doTest, false);
   </script>
-  <body onload="onLoadHandler();">
+  <body>
     <textarea class='invalid' id='t' disabled></textarea>
   </body>
 </html>
--- a/layout/reftests/css-ui-invalid/textarea/textarea-dyn-not-readonly-changed.html
+++ b/layout/reftests/css-ui-invalid/textarea/textarea-dyn-not-readonly-changed.html
@@ -1,11 +1,19 @@
 <!DOCTYPE html>
 <html class="reftest-wait">
+  <head>
+    <script>
+      function doTest() {
+        document.getElementById('t').removeAttribute('readonly');
+        document.getElementById('t').value = '';
+        document.documentElement.className='';
+      }
+      document.addEventListener("MozReftestInvalidate", doTest, false);
+    </script>
+  </head>
   <!-- Test: if textarea is no longer readonly and has it's value changed,
              it's affected by :-moz-ui-invalid pseudo-class. -->
   <link rel='stylesheet' type='text/css' href='style.css'>
-  <body onload="document.getElementById('t').removeAttribute('readonly');
-                document.getElementById('t').value = '';
-                document.documentElement.className='';">
+  <body>
     <textarea class='invalid' id='t' readonly required></textarea>
   </body>
 </html>
--- a/layout/reftests/css-ui-invalid/textarea/textarea-dyn-not-readonly-not-changed.html
+++ b/layout/reftests/css-ui-invalid/textarea/textarea-dyn-not-readonly-not-changed.html
@@ -1,9 +1,18 @@
 <!DOCTYPE html>
 <html class="reftest-wait">
+  <head>
+    <script>
+      function doTest() {
+        document.getElementById('t').removeAttribute('readonly');
+        document.documentElement.className='';
+      }
+      document.addEventListener("MozReftestInvalidate", doTest, false);
+    </script>
+  </head>
   <!-- Test: if textarea is no longer readonly, but doesn't have it's value changed,
              it's not affected by :-moz-ui-invalid pseudo-class. -->
   <link rel='stylesheet' type='text/css' href='style.css'>
-  <body onload="document.getElementById('t').removeAttribute('readonly'); document.documentElement.className='';">
+  <body>
     <textarea class='notinvalid' id='t' readonly required></textarea>
   </body>
 </html>
--- a/layout/reftests/css-ui-invalid/textarea/textarea-dyn-readonly.html
+++ b/layout/reftests/css-ui-invalid/textarea/textarea-dyn-readonly.html
@@ -1,9 +1,18 @@
 <!DOCTYPE html>
 <html class="reftest-wait">
+  <head>
+    <script>
+      function doTest() {
+        document.getElementById('t').readOnly='ro';
+        document.documentElement.className='';
+      }
+      document.addEventListener("MozReftestInvalidate", doTest, false);
+    </script>
+  </head>
   <!-- Test: if textarea is readonly, it is barred from constraint validation
              and should not be affected by :-moz-ui-invalid pseudo-class. -->
   <link rel='stylesheet' type='text/css' href='style.css'>
-  <body onload="document.getElementById('t').readOnly='ro'; document.documentElement.className='';">
+  <body>
     <textarea class='notinvalid' id='t' required></textarea>
   </body>
 </html>
--- a/layout/reftests/css-ui-invalid/textarea/textarea-required-invalid-changed.html
+++ b/layout/reftests/css-ui-invalid/textarea/textarea-required-invalid-changed.html
@@ -1,11 +1,19 @@
 <!DOCTYPE html>
 <html class="reftest-wait">
+  <head>
+    <script>
+      function doTest() {
+        document.getElementById('t').value = '';
+        document.documentElement.className='';
+      }
+      document.addEventListener("MozReftestInvalidate", doTest, false);
+    </script>
+  </head>
   <!-- Test: if textarea isn't valid and it's value has been changed,
              it should be affected by :-moz-ui-invalid pseudo-class. -->
   <link rel='stylesheet' type='text/css' href='style.css'>
-  <body onload="document.getElementById('t').value = '';
-                document.documentElement.className='';">
+  <body>
     <textarea id='t' class='invalid' required></textarea>
   </body>
 </html>
 
--- a/layout/reftests/css-ui-valid/input/input-customerror.html
+++ b/layout/reftests/css-ui-valid/input/input-customerror.html
@@ -1,9 +1,18 @@
 <!DOCTYPE html>
 <html class="reftest-wait">
+  <head>
+    <script>
+      function doTest() {
+        document.getElementById('t').setCustomValidity('foo');
+        document.documentElement.className='';
+      }
+      document.addEventListener("MozReftestInvalidate", doTest, false);
+    </script>
+  </head>
   <!-- Test: if input has a custom error, it should not be affected by :-moz-ui-valid
              pseudo-class. -->
   <link rel='stylesheet' type='text/css' href='style.css'>
-  <body onload="document.getElementById('t').setCustomValidity('foo'); document.documentElement.className='';">
+  <body>
     <input class='notvalid' id='t'>
   </body>
 </html>
--- a/layout/reftests/css-ui-valid/input/input-type-invalid.html
+++ b/layout/reftests/css-ui-valid/input/input-type-invalid.html
@@ -1,19 +1,20 @@
 <!DOCTYPE html>
 <html class="reftest-wait">
   <!-- Test: if an input has a custom error when barred from constraint
              validation then move a type candidate for constraint validation,
              it should not be affected by :-moz-ui-valid pseudo-class. -->
   <link rel='stylesheet' type='text/css' href='style.css'>
   <script>
-    function onLoadHandler()
+    function doTest()
     {
       var i = document.getElementById('i');
       i.setCustomValidity('foo');
       i.type = 'text';
       document.documentElement.className='';
     }
+    document.addEventListener("MozReftestInvalidate", doTest, false);
   </script>
-  <body onload="onLoadHandler();">
+  <body>
     <input class='notvalid' type='button' id='i'>
   </body>
 </html>
--- a/layout/reftests/css-ui-valid/input/reftest.list
+++ b/layout/reftests/css-ui-valid/input/reftest.list
@@ -1,10 +1,10 @@
 == input-valid.html input-ref.html
-== input-customerror.html input-ref.html
+fuzzy(11,4) == input-customerror.html input-ref.html
 fails-if(Android) == input-disabled.html input-ref.html
 fails-if(Android) == input-dyn-disabled.html input-ref.html
 == input-dyn-not-disabled.html input-ref.html
 == input-dyn-not-disabled-changed.html input-ref.html
 == input-readonly.html input-ref.html
 == input-dyn-readonly.html input-ref.html
 == input-dyn-not-readonly.html input-ref.html
 == input-dyn-not-readonly-changed.html input-ref.html
@@ -21,17 +21,17 @@ fails-if(Android) == input-dyn-disabled.
 == input-email-valid-changed.html input-email-ref.html
 == input-url-invalid.html input-withtext-ref.html
 == input-url-valid.html input-url-ref.html
 == input-url-valid-changed.html input-url-ref.html
 == input-pattern-valid.html input-withtext-ref.html
 == input-pattern-valid-changed.html input-withtext-ref.html
 == input-pattern-invalid.html input-withtext-ref.html
 == input-type-barred.html input-button-ref.html
-== input-type-invalid.html input-ref.html
+fuzzy(64,4) == input-type-invalid.html input-ref.html
 == input-disabled-fieldset-1.html input-fieldset-ref.html
 == input-disabled-fieldset-2.html input-fieldset-ref.html
 == input-fieldset-legend.html input-fieldset-legend-ref.html
 == input-checkbox-valid-changed.html success-ref.html
 == input-checkbox-valid-default.html success-ref.html
 == input-file-valid-changed.html input-file-ref.html
 == input-file-valid-default.html input-file-ref.html
 == input-radio-required.html success-ref.html
--- a/layout/reftests/css-ui-valid/select/reftest.list
+++ b/layout/reftests/css-ui-valid/select/reftest.list
@@ -6,13 +6,13 @@ needs-focus == select-dyn-disabled.html 
 needs-focus == select-dyn-not-disabled.html select-ref.html
 needs-focus == select-required-invalid.html select-required-ref.html
 needs-focus == select-required-valid-1.html select-required-ref.html
 needs-focus == select-required-valid-2.html select-required-ref.html
 needs-focus == select-required-valid-changed-1.html select-required-ref.html
 needs-focus == select-required-valid-changed-2.html select-required-ref.html
 needs-focus == select-required-multiple-invalid.html select-required-multiple-ref.html
 needs-focus == select-required-multiple-valid.html select-required-multiple-ref.html
-needs-focus == select-required-multiple-valid-changed.html select-required-multiple-ref.html
+fuzzy(64,4) needs-focus == select-required-multiple-valid-changed.html select-required-multiple-ref.html
 fails-if(Android) needs-focus == select-disabled-fieldset-1.html select-fieldset-ref.html
 fails-if(Android) needs-focus == select-disabled-fieldset-2.html select-fieldset-ref.html
 needs-focus == select-fieldset-legend.html select-fieldset-legend-ref.html
 needs-focus == select-novalidate.html select-required-ref.html
--- a/layout/reftests/css-ui-valid/select/select-required-multiple-valid-changed.html
+++ b/layout/reftests/css-ui-valid/select/select-required-multiple-valid-changed.html
@@ -1,16 +1,24 @@
 <!DOCTYPE html>
 <html class='reftest-wait'>
+  <head>
+    <script>
+      function doTest() {
+        document.getElementById('s').options[0].selected = false;
+        document.getElementById('s').options[1].selected = false;
+        document.getElementById('s').options[0].selected = true;
+        document.getElementById('s').options[1].selected = true;
+        document.documentElement.className='';
+      }
+      document.addEventListener("MozReftestInvalidate", doTest, false);
+    </script>
+  </head>
   <!-- Test: if select is required and has at least one option selected and the
              selection did changed, :-moz-ui-valid should not apply. -->
   <link rel='stylesheet' type='text/css' href='style.css'>
-  <body onload="document.getElementById('s').options[0].selected = false;
-                document.getElementById('s').options[1].selected = false;
-                document.getElementById('s').options[0].selected = true;
-                document.getElementById('s').options[1].selected = true;
-                document.documentElement.className = '';">
+  <body>
     <select id='s' class='valid' required multiple>
       <option selected></option>
       <option selected>foo</option>
     </select>
   </body>
 </html>
--- a/layout/reftests/css-ui-valid/textarea/reftest.list
+++ b/layout/reftests/css-ui-valid/textarea/reftest.list
@@ -1,20 +1,20 @@
 == textarea-valid.html textarea-ref.html
-== textarea-customerror.html textarea-ref.html
+fuzzy(11,4) == textarea-customerror.html textarea-ref.html
 fails-if(Android) == textarea-disabled.html textarea-ref.html
-fails-if(Android) == textarea-dyn-disabled.html textarea-ref.html
-== textarea-dyn-not-disabled.html textarea-ref.html
-== textarea-dyn-not-disabled-changed.html textarea-ref.html
+fuzzy(11,4) fails-if(Android) == textarea-dyn-disabled.html textarea-ref.html
+fuzzy(11,4) == textarea-dyn-not-disabled.html textarea-ref.html
+fuzzy(11,4) == textarea-dyn-not-disabled-changed.html textarea-ref.html
 == textarea-readonly.html textarea-ref.html
-== textarea-dyn-readonly.html textarea-ref.html
-== textarea-dyn-not-readonly.html textarea-ref.html
-== textarea-dyn-not-readonly-changed.html textarea-ref.html
+fuzzy(11,4) == textarea-dyn-readonly.html textarea-ref.html
+fuzzy(11,4) == textarea-dyn-not-readonly.html textarea-ref.html
+fuzzy(11,4) == textarea-dyn-not-readonly-changed.html textarea-ref.html
 == textarea-maxlength-valid.html textarea-ref.html
-== textarea-maxlength-valid-changed.html textarea-ref.html
+fuzzy(11,4) == textarea-maxlength-valid-changed.html textarea-ref.html
 == textarea-maxlength-invalid.html textarea-withtext-ref.html
 == textarea-required-valid.html textarea-withtext-ref.html
 == textarea-required-valid-changed.html textarea-withtext-ref.html
 == textarea-required-invalid.html textarea-ref.html
 == textarea-disabled-fieldset-1.html textarea-fieldset-ref.html
 == textarea-disabled-fieldset-2.html textarea-fieldset-ref.html
 == textarea-fieldset-legend.html textarea-fieldset-legend-ref.html
 == textarea-novalidate.html textarea-withtext-ref.html
--- a/layout/reftests/css-ui-valid/textarea/textarea-customerror.html
+++ b/layout/reftests/css-ui-valid/textarea/textarea-customerror.html
@@ -1,9 +1,18 @@
 <!DOCTYPE html>
 <html class="reftest-wait">
+  <head>
+    <script>
+      function doTest() {
+        document.getElementById('t').setCustomValidity('foo');
+        document.documentElement.className='';
+      }
+      document.addEventListener("MozReftestInvalidate", doTest, false);
+    </script>
+  </head>
   <!-- Test: if textarea has a custom error, it should not be affected by :-moz-ui-valid
              pseudo-class. -->
   <link rel='stylesheet' type='text/css' href='style.css'>
-  <body onload="document.getElementById('t').setCustomValidity('foo'); document.documentElement.className='';">
+  <body>
     <textarea class='notvalid' id='t'></textarea>
   </body>
 </html>
--- a/layout/reftests/css-ui-valid/textarea/textarea-dyn-disabled.html
+++ b/layout/reftests/css-ui-valid/textarea/textarea-dyn-disabled.html
@@ -1,9 +1,18 @@
 <!DOCTYPE html>
 <html class="reftest-wait">
+  <head>
+    <script>
+      function doTest() {
+        document.getElementById('t').disabled='true';
+        document.documentElement.className='';
+      }
+      document.addEventListener("MozReftestInvalidate", doTest, false);
+    </script>
+  </head>
   <!-- Test: if textarea is disabled, it is barred from constraint validation
              and should not be affected by :-moz-ui-valid pseudo-class. -->
   <link rel='stylesheet' type='text/css' href='style.css'>
-  <body onload="document.getElementById('t').disabled='true'; document.documentElement.className='';">
+  <body>
     <textarea class='notvalid' id='t'></textarea>
   </body>
 </html>
--- a/layout/reftests/css-ui-valid/textarea/textarea-dyn-not-disabled-changed.html
+++ b/layout/reftests/css-ui-valid/textarea/textarea-dyn-not-disabled-changed.html
@@ -1,11 +1,19 @@
 <!DOCTYPE html>
 <html class="reftest-wait">
+  <head>
+    <script>
+      function doTest() {
+        document.getElementById('t').removeAttribute('disabled');
+        document.getElementById('t').value = '';
+        document.documentElement.className='';
+      }
+      document.addEventListener("MozReftestInvalidate", doTest, false);
+    </script>
+  </head>
   <!-- Test: if textarea is not disabled and its value has been modifie,
              it should be affected by :-moz-ui-valid pseudo-class. -->
   <link rel='stylesheet' type='text/css' href='style.css'>
-  <body onload="document.getElementById('t').removeAttribute('disabled');
-                document.getElementById('t').value = '';
-                document.documentElement.className='';">
+  <body>
     <textarea class='valid' id='t' disabled></textarea>
   </body>
 </html>
--- a/layout/reftests/css-ui-valid/textarea/textarea-dyn-not-disabled.html
+++ b/layout/reftests/css-ui-valid/textarea/textarea-dyn-not-disabled.html
@@ -1,10 +1,18 @@
 <!DOCTYPE html>
 <html class="reftest-wait">
+  <head>
+    <script>
+      function doTest() {
+        document.getElementById('t').removeAttribute('disabled');
+        document.documentElement.className='';
+      }
+      document.addEventListener("MozReftestInvalidate", doTest, false);
+    </script>
+  </head>
   <!-- Test: if textarea is not disabled but its value hasn't been modified,
              it should not be affected by :-moz-ui-valid pseudo-class. -->
   <link rel='stylesheet' type='text/css' href='style.css'>
-  <body onload="document.getElementById('t').removeAttribute('disabled');
-                document.documentElement.className='';">
+  <body>
     <textarea class='notvalid' id='t' disabled></textarea>
   </body>
 </html>
--- a/layout/reftests/css-ui-valid/textarea/textarea-dyn-not-readonly-changed.html
+++ b/layout/reftests/css-ui-valid/textarea/textarea-dyn-not-readonly-changed.html
@@ -1,11 +1,19 @@
 <!DOCTYPE html>
 <html class="reftest-wait">
+  <head>
+    <script>
+      function doTest() {
+        document.getElementById('t').removeAttribute('readonly');
+        document.getElementById('t').value = '';
+        document.documentElement.className='';
+      }
+      document.addEventListener("MozReftestInvalidate", doTest, false);
+    </script>
+  </head>
   <!-- Test: if textarea is no longer readonly and its value has been modified,
              it should be affected by :-moz-ui-valid pseudo-class. -->
   <link rel='stylesheet' type='text/css' href='style.css'>
-  <body onload="document.getElementById('t').removeAttribute('readonly');
-                document.getElementById('t').value = '';
-                document.documentElement.className='';">
+  <body>
     <textarea class='valid' id='t' readonly></textarea>
   </body>
 </html>
--- a/layout/reftests/css-ui-valid/textarea/textarea-dyn-not-readonly.html
+++ b/layout/reftests/css-ui-valid/textarea/textarea-dyn-not-readonly.html
@@ -1,10 +1,18 @@
 <!DOCTYPE html>
 <html class="reftest-wait">
+  <head>
+    <script>
+      function doTest() {
+        document.getElementById('t').removeAttribute('readonly');
+        document.documentElement.className='';
+      }
+      document.addEventListener("MozReftestInvalidate", doTest, false);
+    </script>
+  </head>
   <!-- Test: if textarea is no longer readonly but its value hasn't been modified,
              it should not be affected by :-moz-ui-valid pseudo-class. -->
   <link rel='stylesheet' type='text/css' href='style.css'>
-  <body onload="document.getElementById('t').removeAttribute('readonly');
-                document.documentElement.className='';">
+  <body>
     <textarea class='notvalid' id='t' readonly></textarea>
   </body>
 </html>
--- a/layout/reftests/css-ui-valid/textarea/textarea-dyn-readonly.html
+++ b/layout/reftests/css-ui-valid/textarea/textarea-dyn-readonly.html
@@ -1,9 +1,18 @@
 <!DOCTYPE html>
 <html class="reftest-wait">
+  <head>
+    <script>
+      function doTest() {
+        document.getElementById('t').readOnly='ro';
+        document.documentElement.className='';
+      }
+      document.addEventListener("MozReftestInvalidate", doTest, false);
+    </script>
+  </head>
   <!-- Test: if textarea is readonly, it is barred from constraint validation
              and should not be affected by :-moz-ui-valid pseudo-class. -->
   <link rel='stylesheet' type='text/css' href='style.css'>
-  <body onload="document.getElementById('t').readOnly='ro'; document.documentElement.className='';">
+  <body>
     <textarea class='notvalid' id='t'></textarea>
   </body>
 </html>
--- a/layout/reftests/css-ui-valid/textarea/textarea-maxlength-valid-changed.html
+++ b/layout/reftests/css-ui-valid/textarea/textarea-maxlength-valid-changed.html
@@ -1,11 +1,19 @@
 <!DOCTYPE html>
 <html class='reftest-wait'>
+  <head>
+    <script>
+      function doTest() {
+        document.getElementById('t').value = '';
+        document.documentElement.className='';
+      }
+      document.addEventListener("MozReftestInvalidate", doTest, false);
+    </script>
+  </head>
   <!-- Test: if textarea is valid and its value has been modified,
              it should be affected by :-moz-ui-valid pseudo-class. -->
   <link rel='stylesheet' type='text/css' href='style.css'>
-  <body onload="document.getElementById('t').value = '';
-                document.documentElement.className = '';">
+  <body>
     <textarea id='t' class='valid' maxlength="2"></textarea>
   </body>
 </html>
 
--- a/layout/reftests/css-valid/input/input-customerror.html
+++ b/layout/reftests/css-valid/input/input-customerror.html
@@ -1,9 +1,18 @@
 <!DOCTYPE html>
 <html class="reftest-wait">
+  <head>
+    <script>
+      function doTest() {
+        document.getElementById('t').setCustomValidity('foo');
+        document.documentElement.className='';
+      }
+      document.addEventListener("MozReftestInvalidate", doTest, false);
+    </script>
+  </head>
   <!-- Test: if input has a custom error, it should not be affected by :valid
              pseudo-class. -->
   <link rel='stylesheet' type='text/css' href='style.css'>
-  <body onload="document.getElementById('t').setCustomValidity('foo'); document.documentElement.className='';">
+  <body>
     <input class='notvalid' id='t'>
   </body>
 </html>
--- a/layout/reftests/css-valid/input/input-type-invalid.html
+++ b/layout/reftests/css-valid/input/input-type-invalid.html
@@ -1,19 +1,20 @@
 <!DOCTYPE html>
 <html class="reftest-wait">
   <!-- Test: if an input has a custom error when barred from constraint
              validation then move a type candidate for constraint validation,
              it should not be affected by :valid pseudo-class. -->
   <link rel='stylesheet' type='text/css' href='style.css'>
   <script>
-    function onLoadHandler()
+    function doTest()
     {
       var i = document.getElementById('i');
       i.setCustomValidity('foo');
       i.type = 'text';
       document.documentElement.className='';
     }
+    document.addEventListener("MozReftestInvalidate", doTest, false);
   </script>
-  <body onload="onLoadHandler();">
+  <body>
     <input class='notvalid' type='button' id='i'>
   </body>
 </html>
--- a/layout/reftests/css-valid/input/reftest.list
+++ b/layout/reftests/css-valid/input/reftest.list
@@ -1,10 +1,10 @@
 == input-valid.html input-ref.html
-== input-customerror.html input-ref.html
+fuzzy(64,4) == input-customerror.html input-ref.html
 fails-if(Android) == input-disabled.html input-ref.html
 fails-if(Android) == input-dyn-disabled.html input-ref.html
 == input-dyn-not-disabled.html input-ref.html
 == input-readonly.html input-ref.html
 == input-dyn-readonly.html input-ref.html
 == input-dyn-not-readonly.html input-ref.html
 == input-maxlength-valid.html input-ref.html
 == input-maxlength-invalid.html input-withtext-ref.html
@@ -14,17 +14,17 @@ fails-if(Android) == input-dyn-disabled.
 == input-reset.html input-button-ref.html
 == input-email-invalid.html input-withtext-ref.html
 == input-email-valid.html input-email-ref.html
 == input-url-invalid.html input-withtext-ref.html
 == input-url-valid.html input-url-ref.html
 == input-pattern-valid.html input-withtext-ref.html
 == input-pattern-invalid.html input-withtext-ref.html
 == input-type-barred.html input-button-ref.html
-== input-type-invalid.html input-ref.html
+fuzzy(64,4) == input-type-invalid.html input-ref.html
 == input-disabled-fieldset-1.html input-fieldset-ref.html
 == input-disabled-fieldset-2.html input-fieldset-ref.html
 == input-fieldset-legend.html input-fieldset-legend-ref.html
 == input-radio-required.html success-ref.html
 == input-radio-customerror.html success-ref.html
 == input-radio-dyn-valid-1.html success-ref.html
 == input-radio-dyn-valid-2.html success-ref.html
 == input-radio-nogroup-required-valid.html success-ref.html
--- a/layout/reftests/css-valid/textarea/reftest.list
+++ b/layout/reftests/css-valid/textarea/reftest.list
@@ -1,15 +1,15 @@
 == textarea-valid.html textarea-ref.html
-== textarea-customerror.html textarea-ref.html
+fuzzy(11,4) == textarea-customerror.html textarea-ref.html
 fails-if(Android) == textarea-disabled.html textarea-ref.html
-fails-if(Android) == textarea-dyn-disabled.html textarea-ref.html
-== textarea-dyn-not-disabled.html textarea-ref.html
+fuzzy(11,4) fails-if(Android) == textarea-dyn-disabled.html textarea-ref.html
+fuzzy(11,4) == textarea-dyn-not-disabled.html textarea-ref.html
 == textarea-readonly.html textarea-ref.html
-== textarea-dyn-readonly.html textarea-ref.html
-== textarea-dyn-not-readonly.html textarea-ref.html
+fuzzy(11,4) == textarea-dyn-readonly.html textarea-ref.html
+fuzzy(11,4) == textarea-dyn-not-readonly.html textarea-ref.html
 == textarea-maxlength-valid.html textarea-ref.html
 == textarea-maxlength-invalid.html textarea-withtext-ref.html
 == textarea-required-valid.html textarea-withtext-ref.html
 == textarea-required-invalid.html textarea-ref.html
 == textarea-disabled-fieldset-1.html textarea-fieldset-ref.html
 == textarea-disabled-fieldset-2.html textarea-fieldset-ref.html
 == textarea-fieldset-legend.html textarea-fieldset-legend-ref.html
--- a/layout/reftests/css-valid/textarea/textarea-customerror.html
+++ b/layout/reftests/css-valid/textarea/textarea-customerror.html
@@ -1,9 +1,18 @@
 <!DOCTYPE html>
 <html class="reftest-wait">
+  <head>
+    <script>
+      function doTest() {
+        document.getElementById('t').setCustomValidity('foo');
+        document.documentElement.className='';
+      }
+      document.addEventListener("MozReftestInvalidate", doTest, false);
+    </script>
+  </head>
   <!-- Test: if textarea has a custom error, it should not be affected by :valid
              pseudo-class. -->
   <link rel='stylesheet' type='text/css' href='style.css'>
-  <body onload="document.getElementById('t').setCustomValidity('foo'); document.documentElement.className='';">
+  <body>
     <textarea class='notvalid' id='t'></textarea>
   </body>
 </html>
--- a/layout/reftests/css-valid/textarea/textarea-dyn-disabled.html
+++ b/layout/reftests/css-valid/textarea/textarea-dyn-disabled.html
@@ -1,9 +1,18 @@
 <!DOCTYPE html>
 <html class="reftest-wait">
+  <head>
+    <script>
+      function doTest() {
+        document.getElementById('t').disabled='true';
+        document.documentElement.className='';
+      }
+      document.addEventListener("MozReftestInvalidate", doTest, false);
+    </script>
+  </head>
   <!-- Test: if textarea is disabled, it is barred from constraint validation
              and should not be affected by :valid pseudo-class. -->
   <link rel='stylesheet' type='text/css' href='style.css'>
-  <body onload="document.getElementById('t').disabled='true'; document.documentElement.className='';">
+  <body>
     <textarea class='notvalid' id='t'></textarea>
   </body>
 </html>
--- a/layout/reftests/css-valid/textarea/textarea-dyn-not-disabled.html
+++ b/layout/reftests/css-valid/textarea/textarea-dyn-not-disabled.html
@@ -1,9 +1,18 @@
 <!DOCTYPE html>
 <html class="reftest-wait">
+  <head>
+    <script>
+      function doTest() {
+        document.getElementById('t').removeAttribute('disabled');
+        document.documentElement.className='';
+      }
+      document.addEventListener("MozReftestInvalidate", doTest, false);
+    </script>
+  </head>
   <!-- Test: if textarea is not disabled, it is candidate for constraint validation
              and should be affected by :valid pseudo-class. -->
   <link rel='stylesheet' type='text/css' href='style.css'>
-  <body onload="document.getElementById('t').removeAttribute('disabled'); document.documentElement.className='';">
+  <body>
     <textarea class='valid' id='t' disabled></textarea>
   </body>
 </html>
--- a/layout/reftests/css-valid/textarea/textarea-dyn-not-readonly.html
+++ b/layout/reftests/css-valid/textarea/textarea-dyn-not-readonly.html
@@ -1,9 +1,18 @@
 <!DOCTYPE html>
 <html class="reftest-wait">
+  <head>
+    <script>
+      function doTest() {
+        document.getElementById('t').removeAttribute('readonly');
+        document.documentElement.className='';
+      }
+      document.addEventListener("MozReftestInvalidate", doTest, false);
+    </script>
+  </head>
   <!-- Test: if textarea is no longer readonly, it is candidate for constraint
              validation and should be affected by :valid pseudo-class. -->
   <link rel='stylesheet' type='text/css' href='style.css'>
-  <body onload="document.getElementById('t').removeAttribute('readonly'); document.documentElement.className='';">
+  <body>
     <textarea class='valid' id='t' readonly></textarea>
   </body>
 </html>
--- a/layout/reftests/css-valid/textarea/textarea-dyn-readonly.html
+++ b/layout/reftests/css-valid/textarea/textarea-dyn-readonly.html
@@ -1,9 +1,18 @@
 <!DOCTYPE html>
 <html class="reftest-wait">
+  <head>
+    <script>
+      function doTest() {
+        document.getElementById('t').readOnly='ro';
+        document.documentElement.className='';
+      }
+      document.addEventListener("MozReftestInvalidate", doTest, false);
+    </script>
+  </head>
   <!-- Test: if textarea is readonly, it is barred from constraint validation
              and should not be affected by :valid pseudo-class. -->
   <link rel='stylesheet' type='text/css' href='style.css'>
-  <body onload="document.getElementById('t').readOnly='ro'; document.documentElement.className='';">
+  <body>
     <textarea class='notvalid' id='t'></textarea>
   </body>
 </html>