Attempt to deflake svg/custom/js-late-{clipPath,gradient}-and-...svg

LayoutTests/svg/custom/js-late-gradient-and-object-creation.svg

 <?xml version="1.0" encoding="UTF-8"?>
 <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1 Basic//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11-basic.dtd">  
 <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"  id="svg-root" width="100%" height="100%" viewBox="0 0 480 360" onload="runRepaintAndPixelTest()">
 <script xlink:href="../../fast/repaint/resources/text-based-repaint.js"/>
 <g id="content"/>
 
 <script>
-    var content = document.getElementById("content");
+    window.testIsAsync = true;
 
     function repaintTest() {
-        if (window.testRunner)
-            testRunner.waitUntilDone();
-        setTimeout(createGradients, 0);
+        runAfterDisplay(createGradients);
     }
 
+    var content = document.getElementById("content");
+
     function createGradients()
     {
         // Setup "fillLinearGradient"
         var gradient1 = document.createElementNS("http://www.w3.org/2000/svg", "linearGradient");
         gradient1.setAttribute("id", "fillLinearGradient");
         gradient1.setAttribute("x1", "0");
         gradient1.setAttribute("x2", "1");
 
         var stop11 = document.createElementNS("http://www.w3.org/2000/svg", "stop");
         stop11.setAttribute("stop-color", "blue");
@@ skipping 19 matching lines @@
         stop22.setAttribute("offset", "0");
 
         var stop22 = document.createElementNS("http://www.w3.org/2000/svg", "stop");
         stop22.setAttribute("stop-color", "green");
         stop22.setAttribute("offset", "1");
 
         gradient2.appendChild(stop22);
         gradient2.appendChild(stop22);
 
         content.appendChild(gradient2);
-        setTimeout(setupGradientUsers, 0);
+
+        runAfterDisplay(setupGradientUsers);
     }
 
     function setupGradientUsers()
     {
         var text1 = document.createElementNS("http://www.w3.org/2000/svg", "text");
         text1.setAttribute("font-size", "68");
         text1.setAttribute("x", "-150");
         text1.setAttribute("y", "70")
         text1.setAttribute("fill", "url(#fillLinearGradient)");
         text1.setAttribute("stroke", "none");
@@ skipping 14 matching lines @@
         var text3 = document.createElementNS("http://www.w3.org/2000/svg", "text");
         text3.setAttribute("font-size", "68");
         text3.setAttribute("x", "-150");
         text3.setAttribute("y", "210")
         text3.setAttribute("fill", "url(#fillLinearGradient)");    
         text3.setAttribute("stroke", "url(#strokeLinearGradient)");
         text3.appendChild(document.createTextNode("Gradient on fill/stroke"));
 
         content.appendChild(text3);
 
-        if (window.testRunner)
-            testRunner.notifyDone();
+        finishRepaintTest();
     }
 </script>
 
 </svg>