When using preProcessNodes within foreach, ensure that updates are ha…

…ndled correctly
wangsong · Jul 2, 2013 · e30410c · e30410c
1 parent 148fd32
commit e30410c
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 1 deletion.
diff --git a/spec/bindingAttributeBehaviors.js b/spec/bindingAttributeBehaviors.js
@@ -489,9 +489,22 @@ describe('Binding attribute syntax', function() {
         };
 
         testNode.innerHTML = "<prop1></prop1>, <p data-bind='text: prop2'></p>, prefix {{ prop3 }} suffix<div data-bind='foreach: prop4'> {{ prop3 }} x</div>";
-        ko.applyBindings({ prop1: 'PROP1VAL', prop2: 'PROP2VAL', prop3: 'PROP3VAL', prop4: [ {prop3: 'PROP4VAL1'}, {prop3: 'PROP4VAL2'} ] }, testNode);
+        var vm = {
+            prop1: 'PROP1VAL',
+            prop2: 'PROP2VAL',
+            prop3: ko.observable('PROP3VAL'),
+            prop4: ko.observable([ {prop3: 'PROP4VAL1'}, {prop3: 'PROP4VAL2'} ])
+        };
+        ko.applyBindings(vm, testNode);
         expect(testNode).toContainText('PROP1VAL, PROP2VAL, prefix PROP3VAL suffix PROP4VAL1 x PROP4VAL2 x');
 
+        // Update observables and test that DOM is updated
+        vm.prop3('NEW_PROP3VAL');
+        expect(testNode).toContainText('PROP1VAL, PROP2VAL, prefix NEW_PROP3VAL suffix PROP4VAL1 x PROP4VAL2 x');
+
+        vm.prop4([ {prop3: 'PROP4VAL3'}, {prop3: 'PROP4VAL4'} ]);
+        expect(testNode).toContainText('PROP1VAL, PROP2VAL, prefix NEW_PROP3VAL suffix PROP4VAL3 x PROP4VAL4 x');
+
         ko.bindingProvider.instance = originalBindingProvider;
     });
 });
diff --git a/src/templating/templating.js b/src/templating/templating.js
@@ -37,6 +37,12 @@
                             lastNode = newNodes[newNodes.length-1];
                     }
                 });
+                // Because preProcessNode can change the nodes, including the first and last nodes, replace
+                // continuousNodeArray with the latest first/last nodes (we don't actually need the inner nodes)
+                continuousNodeArray.length = 0;
+                continuousNodeArray.push(firstNode);
+                if (lastNode !== firstNode)
+                    continuousNodeArray.push(lastNode);
             }
 
             // Need to applyBindings *before* unmemoziation, because unmemoization might introduce extra nodes (that we don't want to re-bind)