webfontloader 1.3.0 → 1.3.1

data/CHANGELOG

@@ -1,3 +1,8 @@
+v1.3.1 (March 14, 2013)
+* Change code to use explicit dependencies
+* Fix unit tests in older browsers
+* Fix google/FontApiParser.js to work in IE <= 8
+
 v1.3.0 (February 28, 2013)
 * New optional configuration parameter `timeout` which lets you customize the default timeout.
 * Change the Typekit module to use `use.typekit.net` instead of `use.typekit.com`.

data/Rakefile

@@ -92,6 +92,7 @@ file "target/webfont.js" => SourceJs + ["target"] do |t|
     ["-jar", JsCompilerJar],
     ["--compilation_level", "ADVANCED_OPTIMIZATIONS"],
     ["--js_output_file", t.name],
+    "--generate_exports",
     ["--output_wrapper", %("#{output_wrapper}")],
     ["--warning_level", "VERBOSE"],
     ["--summary_detail_level", "3"]
@@ -107,7 +108,7 @@ file "target/webfont.js" => SourceJs + ["target"] do |t|
   args.concat source.map { |f| ["--js", f] }
 
   output = `java #{args.flatten.join(' ')} 2>&1`
-  fail output unless output.empty?
+  $?.success? ? (puts output) : (fail output)
 end
 
 desc "Creates debug version into target/webfont.js"

data/lib/webfontloader.rb

@@ -3,7 +3,7 @@ require 'yaml'
 require 'webfontloader/modules'
 
 module WebFontLoader
-  VERSION = '1.3.0'
+  VERSION = '1.3.1'
 
   ProjectRoot = File.expand_path(File.dirname(__FILE__) + "/..")
 

data/spec/core/font_spec.js

