Merge pull request #60 from GoogleWebComponents/guard-local-changes

Guard local changes

Author: cdata

firebase-collection.html

@@ -326,8 +326,6 @@ <h4>[[dinosaur.__firebaseKey__]]</h4>
             this.remove(removed);
           }, this);
 
-          this.data.splice(splice.index, splice.addedCount);
-
           added.forEach(function(added) {
             this.add(added);
           }, this);

firebase-query-behavior.html

@@ -74,6 +74,9 @@
     },
 
     _applyRemoteDataChange: function(applyChange) {
+      if (this._applyingLocalDataChanges) {
+        return;
+      }
       this._receivingRemoteChanges = true;
       applyChange.call(this);
       this._receivingRemoteChanges = false;
@@ -84,7 +87,9 @@
         return;
       }
 
+      this._applyingLocalDataChanges = true;
       this._applyLocalDataChanges(changes);
+      this._applyingLocalDataChanges = false;
     },
 
     _queryChanged: function(query, oldQuery) {

test/firebase-collection.html

@@ -64,10 +64,51 @@
     </template>
   </test-fixture>
 
+  <test-fixture id="BoundCollection">
+    <template>
+      <section>
+        <!-- TODO(cdata): Add support for elements like `dom-bind` at the root
+             of the template to `test-fixture`, so that we can remove this
+             wrapping `section`. -->
+        <template is="dom-bind">
+          <template is="dom-repeat" items="{{data}}">
+            <div>[[item.value]]</div>
+          </template>
+          <firebase-collection
+            location="https://fb-element-demo.firebaseio.com/test/empty"
+            data="{{data}}"
+            log>
+          </firebase-collection>
+        </template>
+      </section>
+    </template>
+  </test-fixture>
+
   <script>
     suite('<firebase-collection>', function() {
       var firebase;
 
+      suite('collection manipulation', function() {
+        var domBind;
+        var dom;
+
+        setup(function() {
+          dom = fixture('BoundCollection');
+          domBind = dom.querySelector('[is=dom-bind]');
+          firebase = dom.querySelector('firebase-collection');
+        });
+
+        test('added values reflect 1-to-1 in the DOM', function(done) {
+          waitForEvent(firebase, 'firebase-value').then(function() {
+            waitForEvent(firebase, 'firebase-child-added').then(function() {
+              expect(dom.querySelectorAll('div').length).to.be.equal(firebase.data.length);
+              done();
+            });
+            domBind.unshift('data', { value: 'blah' });
+          });
+        });
+      });
+
       suite('basic usage', function() {
         setup(function() {
           firebase = fixture('TrivialCollection');