feat(lib/patch/file-reader): zone-binds FileReader#onEventName listeners

fix #137

Author: Matthew Hill

lib/patch/browser.js

@@ -9,6 +9,7 @@ var webSocketPatch = require('./websocket');
 var eventTargetPatch = require('./event-target');
 var propertyDescriptorPatch = require('./property-descriptor');
 var geolocationPatch = require('./geolocation');
+var fileReaderPatch = require('./file-reader');
 
 function apply() {
   fnPatch.patchSetClearFunction(global, [
@@ -42,6 +43,8 @@ function apply() {
   registerElementPatch.apply();
 
   geolocationPatch.apply();
+
+  fileReaderPatch.apply();
 }
 
 module.exports = {

lib/patch/event-target.js

@@ -10,7 +10,8 @@ function apply() {
   // Note: EventTarget is not available in all browsers,
   // if it's not available, we instead patch the APIs in the IDL that inherit from EventTarget
   } else {
-    var apis = [ 'ApplicationCache',
+    var apis = [ 
+      'ApplicationCache',
       'EventSource',
       'FileReader',
       'InputMethodContext',
@@ -33,7 +34,14 @@ function apply() {
     ];
 
     apis.forEach(function(thing) {
-      global[thing] && utils.patchEventTargetMethods(global[thing].prototype);
+      var obj = global[thing] && global[thing].prototype;
+
+      // Some browsers e.g. Android 4.3's don't actually implement
+      // the EventTarget methods for all of these e.g. FileReader.
+      // In this case, there is nothing to patch. 
+      if (obj && obj.addEventListener) {
+        utils.patchEventTargetMethods(obj);
+      }
     });
   }
 }

lib/patch/file-reader.js

@@ -0,0 +1,11 @@
+'use strict';
+
+var utils = require('../utils');
+
+function apply() {
+  utils.patchClass('FileReader');
+}
+
+module.exports = {
+  apply: apply
+};

lib/utils.js

@@ -74,7 +74,6 @@ function patchProperty(obj, prop) {
 };
 
 function patchProperties(obj, properties) {
-
   (properties || (function () {
       var props = [];
       for (var prop in obj) {
@@ -118,6 +117,7 @@ function patchEventTargetMethods(obj) {
       handler[boundFnsKey][eventType] = handler[boundFnsKey][eventType] || zone.bind(fn);
       arguments[1] = handler[boundFnsKey][eventType];
     }
+
     return global.zone.addEventListener.apply(this, arguments);
   };
 

test/patch/FileReader.spec.js

@@ -0,0 +1,95 @@
+'use strict';
+
+describe('FileReader', ifEnvSupports('FileReader', function () {
+  var fileReader;
+  var blob;
+  var data = 'Hello, World!';
+  var testZone = zone.fork();
+
+  // Android 4.3's native browser doesn't implement add/RemoveEventListener for FileReader 
+  function supportsEventTargetFns () {
+    return FileReader.prototype.addEventListener && FileReader.prototype.removeEventListener;
+  }
+  supportsEventTargetFns.message = 'FileReader#addEventListener and FileReader#removeEventListener';
+
+  beforeEach(function () {
+    fileReader = new FileReader();
+
+    try {
+      blob = new Blob([data]);
+    } catch (e) {
+      // For hosts that don't support the Blob ctor (e.g. Android 4.3's native browser)
+      var blobBuilder = new WebKitBlobBuilder();
+      blobBuilder.append(data);
+
+      blob = blobBuilder.getBlob();
+    }
+  });
+
+  describe('EventTarget methods', ifEnvSupports(supportsEventTargetFns, function () {
+    it('should bind addEventListener listeners', function (done) {
+      testZone.run(function () {
+        fileReader.addEventListener('load', function () {
+          expect(zone).toBeDirectChildOf(testZone);
+          expect(fileReader.result).toEqual(data);
+          done();
+        });
+      });
+
+      fileReader.readAsText(blob);
+    });
+
+    it('should remove listeners via removeEventListener', function (done) {
+      var listenerSpy = jasmine.createSpy();
+
+      testZone.run(function () {
+        fileReader.addEventListener('loadstart', listenerSpy);
+        fileReader.addEventListener('loadend', function () {
+          expect(listenerSpy).not.toHaveBeenCalled();
+          done();
+        });
+      });
+
+      fileReader.removeEventListener('loadstart', listenerSpy);
+      fileReader.readAsText(blob);
+    });
+  }));
+
+  it('should bind onEventType listeners', function (done) {
+    var listenersCalled = 0;
+
+    testZone.run(function () {
+      fileReader.onloadstart = function () {
+        listenersCalled++;
+        expect(zone).toBeDirectChildOf(testZone);
+      };
+
+      fileReader.onload = function () {
+        listenersCalled++;
+        expect(zone).toBeDirectChildOf(testZone);
+      };
+
+      fileReader.onloadend = function () {
+        listenersCalled++;
+
+        expect(zone).toBeDirectChildOf(testZone);
+        expect(fileReader.result).toEqual(data);
+        expect(listenersCalled).toBe(3);
+        done();
+      };
+    });
+
+    fileReader.readAsText(blob);
+  });
+
+  it('should have correct readyState', function (done) {
+    fileReader.onloadend = function () {
+      expect(fileReader.readyState).toBe(FileReader.DONE);
+      done();
+    };
+
+    expect(fileReader.readyState).toBe(FileReader.EMPTY);
+
+    fileReader.readAsText(blob);
+  });
+}));