Make reftests wait for fonts to load over WebDriver

tools/wptrunner/wptrunner/executors/executormarionette.py

@@ -491,7 +491,7 @@ def __init__(self, browser, server_config, timeout_multiplier=1,
 
         with open(os.path.join(here, "reftest.js")) as f:
             self.script = f.read()
-        with open(os.path.join(here, "reftest-wait.js")) as f:
+        with open(os.path.join(here, "reftest-wait_marionette.js")) as f:
             self.wait_script = f.read()
 
     def setup(self, runner):

tools/wptrunner/wptrunner/executors/executorservodriver.py

@@ -211,7 +211,7 @@ def __init__(self, browser, server_config, timeout_multiplier=1,
                                                capabilities=capabilities)
         self.implementation = RefTestImplementation(self)
         self.timeout = None
-        with open(os.path.join(here, "reftest-wait_servodriver.js")) as f:
+        with open(os.path.join(here, "reftest-wait_webdriver.js")) as f:
             self.wait_script = f.read()
 
     def is_alive(self):

tools/wptrunner/wptrunner/executors/reftest-wait_webdriver.js

@@ -1,33 +1,44 @@
 var callback = arguments[arguments.length - 1];
 
-function test(x) {
+function root_wait() {
   if (!root.classList.contains("reftest-wait")) {
     observer.disconnect();
 
-    // As of 2017-04-05, the Chromium web browser exhibits a rendering bug
-    // (https://bugs.chromium.org/p/chromium/issues/detail?id=708757) that
-    // produces instability during screen capture. The following use of
-    // `requestAnimationFrame` is intended as a short-term workaround, though
-    // it is not guaranteed to resolve the issue.
-    //
-    // For further detail, see:
-    // https://github.com/jugglinmike/chrome-screenshot-race/issues/1
+    if (Document.prototype.hasOwnProperty("fonts")) {
+      document.fonts.ready.then(ready_for_screenshot);
+    } else {
+      // This might take the screenshot too early, depending on whether the
+      // load event is blocked on fonts being loaded. See:
+      // https://github.com/w3c/csswg-drafts/issues/1088
+      ready_for_screenshot();
+    }
+  }
+}
 
+function ready_for_screenshot() {
+  // As of 2017-04-05, the Chromium web browser exhibits a rendering bug
+  // (https://bugs.chromium.org/p/chromium/issues/detail?id=708757) that
+  // produces instability during screen capture. The following use of
+  // `requestAnimationFrame` is intended as a short-term workaround, though
+  // it is not guaranteed to resolve the issue.
+  //
+  // For further detail, see:
+  // https://github.com/jugglinmike/chrome-screenshot-race/issues/1
+
+  requestAnimationFrame(function() {
     requestAnimationFrame(function() {
-      requestAnimationFrame(function() {
-        callback();
-      });
+      callback();
     });
-  }
+  });
 }
 
 var root = document.documentElement;
-var observer = new MutationObserver(test);
+var observer = new MutationObserver(root_wait);
 
 observer.observe(root, {attributes: true});
 
 if (document.readyState != "complete") {
-    onload = test;
+    onload = root_wait;
 } else {
-    test();
+    root_wait();
 }