automatic node finding within a template-if

[sigmundch]

Should the automatic node finding feature be able to find elements that are added conditionally, for example inside a template-if?

Here is an example that illustrates the issue. While both a and b input boxes are visible and can be found through shadowRoot.querySelector. Only a is found using the automatic node finding feature $:

<script src="platform/platform.js"></script>
<link rel="import" href="polymer/polymer.html">

<polymer-element name="x-test">
  <template>
    <input id="a" value="{{aValue}}">
    <template if="{{hasB}}"><input id="b" value="{{bValue}}"></template>
  </template>
</polymer-element>

<x-test></x-test>

<script>
Polymer('x-test', {
    aValue: 'a',
    hasB: true,
    bValue: 'b',
    enteredView: function() {
      // b is not visible here yet (waiting for bindings to propagate)
      var self = this;

      setTimeout(function () {
        // a is found just fine.
        console.log("a exists: " + !!self.shadowRoot.querySelector('#a'));
        console.log("a found: " + !!self.$.a);

        // b is visible here
        console.log("b exists: " + !!self.shadowRoot.querySelector('#b'));
        // but not available in $
        console.log("b found: " + !!self.$.b);
      }, 0);
    }
});
</script>

For additional details, see this discussion from a polymer.dart user:
https://groups.google.com/a/dartlang.org/d/msg/web/vRt2AxALmA0/ybaa8EUZf4AJ

[sethladd]

/sub

[justinfagnani]

/sub+1

[ErikGrimes]

/sub

[tikurahul]

👍

[agrueneberg]

Would be useful for core-selector if the target sits in a conditional template.

[sjmiles]

See discussion #642