Ensure querySelector always returns null when a node is not found. …

…Also optimize querySelector such that the matcher halts on the first result.
Polymer · Jan 14, 2016 · b9e5cce · b9e5cce
1 parent 6e16619
commit b9e5cce
Show file tree

Hide file tree

Showing 3 changed files with 23 additions and 9 deletions.
diff --git a/src/lib/dom-api-shady.html b/src/lib/dom-api-shady.html
@@ -352,7 +352,13 @@
 
     // TODO(sorvell): consider doing native QSA and filtering results.
     querySelector: function(selector) {
-      return this.querySelectorAll(selector)[0];
+      // match selector and halt on first result.
+      var result = this._query(function(n) {
+        return DomApi.matchesSelector.call(n, selector);
+      }, this.node, function(n) {
+        return Boolean(n);
+      })[0];
+      return result || null;
     },
 
     querySelectorAll: function(selector) {

diff --git a/src/lib/dom-api.html b/src/lib/dom-api.html
@@ -139,26 +139,34 @@
       // NOTE: `_query` is used primarily for ShadyDOM's querySelector impl,
       // but it's also generally useful to recurse through the element tree
       // and is used by Polymer's styling system. 
-      _query: function(matcher, node) {
+      _query: function(matcher, node, halter) {
         node = node || this.node;
         var list = [];
-        this._queryElements(TreeApi.Logical.getChildNodes(node), matcher, list);
+        this._queryElements(TreeApi.Logical.getChildNodes(node), matcher, 
+          halter, list);
         return list;
       },
 
-      _queryElements: function(elements, matcher, list) {
+      _queryElements: function(elements, matcher, halter, list) {
         for (var i=0, l=elements.length, c; (i<l) && (c=elements[i]); i++) {
           if (c.nodeType === Node.ELEMENT_NODE) {
-            this._queryElement(c, matcher, list);
+            if (this._queryElement(c, matcher, halter, list)) {
+              return true;
+            }
           }
         }
       },
 
-      _queryElement: function(node, matcher, list) {
-        if (matcher(node)) {
+      _queryElement: function(node, matcher, halter, list) {
+        var result = matcher(node);
+        if (result) {
           list.push(node);
         }
-        this._queryElements(TreeApi.Logical.getChildNodes(node), matcher, list);
+        if (halter && halter(result)) {
+          return result;
+        }
+        this._queryElements(TreeApi.Logical.getChildNodes(node), matcher, 
+          halter, list);
       }
 
     };

diff --git a/test/unit/polymer-dom.js b/test/unit/polymer-dom.js
@@ -11,7 +11,7 @@ suite('Polymer.dom', function() {
     var projected = Polymer.dom(testElement.root).querySelector('#projected');
     assert.equal(projected.textContent, 'projected');
     var p2 = Polymer.dom(testElement).querySelector('#projected');
-    assert.notOk(p2);
+    assert.isNull(p2);
     var rere = Polymer.dom(testElement.root).querySelector('x-rereproject');
     assert.equal(rere.is, 'x-rereproject');
     var re = Polymer.dom(rere.root).querySelector('x-reproject');