<html>
    <head>
      <base href="https://bugs.webkit.org/" />
    </head>
    <body><table border="1" cellspacing="0" cellpadding="8">
        <tr>
          <th>Bug ID</th>
          <td><a class="bz_bug_link 
          bz_status_NEW "
   title="NEW - [Font Loading] The callback passed to document.fonts.ready should always be called"
   href="https://bugs.webkit.org/show_bug.cgi?id=158884">158884</a>
          </td>
        </tr>

        <tr>
          <th>Summary</th>
          <td>[Font Loading] The callback passed to document.fonts.ready should always be called
          </td>
        </tr>

        <tr>
          <th>Classification</th>
          <td>Unclassified
          </td>
        </tr>

        <tr>
          <th>Product</th>
          <td>WebKit
          </td>
        </tr>

        <tr>
          <th>Version</th>
          <td>WebKit Nightly Build
          </td>
        </tr>

        <tr>
          <th>Hardware</th>
          <td>All
          </td>
        </tr>

        <tr>
          <th>OS</th>
          <td>All
          </td>
        </tr>

        <tr>
          <th>Status</th>
          <td>NEW
          </td>
        </tr>

        <tr>
          <th>Severity</th>
          <td>Normal
          </td>
        </tr>

        <tr>
          <th>Priority</th>
          <td>P2
          </td>
        </tr>

        <tr>
          <th>Component</th>
          <td>Text
          </td>
        </tr>

        <tr>
          <th>Assignee</th>
          <td>webkit-unassigned&#64;lists.webkit.org
          </td>
        </tr>

        <tr>
          <th>Reporter</th>
          <td>fred.wang&#64;free.fr
          </td>
        </tr>

        <tr>
          <th>CC</th>
          <td>alex&#64;igalia.com, mmaxfield&#64;apple.com
          </td>
        </tr>

        <tr>
          <th>Blocks</th>
          <td>133567, 133845, 155638, 155639, 155714, 153742, 153918
          </td>
        </tr></table>
      <p>
        <div>
        <pre>Created <span class=""><a href="attachment.cgi?id=281583" name="attach_281583" title="testcase">attachment 281583</a> <a href="attachment.cgi?id=281583&amp;action=edit" title="testcase">[details]</a></span>
testcase

Per the CSS Font Loading working draft (<a href="https://drafts.csswg.org/css-font-loading/#font-face-set-ready">https://drafts.csswg.org/css-font-loading/#font-face-set-ready</a>):

&quot;This is similar to listening for a loadingdone event to fire, but the callbacks passed to the ready promise will always get called, even when no font loads occur because the fonts in question are already loaded.&quot;

It seems that contrary to Chrome or Firefox, WebKit does not always call that callback, as shown by the simple attached testcase.

----

More context: we are extending the support for OpenType MATH table during the MathML refactoring and we are importing tests from <a href="http://tests.mathml-association.org/">http://tests.mathml-association.org/</a> that use custom web fonts to check all these OpenType features. These tests wait for the page load (so that the font loading requests will have started or even be done) and possibly wait again for the web font loading to complete as follows:

window.addEventListener(&quot;load&quot;, function() {
   document.fonts.ready.then(runTests);
});

This works in Gecko but not in WebKit. I tried calling document.fonts.ready before (e.g. at &quot;DOMContentLoaded&quot; or immediately) which may give better result in WebKit although it still does not always work and sometimes it's causing random failures on Gecko too. I suspect that the problem is the following: If the fonts loading request has not started then Gecko will call runTests immediately (per the spec) and so too early while if the fonts loading request is complete then WebKit will never call runTests (per the present bug) ; so one has to call document.fonts.ready.then exactly while the web fonts are loading (which is not easy since these web fonts are loaded via standard CSS rules rather than with Javascript).

I'm making this bug blocking some other MathML bugs, although for now it is still possible to tweak the tests with some setTimeOut or similar hacks.</pre>
        </div>
      </p>
      <hr>
      <span>You are receiving this mail because:</span>
      
      <ul>
          <li>You are the assignee for the bug.</li>
      </ul>
    </body>
</html>