From 4bae2b629081b5872936acaac6ddd987abe00aa1 Mon Sep 17 00:00:00 2001
From: Chad Killingsworth <chadkillingsworth@gmail.com>
Date: Tue, 8 Aug 2017 15:27:53 -0500
Subject: [PATCH] Support property observers which are direct function
 references in addition to strings. Provides better static analysis and
 refactoring support in multiple tools. Alleviates the need for property
 reflection with Closure-compiler renaming.

---
 lib/mixins/property-effects.html         | 20 ++++++++++----------
 test/unit/property-effects-elements.html |  2 +-
 2 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/lib/mixins/property-effects.html b/lib/mixins/property-effects.html
index 5761eb23b2..074687c5da 100644
--- a/lib/mixins/property-effects.html
+++ b/lib/mixins/property-effects.html
@@ -208,12 +208,12 @@
    * @private
    */
   function runObserverEffect(inst, property, props, oldProps, info) {
-    let fn = inst[info.methodName];
+    let fn = typeof info.method === "string" ? inst[info.method] : info.method;
     let changedProp = info.property;
     if (fn) {
       fn.call(inst, inst.__data[changedProp], oldProps[changedProp]);
     } else if (!info.dynamicFn) {
-      console.warn('observer method `' + info.methodName + '` not defined');
+      console.warn('observer method `' + info.method + '` not defined');
     }
   }
 
@@ -1989,19 +1989,19 @@
        * full API docs.
        *
        * @param {string} property Property name
-       * @param {string} methodName Name of observer method to call
+       * @param {string|function(*,*)} method Function or name of observer method to call
        * @param {boolean=} dynamicFn Whether the method name should be included as
        *   a dependency to the effect.
        * @protected
        */
-      _createPropertyObserver(property, methodName, dynamicFn) {
-        let info = { property, methodName, dynamicFn: Boolean(dynamicFn) };
+      _createPropertyObserver(property, method, dynamicFn) {
+        let info = { property, method, dynamicFn: Boolean(dynamicFn) };
         this._addPropertyEffect(property, TYPES.OBSERVE, {
           fn: runObserverEffect, info, trigger: {name: property}
         });
         if (dynamicFn) {
-          this._addPropertyEffect(methodName, TYPES.OBSERVE, {
-            fn: runObserverEffect, info, trigger: {name: methodName}
+          this._addPropertyEffect(method, TYPES.OBSERVE, {
+            fn: runObserverEffect, info, trigger: {name: method}
           });
         }
       }
@@ -2129,13 +2129,13 @@
        * Creates a single-property observer for the given property.
        *
        * @param {string} property Property name
-       * @param {string} methodName Name of observer method to call
+       * @param {string|function(*,*)} method Function or name of observer method to call
        * @param {boolean=} dynamicFn Whether the method name should be included as
        *   a dependency to the effect.
        * @protected
        */
-      static createPropertyObserver(property, methodName, dynamicFn) {
-        this.prototype._createPropertyObserver(property, methodName, dynamicFn);
+      static createPropertyObserver(property, method, dynamicFn) {
+        this.prototype._createPropertyObserver(property, method, dynamicFn);
       }
 
       /**
diff --git a/test/unit/property-effects-elements.html b/test/unit/property-effects-elements.html
index 2cb36bbd44..0b6d22c0a5 100644
--- a/test/unit/property-effects-elements.html
+++ b/test/unit/property-effects-elements.html
@@ -496,7 +496,7 @@
       },
       prop2: {
         value: 'default',
-        observer: 'prop2Changed'
+        observer: function(newProp, oldProp) { return this.prop2Changed(newProp, oldProp); }
       }
     },
     created: function() {