javascript - クロスブラウザー Web フォントの読み込みイベント

Question

Web フォントから特定の文字の幅を測定しようとしています。Google のWebfont Loaderによって提供されるアクティブなイベントは、デフォルト フォントで行われた測定と、少し早すぎます。

私が使用しているスクリプトの簡素化されたバージョン:

window.WebFontConfig = {
    google: {
        families: ['Anonymous Pro:400,400italic,700,700italic']
    },

    active: function () {
        $.fn.ready(MeasureM);
    }
};

function MeasureM() {
    var e = document.getElementById('div');
    e.style.font = "15px/15px 'Anonymous Pro'";
    e.appendChild(document.createTextNode('M'));
    console.log(e.offsetWidth, e.offsetHeight);
}

(function () {
    var wf = document.createElement('script');
    wf.src = ('https:' == document.location.protocol ? 'https' : 'http') +
        '://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js';
    wf.type = 'text/javascript';
    wf.async = 'true';
    var s = document.getElementsByTagName('script')[0];
    s.parentNode.insertBefore(wf, s);
})();

HTML 要素:

<div id="div" style="display: table;"></div>

便宜上、jsFiddle .

この問題は Firefox でのみ発生しているように見えますが、解決策はありますか? または、私が誤解していることはありますか？