Add test suite for effects order

src/lib/bind/accessors.html

@@ -23,7 +23,7 @@
       _notifyChange: function(source, event, value) {
         value = value === undefined ? this[source] : value;
         event = event || Polymer.CaseMap.camelToDashCase(source) + '-changed';
-        this.fire(event, {value: value}, 
+        this.fire(event, {value: value},
           {bubbles: false, cancelable: false, _useCache: true});
       },
 
@@ -221,8 +221,8 @@
         } else {
           // TODO(sorvell): even though we have a `value` argument, we *must*
           // lookup the current value of the property. Multiple listeners and
-          // queued events during configuration can theoretically lead to 
-          // divergence of the passed value from the current value, but we 
+          // queued events during configuration can theoretically lead to
+          // divergence of the passed value from the current value, but we
           // really need to track down a specific case where this happens.
           value = target[property];
           if (!isStructured) {

test/unit/bind-elements.html

@@ -486,3 +486,86 @@
     });
   </script>
 </dom-module>
+
+<dom-module id="x-order-of-effects-parent">
+  <template>
+    <x-order-of-effects id="child" base="{{base}}"></x-order-of-effects>
+  </template>
+</dom-module>
+
+<dom-module id="x-order-of-effects">
+  <template>
+    <x-order-of-effects-child prop="{{base}}"></x-order-of-effects-child>
+    <div id="child">{{_computedAnnotation(base)}}</div>
+  </template>
+  <script>
+  (function() {
+    var invocations = 0;
+    Polymer({
+      is: 'x-order-of-effects-child',
+      properties: {
+        prop: {
+          type: String,
+          observer: '_childProp'
+        }
+      },
+      _childProp: function(prop) {
+        assert.equal(invocations++, 1);
+      }
+    });
+    Polymer({
+      is: 'x-order-of-effects',
+      properties: {
+        base: {
+          type: String,
+          observer: '_observer',
+          notify: true,
+          reflectToAttribute: true
+        },
+        computed: {
+          type: String,
+          computed: '_computed(base)'
+        },
+        complex: {
+          type: String,
+          value: 'complex'
+        }
+      },
+      observers: ['_complexObserver(complex, base)'],
+      ready: function() {
+        var old = this.reflectPropertyToAttribute.bind(this);
+        this.reflectPropertyToAttribute = function(property, attribute, value) {
+          assert.equal(invocations++, 3);
+          old(property, attribute, value);
+        };
+      },
+      _computed: function(base) {
+        assert.equal(invocations++, 0);
+        return base;
+      },
+      _computedAnnotation: function(base) {
+        assert.equal(invocations++, 2);
+        return base;
+      },
+      _observer: function() {
+        assert.equal(invocations++, 5);
+      },
+      _complexObserver: function() {
+        assert.equal(invocations++, 6);
+      }
+    });
+    Polymer({
+      is: 'x-order-of-effects-parent',
+      properties: {
+        base: {
+          type: String,
+          observer: '_childPropertyChanged'
+        }
+      },
+      _childPropertyChanged: function() {
+        assert.equal(invocations++, 4);
+      }
+    });
+  })();
+  </script>
+</dom-module>

test/unit/bind.html

@@ -856,6 +856,19 @@
 
 });
 
+suite('order of effects', function() {
+
+  var el;
+
+  setup(function() {
+    el = document.createElement('x-order-of-effects-parent').$.child;
+  });
+
+  test('effects are sorted', function() {
+    el.base = 'changed';
+  });
+});
+
 </script>
 
 </body>