@@ -16,7 +16,7 @@ describe('WebFont', function () {
         testModule = null;
 
     beforeEach(function () {
-      font = new WebFont(window, fontModuleLoader, function (func, timeout) { func(); }, userAgent);
+      font = new WebFont(window, fontModuleLoader, userAgent);
       font.addModule('test', function (conf, domHelper) {
         testModule = new function () {
           this.conf = conf;
@@ -80,7 +80,7 @@ describe('WebFont', function () {
         fakeMainWindow = {};
 
     beforeEach(function () {
-      font = new WebFont(fakeMainWindow, fontModuleLoader, function (func, timeout) { func(); }, userAgent);
+      font = new WebFont(fakeMainWindow, fontModuleLoader, userAgent);
       font.addModule('test', function (conf, domHelper) {
         testModule = new function () {
           this.domHelper = domHelper;
@@ -117,7 +117,8 @@ describe('WebFont', function () {
         active = jasmine.createSpy('active');
 
     beforeEach(function () {
-      font = new WebFont(window, fontModuleLoader, function (func, timeout) { func(); }, new UserAgent('Firefox', '3.6', 'Gecko', '1.9.2', 'Macintosh', '10.6', undefined, new BrowserInfo(true, false)));
+      jasmine.Clock.useMock();
+      font = new WebFont(window, fontModuleLoader, new UserAgent('Firefox', '3.6', 'Gecko', '1.9.2', 'Macintosh', '10.6', undefined, new BrowserInfo(true, false)));
       font.addModule('test', function (conf, domHelper) {
         testModule = new function () {
           this.conf = conf;
@@ -168,6 +169,8 @@ describe('WebFont', function () {
         active: active
       });
 
+      jasmine.Clock.tick(1);
+
       expect(testModule).not.toBeNull();
       expect(active).toHaveBeenCalled();
     });
@@ -180,6 +183,8 @@ describe('WebFont', function () {
         active: active
       });
 
+      jasmine.Clock.tick(1);
+
       expect(testModule).not.toBeNull();
       expect(inactive).toHaveBeenCalled();
     });
@@ -190,7 +195,7 @@ describe('WebFont', function () {
         testModule = null;
 
     beforeEach(function () {
-      font = new WebFont(window, fontModuleLoader, function (func, timeout) { func(); }, new UserAgent('Firefox', '3.6', 'Gecko', '1.9.2', 'Macintosh', '10.6', undefined, new BrowserInfo(false, false, false)));
+      font = new WebFont(window, fontModuleLoader, new UserAgent('Firefox', '3.6', 'Gecko', '1.9.2', 'Macintosh', '10.6', undefined, new BrowserInfo(false, false, false)));
       font.addModule('test', function (conf, domHelper) {
         testModule = new function () {
           this.conf = conf;

data/spec/core/fontruler_spec.js

@@ -2,22 +2,15 @@ describe('FontRuler', function () {
   var FontRuler = webfont.FontRuler,
       DomHelper = webfont.DomHelper,
       Size = webfont.Size,
-      domHelper = null,
-      fontSizer = null;
+      domHelper = null;
 
   beforeEach(function () {
     domHelper = new DomHelper(window);
-
-    fontSizer = {
-      getSize: function (el) {
-        return new Size(el.offsetWidth, el.offsetHeight);
-      }
-    };
   });
 
   it('should prevent a long test string from word wrapping', function () {
-    var fontRulerA = new FontRuler(domHelper, fontSizer, 'abc'),
-        fontRulerB = new FontRuler(domHelper, fontSizer, 'Hello World, this should wrap!');
+    var fontRulerA = new FontRuler(domHelper, 'abc'),
+        fontRulerB = new FontRuler(domHelper, 'Hello World, this should wrap!');
 
     fontRulerA.insert();
     fontRulerB.insert();

data/spec/core/fontwatcher_spec.js

@@ -23,8 +23,8 @@ describe('FontWatcher', function () {
     eventDispatcher.dispatchInactive = jasmine.createSpy('dispatchInactive');
   });
 
-  function FakeFontWatchRunner(activeCallback, inactiveCallback, domHelper, fontSizer, asyncCall, getTime,
-    fontFamily, fontDescription, hasWebKitFallbackBug, opt_timeout, opt_metricCompatibleFonts, opt_fontTestString) {
+  function FakeFontWatchRunner(activeCallback, inactiveCallback, domHelper,
+    fontFamily, fontDescription, browserInfo, opt_timeout, opt_metricCompatibleFonts, opt_fontTestString) {
     this.activeCallback = activeCallback;
     this.inactiveCallback = inactiveCallback;
     this.fontFamily = fontFamily;
@@ -37,7 +37,16 @@ describe('FontWatcher', function () {
   }
 
   FakeFontWatchRunner.prototype.start = function () {
-    if (activeFontFamilies.indexOf(this.fontFamily) > -1) {
+    var found = false;
+
+    for (var i = 0; i < activeFontFamilies.length; i += 1) {
+      if (activeFontFamilies[i] === this.fontFamily) {
+        found = true;
+        break;
+      }
+    }
+
+    if (found) {
       this.activeCallback(this.fontFamily, this.fontDescription);
     } else {
       this.inactiveCallback(this.fontFamily, this.fontDescription);
@@ -47,8 +56,7 @@ describe('FontWatcher', function () {
   describe('watch zero fonts', function () {
     it('should call inactive when there are no fonts to load', function () {
       activeFontFamilies = [];
-      var fontWatcher = new FontWatcher(userAgent, domHelper, eventDispatcher, jasmine.createSpy('fakeFontSizer'),
-          jasmine.createSpy('fakeAsyncCall'), jasmine.createSpy('fakeGetTime'));
+      var fontWatcher = new FontWatcher(userAgent, domHelper, eventDispatcher);
 
       fontWatcher.watch([], {}, {}, FakeFontWatchRunner, true);
       expect(eventDispatcher.dispatchInactive).toHaveBeenCalled();
@@ -58,8 +66,7 @@ describe('FontWatcher', function () {
   describe('watch one font not last', function () {
     it('should not call font inactive, inactive or active', function () {
       activeFontFamilies = ['fontFamily1'];
-      var fontWatcher = new FontWatcher(userAgent, domHelper, eventDispatcher, jasmine.createSpy('fakeFontSizer'),
-          jasmine.createSpy('fakeAsyncCall'), jasmine.createSpy('fakeGetTime'));
+      var fontWatcher = new FontWatcher(userAgent, domHelper, eventDispatcher);
 
       fontWatcher.watch(['fontFamily1'], {}, {}, FakeFontWatchRunner, false);
       expect(eventDispatcher.dispatchFontInactive).not.toHaveBeenCalled();
@@ -71,8 +78,7 @@ describe('FontWatcher', function () {
   describe('watch one font active', function () {
     it('should call font active and active', function () {
       activeFontFamilies = ['fontFamily1'];
-      var fontWatcher = new FontWatcher(userAgent, domHelper, eventDispatcher, jasmine.createSpy('fakeFontSizer'),
-          jasmine.createSpy('fakeAsyncCall'), jasmine.createSpy('fakeGetTime'));
+      var fontWatcher = new FontWatcher(userAgent, domHelper, eventDispatcher);
 
       fontWatcher.watch(['fontFamily1'], {}, {}, FakeFontWatchRunner, true);
       expect(eventDispatcher.dispatchFontLoading).toHaveBeenCalledWith('fontFamily1', 'n4');
@@ -86,8 +92,7 @@ describe('FontWatcher', function () {
   describe('watch one font inactive', function () {
     it('should call inactive', function () {
       activeFontFamilies = [];
-      var fontWatcher = new FontWatcher(userAgent, domHelper, eventDispatcher, jasmine.createSpy('fakeFontSizer'),
-          jasmine.createSpy('fakeAsyncCall'), jasmine.createSpy('fakeGetTime'));
+      var fontWatcher = new FontWatcher(userAgent, domHelper, eventDispatcher);
 
       fontWatcher.watch(['fontFamily1'], {}, {}, FakeFontWatchRunner, true);
       expect(eventDispatcher.dispatchFontLoading).toHaveBeenCalledWith('fontFamily1', 'n4');
@@ -101,8 +106,7 @@ describe('FontWatcher', function () {
   describe('watch multiple fonts active', function () {
     it('should call font active and active', function () {
       activeFontFamilies = ['fontFamily1', 'fontFamily2', 'fontFamily3'];
-      var fontWatcher = new FontWatcher(userAgent, domHelper, eventDispatcher, jasmine.createSpy('fakeFontSizer'),
-          jasmine.createSpy('fakeAsyncCall'), jasmine.createSpy('fakeGetTime'));
+      var fontWatcher = new FontWatcher(userAgent, domHelper, eventDispatcher);
 
       fontWatcher.watch(['fontFamily1', 'fontFamily2', 'fontFamily3'], {}, {}, FakeFontWatchRunner, true);
       expect(eventDispatcher.dispatchFontLoading).toHaveBeenCalledWith('fontFamily1', 'n4');
@@ -116,8 +120,7 @@ describe('FontWatcher', function () {
   describe('watch multiple fonts inactive', function () {
     it('should call inactive', function () {
       activeFontFamilies = [];
-      var fontWatcher = new FontWatcher(userAgent, domHelper, eventDispatcher, jasmine.createSpy('fakeFontSizer'),
-          jasmine.createSpy('fakeAsyncCall'), jasmine.createSpy('fakeGetTime'));
+      var fontWatcher = new FontWatcher(userAgent, domHelper, eventDispatcher);
 
       fontWatcher.watch(['fontFamily1', 'fontFamily2', 'fontFamily3'], {}, {}, FakeFontWatchRunner, true);
       expect(eventDispatcher.dispatchFontLoading).toHaveBeenCalledWith('fontFamily1', 'n4');
@@ -131,8 +134,7 @@ describe('FontWatcher', function () {
   describe('watch multiple fonts mixed', function () {
     it('should call the correct callbacks', function () {
       activeFontFamilies = ['fontFamily1', 'fontFamily3'];
-      var fontWatcher = new FontWatcher(userAgent, domHelper, eventDispatcher, jasmine.createSpy('fakeFontSizer'),
-          jasmine.createSpy('fakeAsyncCall'), jasmine.createSpy('fakeGetTime'));
+      var fontWatcher = new FontWatcher(userAgent, domHelper, eventDispatcher);
 
       fontWatcher.watch(['fontFamily1', 'fontFamily2', 'fontFamily3'], {}, {}, FakeFontWatchRunner, true);
       expect(eventDispatcher.dispatchFontLoading.callCount).toEqual(3);
@@ -155,8 +157,7 @@ describe('FontWatcher', function () {
   describe('watch multiple fonts with descriptions', function () {
     it('should call the correct callbacks', function () {
       activeFontFamilies = ['fontFamily1', 'fontFamily2'];
-      var fontWatcher = new FontWatcher(userAgent, domHelper, eventDispatcher, jasmine.createSpy('fakeFontSizer'),
-          jasmine.createSpy('fakeAsyncCall'), jasmine.createSpy('fakeGetTime'));
+      var fontWatcher = new FontWatcher(userAgent, domHelper, eventDispatcher);
 
       fontWatcher.watch(['fontFamily1', 'fontFamily2', 'fontFamily3'], {
         'fontFamily1': ['i7'],
@@ -189,8 +190,7 @@ describe('FontWatcher', function () {
     it('should use the correct tests strings', function () {
       activeFontFamilies = ['fontFamily1', 'fontFamily2'];
 
-      var fontWatcher = new FontWatcher(userAgent, domHelper, eventDispatcher, jasmine.createSpy('fakeFontSizer'),
-          jasmine.createSpy('fakeAsyncCall'), jasmine.createSpy('fakeGetTime'));
+      var fontWatcher = new FontWatcher(userAgent, domHelper, eventDispatcher);
 
       fontWatcher.watch(['fontFamily1', 'fontFamily2', 'fontFamily3', 'fontFamily4'], {}, {
         'fontFamily1': 'testString1',
@@ -206,8 +206,7 @@ describe('FontWatcher', function () {
   });
 
   it('should pass on the timeout to FontWatchRunner', function () {
-    var fontWatcher = new FontWatcher(userAgent, domHelper, eventDispatcher, jasmine.createSpy('fakeFontSizer'),
-        jasmine.createSpy('fakeAsyncCall'), jasmine.createSpy('fakeGetTime'), 4000);
+    var fontWatcher = new FontWatcher(userAgent, domHelper, eventDispatcher, 4000);
 
     fontWatcher.watch(['fontFamily1'], {}, {}, FakeFontWatchRunner, true);
 

data/spec/core/fontwatchrunner_spec.js

@@ -4,273 +4,286 @@ describe('FontWatchRunner', function () {
       UserAgentParser = webfont.UserAgentParser,
       Size = webfont.Size,
       DomHelper = webfont.DomHelper,
-      FontRuler = webfont.FontRuler,
-      domHelper = new DomHelper(window),
-      fontFamily = 'My Family',
-      fontDescription = 'n4';
-
-  var timesToCheckSizeBeforeChange = 0,
-      TARGET_SIZE = new Size(3, 3),
-      FALLBACK_SIZE_A = new Size(1, 1),
-      FALLBACK_SIZE_B = new Size(2, 2),
-      LAST_RESORT_SIZE = new Size(4, 4),
-
-      browserInfo = new BrowserInfo(true, false, false),
-      setupSizes = [FALLBACK_SIZE_A, FALLBACK_SIZE_B, LAST_RESORT_SIZE],
-      actualSizes = [],
-      fakeGetSizeCount = 0,
-      setupFinished = false,
-      fakeFontSizer = {
-        getSize: function (el) {
-          var result = null;
-
-          if (setupFinished) {
-            // If you are getting an exception here your tests does not specify enough
-            // size data to run properly.
-            if (fakeGetSizeCount >= actualSizes.length) {
-              throw 'Invalid test data';
-            }
-            result = actualSizes[fakeGetSizeCount];
-            fakeGetSizeCount += 1;
-          } else {
-            result = setupSizes[Math.min(fakeGetSizeCount, setupSizes.length - 1)];
-            fakeGetSizeCount += 1;
-          }
-          return result;
-        }
-      },
-      timesToGetTimeBeforeTimeout = 10,
-      fakeGetTime = function () {
-        if (timesToGetTimeBeforeTimeout <= 0) {
-          return 6000;
-        } else {
-          timesToGetTimeBeforeTimeout -= 1;
-          return 1;
-        }
-      },
-      asyncCount = 0,
-      fakeAsyncCall = function (func, timeout) {
-        asyncCount += 1;
-        func();
-      },
-      setupFinished = false,
-      originalStartMethod = null,
+      FontRuler = webfont.FontRuler;
+
+  var domHelper = null,
       activeCallback = null,
       inactiveCallback = null;
 
   beforeEach(function () {
-    actualSizes = [];
-    setupFinished = false;
-    fakeGetSizeCount = 0;
+    domHelper = new DomHelper(window);
 
-    asyncCount = 0;
-    timesToGetTimeBeforeTimeout = 10;
     activeCallback = jasmine.createSpy('activeCallback');
     inactiveCallback = jasmine.createSpy('inactiveCallback');
-
-    originalStartMethod = FontWatchRunner.prototype.start;
-
-    FontWatchRunner.prototype.start = function () {
-      setupFinished = true;
-      fakeGetSizeCount = 0;
-      originalStartMethod.apply(this);
-    };
-  });
-
-  afterEach(function () {
-    FontWatchRunner.prototype.start = originalStartMethod;
   });
 
-  it('should call active if fonts are already loaded', function () {
-    actualSizes = [
-      TARGET_SIZE, TARGET_SIZE
-    ];
+  describe('Fake browser', function () {
+    var fontFamily =  'My Family',
+        fontDescription = 'n4',
+        TARGET_SIZE = new Size(3, 3),
+        FALLBACK_SIZE_A = new Size(1, 1),
+        FALLBACK_SIZE_B = new Size(2, 2),
+        LAST_RESORT_SIZE = new Size(4, 4),
 
-    var fontWatchRunner = new FontWatchRunner(activeCallback, inactiveCallback,
-        domHelper, fakeFontSizer, fakeAsyncCall, fakeGetTime, fontFamily, fontDescription, browserInfo);
+        browserInfo = new BrowserInfo(true, false, false),
+        fallbackBugBrowserInfo = new BrowserInfo(true, true, false),
+        setupSizes = [],
+        actualSizes = [],
+        timesToGetTimeBeforeTimeout = 10;
 
-    fontWatchRunner.start();
-
-    expect(asyncCount).toEqual(0);
-    expect(activeCallback).toHaveBeenCalledWith('My Family', 'n4');
-  });
+    beforeEach(function () {
+      jasmine.Clock.useMock();
 
-  it('should wait for font load and call active', function () {
-    actualSizes = [
-      FALLBACK_SIZE_A, FALLBACK_SIZE_B,
-      FALLBACK_SIZE_A, FALLBACK_SIZE_B,
-      FALLBACK_SIZE_A, FALLBACK_SIZE_B,
-      TARGET_SIZE, TARGET_SIZE
-    ];
+      setupSizes = [FALLBACK_SIZE_A, FALLBACK_SIZE_B, LAST_RESORT_SIZE];
 
-    var fontWatchRunner = new FontWatchRunner(activeCallback, inactiveCallback,
-        domHelper, fakeFontSizer, fakeAsyncCall, fakeGetTime, fontFamily, fontDescription, browserInfo);
+      actualSizes = [];
 
-    fontWatchRunner.start();
-    expect(asyncCount).toEqual(3);
-    expect(activeCallback).toHaveBeenCalledWith('My Family', 'n4');
-  });
+      var setupFinished = false,
+          fakeGetSizeCount = 0;
 
-  it('should wait for font inactive and call inactive', function () {
-    timesToGetTimeBeforeTimeout = 5;
-
-    actualSizes = [
-      FALLBACK_SIZE_A, FALLBACK_SIZE_B,
-      FALLBACK_SIZE_A, FALLBACK_SIZE_B,
-      FALLBACK_SIZE_A, FALLBACK_SIZE_B,
-      FALLBACK_SIZE_A, FALLBACK_SIZE_B,
-      FALLBACK_SIZE_A, FALLBACK_SIZE_B
-    ];
+      spyOn(FontRuler.prototype, 'getSize').andCallFake(function () {
+        var result = null;
+        if (setupFinished) {
+          // If you are getting an exception here your tests does not specify enough
+          // size data to run properly.
+          if (fakeGetSizeCount >= actualSizes.length) {
+            throw 'Invalid test data';
+          }
+          result = actualSizes[fakeGetSizeCount];
+          fakeGetSizeCount += 1;
+        } else {
+          result = setupSizes[Math.min(fakeGetSizeCount, setupSizes.length - 1)];
+          fakeGetSizeCount += 1;
+        }
+        return result;
+      });
 
-    var fontWatchRunner = new FontWatchRunner(activeCallback, inactiveCallback,
-        domHelper, fakeFontSizer, fakeAsyncCall, fakeGetTime, fontFamily, fontDescription, browserInfo);
+      timesToGetBeforeTimeout = 10;
 
-    fontWatchRunner.start();
+      spyOn(goog, 'now').andCallFake(function () {
+        if (timesToGetTimeBeforeTimeout <= 0) {
+          return 6000;
+        } else {
+          timesToGetTimeBeforeTimeout -= 1;
+          return 1;
+        }
+      });
 
-    expect(asyncCount).toEqual(4);
-    expect(inactiveCallback).toHaveBeenCalledWith('My Family', 'n4');
-  });
+      var originalStart = FontWatchRunner.prototype.start;
 
-  describe('WebKit fallback bug', function () {
-    var fallbackBugBrowserInfo = null;
+      spyOn(FontWatchRunner.prototype, 'start').andCallFake(function () {
+        setupFinished = true;
+        fakeGetSizeCount = 0;
 
-    beforeEach(function () {
-      fallbackBugBrowserInfo = new BrowserInfo(true, true, false);
+        originalStart.apply(this);
+      });
     });
 
-    it('should ignore fallback size and call active', function () {
+    it('should call active if fonts are already loaded', function () {
       actualSizes = [
-        LAST_RESORT_SIZE, LAST_RESORT_SIZE,
         TARGET_SIZE, TARGET_SIZE
       ];
 
       var fontWatchRunner = new FontWatchRunner(activeCallback, inactiveCallback,
-          domHelper, fakeFontSizer, fakeAsyncCall, fakeGetTime, fontFamily, fontDescription, fallbackBugBrowserInfo);
+          domHelper, fontFamily, fontDescription, browserInfo);
 
       fontWatchRunner.start();
 
-      expect(asyncCount).toEqual(1);
+      jasmine.Clock.tick(1 * 25);
       expect(activeCallback).toHaveBeenCalledWith('My Family', 'n4');
     });
 
-    it('should consider last resort font as having identical metrics and call active', function () {
+    it('should wait for font load and call active', function () {
       actualSizes = [
-        LAST_RESORT_SIZE, LAST_RESORT_SIZE,
-        LAST_RESORT_SIZE, LAST_RESORT_SIZE
+        FALLBACK_SIZE_A, FALLBACK_SIZE_B,
+        FALLBACK_SIZE_A, FALLBACK_SIZE_B,
+        FALLBACK_SIZE_A, FALLBACK_SIZE_B,
+        TARGET_SIZE, TARGET_SIZE
       ];
 
-      timesToGetTimeBeforeTimeout = 2;
-
       var fontWatchRunner = new FontWatchRunner(activeCallback, inactiveCallback,
-          domHelper, fakeFontSizer, fakeAsyncCall, fakeGetTime, fontFamily, fontDescription, fallbackBugBrowserInfo);
+          domHelper, fontFamily, fontDescription, browserInfo);
 
       fontWatchRunner.start();
 
-      expect(asyncCount).toEqual(1);
+      jasmine.Clock.tick(3 * 25);
       expect(activeCallback).toHaveBeenCalledWith('My Family', 'n4');
     });
 
-    it('should fail to load font and call inactive', function () {
+    it('should wait for font inactive and call inactive', function () {
+      timesToGetTimeBeforeTimeout = 5;
+
       actualSizes = [
-        LAST_RESORT_SIZE, LAST_RESORT_SIZE,
-        LAST_RESORT_SIZE, LAST_RESORT_SIZE,
+        FALLBACK_SIZE_A, FALLBACK_SIZE_B,
+        FALLBACK_SIZE_A, FALLBACK_SIZE_B,
+        FALLBACK_SIZE_A, FALLBACK_SIZE_B,
+        FALLBACK_SIZE_A, FALLBACK_SIZE_B,
         FALLBACK_SIZE_A, FALLBACK_SIZE_B
       ];
 
-      timesToGetTimeBeforeTimeout = 3;
-
       var fontWatchRunner = new FontWatchRunner(activeCallback, inactiveCallback,
-          domHelper, fakeFontSizer, fakeAsyncCall, fakeGetTime, fontFamily, fontDescription, fallbackBugBrowserInfo);
+          domHelper, fontFamily, fontDescription, browserInfo);
 
       fontWatchRunner.start();
 
-      expect(asyncCount).toEqual(2);
+      jasmine.Clock.tick(4 * 25);
       expect(inactiveCallback).toHaveBeenCalledWith('My Family', 'n4');
     });
 
-    it('should call inactive when we are loading a metric incompatible font', function () {
-      actualSizes = [
-        LAST_RESORT_SIZE, LAST_RESORT_SIZE,
-        LAST_RESORT_SIZE, LAST_RESORT_SIZE
-      ];
+    describe('WebKit fallback bug', function () {
+      it('should ignore fallback size and call active', function () {
+        actualSizes = [
+          LAST_RESORT_SIZE, LAST_RESORT_SIZE,
+          TARGET_SIZE, TARGET_SIZE
+        ];
 
-      timesToGetTimeBeforeTimeout = 2;
+        var fontWatchRunner = new FontWatchRunner(activeCallback, inactiveCallback,
+            domHelper, fontFamily, fontDescription, fallbackBugBrowserInfo);
 
-      var fontWatchRunner = new FontWatchRunner(activeCallback, inactiveCallback,
-          domHelper, fakeFontSizer, fakeAsyncCall, fakeGetTime, fontFamily, fontDescription, fallbackBugBrowserInfo,
-          0, { 'My Other Family': true });
+        fontWatchRunner.start();
 
-      fontWatchRunner.start();
-      expect(asyncCount).toEqual(1);
-      expect(inactiveCallback).toHaveBeenCalledWith('My Family', 'n4');
+        jasmine.Clock.tick(1 * 25);
+        expect(activeCallback).toHaveBeenCalledWith('My Family', 'n4');
+      });
+
+      it('should consider last resort font as having identical metrics and call active', function () {
+        actualSizes = [
+          LAST_RESORT_SIZE, LAST_RESORT_SIZE,
+          LAST_RESORT_SIZE, LAST_RESORT_SIZE
+        ];
+
+        timesToGetTimeBeforeTimeout = 2;
+
+        var fontWatchRunner = new FontWatchRunner(activeCallback, inactiveCallback,
+            domHelper, fontFamily, fontDescription, fallbackBugBrowserInfo);
+
+        fontWatchRunner.start();
+
+        jasmine.Clock.tick(1 * 25);
+        expect(activeCallback).toHaveBeenCalledWith('My Family', 'n4');
+      });
+
+      it('should fail to load font and call inactive', function () {
+        actualSizes = [
+          LAST_RESORT_SIZE, LAST_RESORT_SIZE,
+          LAST_RESORT_SIZE, LAST_RESORT_SIZE,
+          FALLBACK_SIZE_A, FALLBACK_SIZE_B
+        ];
+
+        timesToGetTimeBeforeTimeout = 3;
+
+        var fontWatchRunner = new FontWatchRunner(activeCallback, inactiveCallback,
+            domHelper, fontFamily, fontDescription, fallbackBugBrowserInfo);
+
+        fontWatchRunner.start();
+
+        jasmine.Clock.tick(2 * 25);
+        expect(inactiveCallback).toHaveBeenCalledWith('My Family', 'n4');
+      });
+
+      it('should call inactive when we are loading a metric incompatible font', function () {
+        actualSizes = [
+          LAST_RESORT_SIZE, LAST_RESORT_SIZE,
+          LAST_RESORT_SIZE, LAST_RESORT_SIZE
+        ];
+
+        timesToGetTimeBeforeTimeout = 2;
+
+        var fontWatchRunner = new FontWatchRunner(activeCallback, inactiveCallback,
+            domHelper, fontFamily, fontDescription, fallbackBugBrowserInfo,
+            0, { 'My Other Family': true });
+
+        fontWatchRunner.start();
+
+        jasmine.Clock.tick(1 * 25);
+        expect(inactiveCallback).toHaveBeenCalledWith('My Family', 'n4');
+      });
+
+      it('should call active when we are loading a metric compatible font', function () {
+        actualSizes = [
+          LAST_RESORT_SIZE, LAST_RESORT_SIZE,
+          LAST_RESORT_SIZE, LAST_RESORT_SIZE
+        ];
+
+        timesToGetTimeBeforeTimeout = 2;
+
+        var fontWatchRunner = new FontWatchRunner(activeCallback, inactiveCallback,
+            domHelper, fontFamily, fontDescription, fallbackBugBrowserInfo,
+            0, { 'My Family': true });
+
+        fontWatchRunner.start();
+
+        jasmine.Clock.tick(1 * 25);
+        expect(activeCallback).toHaveBeenCalledWith('My Family', 'n4');
+      });
     });
 
-    it('should call active when we are loading a metric compatible font', function () {
-      actualSizes = [
-        LAST_RESORT_SIZE, LAST_RESORT_SIZE,
-        LAST_RESORT_SIZE, LAST_RESORT_SIZE
-      ];
+    describe('webkit metrics bug', function () {
+      it('should correctly call active even though the height is different', function () {
+        actualSizes = [
+          FALLBACK_SIZE_A, FALLBACK_SIZE_B,
+          new Size(1, 2), new Size(2, 3), // Same as FALLBACK_SIZE_A and FALLBACK_SIZE_B except that the height is different.
+          TARGET_SIZE, TARGET_SIZE
+        ];
 
-      timesToGetTimeBeforeTimeout = 2;
+        var fontWatchRunner = new FontWatchRunner(activeCallback, inactiveCallback,
+            domHelper, fontFamily, fontDescription, new BrowserInfo(true, false, true));
 
-      var fontWatchRunner = new FontWatchRunner(activeCallback, inactiveCallback,
-          domHelper, fakeFontSizer, fakeAsyncCall, fakeGetTime, fontFamily, fontDescription, fallbackBugBrowserInfo,
-          0, { 'My Family': true });
+        fontWatchRunner.start();
 
-      fontWatchRunner.start();
-      expect(asyncCount).toEqual(1);
-      expect(activeCallback).toHaveBeenCalledWith('My Family', 'n4');
+        jasmine.Clock.tick(2 * 25);
+        expect(activeCallback).toHaveBeenCalledWith('My Family', 'n4');
+      });
     });
-  });
 
-  describe('webkit metrics bug', function () {
-    it('should correctly call active even though the height is different', function () {
-      actualSizes = [
-        FALLBACK_SIZE_A, FALLBACK_SIZE_B,
-        new Size(1, 2), new Size(2, 3), // Same as FALLBACK_SIZE_A and FALLBACK_SIZE_B except that the height is different.
-        TARGET_SIZE, TARGET_SIZE
-      ];
+    describe('test string', function () {
+      var fontWatchRunner = null;
 
-      var fontWatchRunner = new FontWatchRunner(activeCallback, inactiveCallback,
-          domHelper, fakeFontSizer, fakeAsyncCall, fakeGetTime, fontFamily, fontDescription, new BrowserInfo(true, false, true));
+      beforeEach(function () {
+        spyOn(domHelper, 'createElement').andCallThrough();
+      });
 
-      fontWatchRunner.start();
+      it('should be the default', function () {
+        actualSizes = [
+          TARGET_SIZE, TARGET_SIZE
+        ];
+        fontWatchRunner = new FontWatchRunner(activeCallback, inactiveCallback,
+            domHelper, fontFamily, fontDescription, browserInfo);
 
-      expect(asyncCount).toEqual(2);
-      expect(activeCallback).toHaveBeenCalledWith('My Family', 'n4');
+        fontWatchRunner.start();
+
+        jasmine.Clock.tick(1 * 25);
+        expect(domHelper.createElement.mostRecentCall.args[2]).toEqual('BESbswy');
+      });
+
+      it('should be a custom string', function () {
+        actualSizes = [
+          TARGET_SIZE, TARGET_SIZE
+        ];
+
+        fontWatchRunner = new FontWatchRunner(activeCallback, inactiveCallback,
+            domHelper, fontFamily, fontDescription, browserInfo, 0, {}, 'TestString');
+
+        fontWatchRunner.start();
+
+        jasmine.Clock.tick(1 * 25);
+        expect(domHelper.createElement.mostRecentCall.args[2]).toEqual('TestString');
+      });
     });
   });
 
   describe('real browser testing', function () {
-    var fontSizer = null,
-        asyncCall = null,
-        getTime = null,
-        userAgent = null;
+    var userAgent = null;
 
     beforeEach(function () {
       var userAgentParser = new UserAgentParser(window.navigator.userAgent, window.document);
 
       userAgent = userAgentParser.parse();
-
-      fontSizer = {
-        getSize: function (el) {
-          return new Size(el.offsetWidth, el.offsetHeight);
-        }
-      };
-
-      asyncCall = function (func, timeout) {
-        window.setTimeout(func, timeout);
-      };
-
-      getTime = function () {
-        return new Date().getTime();
-      };
     });
 
     it('should fail to load a null font', function () {
       var fontWatchRunner = new FontWatchRunner(activeCallback, inactiveCallback,
-          domHelper, fontSizer, asyncCall, getTime, '__webfontloader_test__', '',
-          userAgent.getBrowserInfo(), 500);
+          domHelper, '__webfontloader_test__', '', userAgent.getBrowserInfo(), 500);
 
       runs(function () {
         fontWatchRunner.start();
@@ -287,9 +300,8 @@ describe('FontWatchRunner', function () {
 
     it('should load font succesfully', function () {
       var fontWatchRunner = new FontWatchRunner(activeCallback, inactiveCallback,
-          domHelper, fontSizer, asyncCall, getTime, 'SourceSansA', '',
-          userAgent.getBrowserInfo(), 500),
-          ruler = new FontRuler(domHelper, fontSizer, 'abcdef'),
+          domHelper, 'SourceSansA', '', userAgent.getBrowserInfo(), 500),
+          ruler = new FontRuler(domHelper, 'abcdef'),
           activeSize = null,
           originalSize = null,
           finalCheck = false;
@@ -328,8 +340,7 @@ describe('FontWatchRunner', function () {
 
     it('should attempt to load a non-existing font', function () {
       var fontWatchRunner = new FontWatchRunner(activeCallback, inactiveCallback,
-          domHelper, fontSizer, asyncCall, getTime, 'Elena', '',
-          userAgent.getBrowserInfo(), 500);
+          domHelper, 'Elena', '', userAgent.getBrowserInfo(), 500);
 
       runs(function () {
         fontWatchRunner.start();
@@ -346,9 +357,8 @@ describe('FontWatchRunner', function () {
 
     it('should load even if @font-face is inserted after watching has started', function () {
       var fontWatchRunner = new FontWatchRunner(activeCallback, inactiveCallback,
-          domHelper, fontSizer, asyncCall, getTime, 'SourceSansB', '',
-          userAgent.getBrowserInfo(), 500),
-          ruler = new FontRuler(domHelper, fontSizer, 'abcdef'),
+          domHelper, 'SourceSansB', '', userAgent.getBrowserInfo(), 500),
+          ruler = new FontRuler(domHelper, 'abcdef'),
           activeSize = null,
           originalSize = null,
           finalCheck = false;
@@ -364,7 +374,7 @@ describe('FontWatchRunner', function () {
         link.rel = "stylesheet";
         link.href= "fonts/sourcesansb.css";
 
-        document.head.appendChild(link);
+        domHelper.insertInto('head', link);
       });
 
       waitsFor(function () {
@@ -391,39 +401,4 @@ describe('FontWatchRunner', function () {
       });
     });
   });
-
-  describe('test string', function () {
-    var fontWatchRunner = null;
-
-    beforeEach(function () {
-      spyOn(domHelper, 'createElement').andCallThrough();
-    });
-
-    it('should be the default', function () {
-      actualSizes = [
-        TARGET_SIZE, TARGET_SIZE
-      ];
-
-      fontWatchRunner = new FontWatchRunner(activeCallback, inactiveCallback,
-          domHelper, fakeFontSizer, fakeAsyncCall, fakeGetTime, fontFamily, fontDescription, browserInfo);
-
-      fontWatchRunner.start();
-
-      expect(domHelper.createElement.mostRecentCall.args[2]).toEqual('BESbswy');
-    });
-
-    it('should be a custom string', function () {
-      actualSizes = [
-        TARGET_SIZE, TARGET_SIZE
-      ];
-
-      fontWatchRunner = new FontWatchRunner(activeCallback, inactiveCallback,
-          domHelper, fakeFontSizer, fakeAsyncCall, fakeGetTime, fontFamily,
-          fontDescription, browserInfo, 0, {}, 'TestString');
-
-      fontWatchRunner.start();
-
-      expect(domHelper.createElement.mostRecentCall.args[2]).toEqual('TestString');
-    });
-  });
 });