Custom setProperty for bindings to hidden textNodes. Fixes #3157.

Polymer · Dec 5, 2015 · c6be10d · c6be10d
1 parent 090e9d6
commit c6be10d
Show file tree

Hide file tree

Showing 3 changed files with 39 additions and 4 deletions.
diff --git a/src/lib/template/templatizer.html b/src/lib/template/templatizer.html
@@ -124,6 +124,8 @@
       archetype._scopeElementClass = this._scopeElementClassImpl;
       archetype.listen = this._listenImpl;
       archetype._showHideChildren = this._showHideChildrenImpl;
+      archetype.__setPropertyOrig = this.__setProperty;
+      archetype.__setProperty = this.__setPropertyImpl;
       // boilerplate code
       var _constructor = this._constructorImpl;
       var ctor = function TemplateInstance(model, host) {
@@ -168,6 +170,13 @@
       }
     },
 
+    __setPropertyImpl: function(property, value, fromAbove, node) {
+      if (node && node.__hideTemplateChildren__ && property == 'textContent') {
+        property = '__polymerTextContent__';
+      }
+      this.__setPropertyOrig(property, value, fromAbove, node);
+    },
+
     _debounceTemplate: function(fn) {
       Polymer.dom.addDebouncer(this.debounce('_debounceTemplate', fn));
     },
@@ -242,7 +251,7 @@
             }, {
               kind: 'notify',
               fn: Polymer.Bind._notifyEffect,
-              effect: {event: 
+              effect: {event:
                 Polymer.CaseMap.camelToDashCase(parentProp) + '-changed'}
             }];
             Polymer.Bind._createAccessors(proto, parentProp, effects);
@@ -259,7 +268,7 @@
         }
         this._extendTemplate(template, proto);
         template._pathEffector = function(path, value, fromAbove) {
-          return self._pathEffectorImpl(path, value, fromAbove);  
+          return self._pathEffectorImpl(path, value, fromAbove);
         }
       }
     },

diff --git a/test/unit/dom-if-elements.html b/test/unit/dom-if-elements.html
@@ -165,13 +165,18 @@
       <div>1</div>
       <div>2</div>
       <div>3</div>
-      Stuff
+      {{text}}
       <div>4</div>
     </template>
   </template>
   <script>
   Polymer({
-    is: 'x-textcontent'
+    is: 'x-textcontent',
+    properties: {
+      text: {
+        value: 'Stuff'
+      }
+    }
   });
   </script>
 </dom-module>
diff --git a/test/unit/dom-if.html b/test/unit/dom-if.html
@@ -495,6 +495,27 @@
         document.body.removeChild(x);
       });
 
+      test('binding to text nodes changed while if=false', function() {
+        var x = document.createElement('x-textcontent');
+        document.body.appendChild(x);
+        x.$.domIf.render();
+        var stamped = Polymer.dom(x.root).childNodes;
+        assert.equal(stamped.length, 12);
+        assert.equal(stamped[7].textContent.trim(), 'Stuff');
+        x.$.domIf.if = false;
+        x.$.domIf.render();
+        x.text = 'Hollaaaaa!';
+        stamped = Polymer.dom(x.root).childNodes;
+        assert.equal(stamped.length, 12);
+        assert.equal(stamped[7].textContent.trim(), '');
+        x.$.domIf.if = true;
+        x.$.domIf.render();
+        stamped = Polymer.dom(x.root).childNodes;
+        assert.equal(stamped.length, 12);
+        assert.equal(stamped[7].textContent.trim(), 'Hollaaaaa!');
+        document.body.removeChild(x);
+      });
+
     });
 
     suite('queueing race conditions', function() {