From e92f93440004f8ff73fd382d2532515d695adc7a Mon Sep 17 00:00:00 2001
From: JiaLiPassion <JiaLi.Passion@gmail.com>
Date: Thu, 12 Jan 2017 09:08:17 +0900
Subject: [PATCH] add web-api.ts to patch mediaQuery (#571)

---
 gulpfile.js                     |  5 ++++
 lib/browser/web-api.ts          | 45 +++++++++++++++++++++++++++++++++
 test/browser/MediaQuery.spec.ts | 27 ++++++++++++++++++++
 test/browser_entry_point.ts     |  1 +
 4 files changed, 78 insertions(+)
 create mode 100644 lib/browser/web-api.ts
 create mode 100644 test/browser/MediaQuery.spec.ts

diff --git a/gulpfile.js b/gulpfile.js
index b3eefa706..086feeac8 100644
--- a/gulpfile.js
+++ b/gulpfile.js
@@ -86,6 +86,10 @@ gulp.task('build/zone.min.js', ['compile-esm'], function(cb) {
   return generateScript('./lib/browser/rollup-main.ts', 'zone.min.js', true, cb);
 });
 
+gulp.task('build/web-api.js', ['compile-esm'], function(cb) {
+    return generateScript('./lib/browser/web-api.ts', 'web-api.js', true, cb);
+});
+
 gulp.task('build/jasmine-patch.js', ['compile-esm'], function(cb) {
   return generateScript('./lib/jasmine/jasmine.ts', 'jasmine-patch.js', false, cb);
 });
@@ -151,6 +155,7 @@ gulp.task('build', [
   'build/zone.js.d.ts',
   'build/zone.min.js',
   'build/zone-node.js',
+  'build/web-api.js',
   'build/jasmine-patch.js',
   'build/jasmine-patch.min.js',
   'build/mocha-patch.js',
diff --git a/lib/browser/web-api.ts b/lib/browser/web-api.ts
new file mode 100644
index 000000000..ef7ab1003
--- /dev/null
+++ b/lib/browser/web-api.ts
@@ -0,0 +1,45 @@
+/**
+ * @license
+ * Copyright Google Inc. All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.io/license
+ */
+import {NestedEventListenerOrEventListenerObject, patchEventTargetMethods} from '../common/utils';
+
+((_global: any) => {
+  // patch MediaQuery
+  patchMediaQuery(_global);
+
+  function patchMediaQuery(_global: any) {
+    if (!_global['MediaQueryList']) {
+      return;
+    }
+    patchEventTargetMethods(
+        _global['MediaQueryList'].prototype, 'addListener', 'removeListener', (self, args) => {
+          return {
+            useCapturing: false,
+            eventName: 'mediaQuery',
+            handler: args[0],
+            target: self || _global,
+            name: 'mediaQuery',
+            invokeAddFunc: function(
+                addFnSymbol: any, delegate: Task|NestedEventListenerOrEventListenerObject) {
+              if (delegate && (<Task>delegate).invoke) {
+                return this.target[addFnSymbol]((<Task>delegate).invoke);
+              } else {
+                return this.target[addFnSymbol](delegate);
+              }
+            },
+            invokeRemoveFunc: function(
+                removeFnSymbol: any, delegate: Task|NestedEventListenerOrEventListenerObject) {
+              if (delegate && (<Task>delegate).invoke) {
+                return this.target[removeFnSymbol]((<Task>delegate).invoke);
+              } else {
+                return this.target[removeFnSymbol](delegate);
+              }
+            }
+          };
+        });
+  }
+})(typeof window === 'object' && window || typeof self === 'object' && self || global);
\ No newline at end of file
diff --git a/test/browser/MediaQuery.spec.ts b/test/browser/MediaQuery.spec.ts
new file mode 100644
index 000000000..1c812aa11
--- /dev/null
+++ b/test/browser/MediaQuery.spec.ts
@@ -0,0 +1,27 @@
+/**
+ * @license
+ * Copyright Google Inc. All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.io/license
+ */
+
+import '../../lib/browser/web-api';
+
+import {zoneSymbol} from '../../lib/common/utils';
+import {ifEnvSupports} from '../test-util';
+
+function supportMediaQuery() {
+  const _global =
+      typeof window === 'object' && window || typeof self === 'object' && self || global;
+  return _global['MediaQueryList'] && _global['matchMedia'];
+}
+
+describe('test mediaQuery patch', ifEnvSupports(supportMediaQuery, () => {
+           it('test whether addListener is patched', () => {
+             const mqList = window.matchMedia('min-width:500px');
+             if (mqList && mqList['addListener']) {
+               expect(mqList[zoneSymbol('addListener')]).not.toBe(undefined);
+             }
+           });
+         }));
diff --git a/test/browser_entry_point.ts b/test/browser_entry_point.ts
index 8b03f819c..abf1b22f0 100644
--- a/test/browser_entry_point.ts
+++ b/test/browser_entry_point.ts
@@ -19,4 +19,5 @@ import './browser/registerElement.spec';
 import './browser/requestAnimationFrame.spec';
 import './browser/WebSocket.spec';
 import './browser/XMLHttpRequest.spec';
+import './browser/MediaQuery.spec';
 import './mocha-patch.spec';
\ No newline at end of file