Bug 768766 - Make css-valid tests use MozReftestInvalidate and mark them as fuzzy. r=roc
authorMatt Woodrow <mwoodrow@mozilla.com>
Sat, 30 Jun 2012 15:06:13 +1200
changeset 98028 d14ec506f28f79cbf3b68578e814db1f1fbd2add
parent 98027 f7599b247eef46459e794f3a9661dec6fbbf7acc
child 98029 17cc480ae05def906c27d504aa50824aa22bafd5
push id23017
push userryanvm@gmail.com
push dateSat, 30 Jun 2012 19:29:24 +0000
treeherdermozilla-central@4c2ddc60f360 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersroc
bugs768766
milestone16.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>