[fixed] handle empty (null) elements

lib/compiler.js

@@ -26,7 +26,14 @@ var _utils = require('./utils');
 
 var _cssSelectorParser = require('css-selector-parser');
 
+var _fnName = require('fn-name');
+
+var _fnName2 = _interopRequireDefault(_fnName);
+
 var parser = new _cssSelectorParser.CssSelectorParser();
+var name = function name(type) {
+  return type.displayName || _fnName2['default'](type) || '';
+};
 
 var prim = function prim(value) {
   var typ = typeof value;
@@ -162,7 +169,14 @@ function create() {
       values[_key - 1] = arguments[_key];
     }
 
-    var valueMap = Object.create(null);
+    if (!Array.isArray(strings)) {
+      ;
+
+      var _legacySelector$apply = _utils.legacySelector.apply(null, [strings].concat(values));
+
+      strings = _legacySelector$apply[0];
+      values = _legacySelector$apply[1];
+    }var valueMap = Object.create(null);
 
     var selector = strings.reduce(function (rslt, string, idx) {
       var noValue = idx >= values.length,
@@ -194,7 +208,7 @@ function getTagComparer(rule, values) {
   if (isStr(tagName)) {
     tagName = tagName.toUpperCase();
     return function (root) {
-      return isStr(root.type) && root.type.toUpperCase() === tagName;
+      return isStr(root.type) ? root.type.toUpperCase() === tagName : name(root.type).toUpperCase() === tagName;
     };
   }
 

lib/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bill",
-  "version": "1.3.2",
+  "version": "1.4.0",
   "description": "css selectors for React Elements",
   "main": "index.js",
   "repository": {
@@ -23,6 +23,7 @@
   },
   "dependencies": {
     "css-selector-parser": "^1.1.0",
+    "fn-name": "^2.0.1",
     "lodash": "^3.10.1"
   }
 }

lib/utils.js

@@ -3,6 +3,7 @@
 exports.__esModule = true;
 exports.anyParent = anyParent;
 exports.directParent = directParent;
+exports.legacySelector = legacySelector;
 var isTextElement = function isTextElement(element) {
   return typeof element === 'string';
 };
@@ -36,4 +37,24 @@ function anyParent(test, element, parentNode) {
 function directParent(test, element, parentNode) {
   element = parentNode().parent;
   return !!(element && test(element, parentNode().getParent));
+}
+
+function legacySelector() {
+  var strings = [],
+      values = [];
+
+  for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
+    args[_key] = arguments[_key];
+  }
+
+  args.forEach(function (arg, idx) {
+    var isString = typeof arg === 'string';
+
+    if (isString) strings.push(arg);else {
+      if (idx === 0) strings.push('');
+      values.push(arg);
+    }
+  });
+
+  return [strings, values];
 }

src/instance-selector.js

@@ -42,7 +42,8 @@ export function findAll(inst, test, includeSelf, getParent = ()=> ({ parent: nul
   var element = inst._currentElement
     , parent = ()=> ({ parent: element, getParent });
 
-  if (includeSelf && test(element, inst, getParent))
+  // ReactEmptyComponents (return null render <noscript/>) have null has their element
+  if (includeSelf && element !== null && test(element, inst, getParent))
     found = found.concat(inst)
 
   if (isDOMComponent(publicInst)) {

test/compiler.js

@@ -129,7 +129,7 @@ describe('create compiler', ()=> {
     result({ type: 'a', props: { foo: false } }).should.equal(true)
   })
 
-  it.only('should match inferred name', ()=>{
+  it('should match inferred name', ()=>{
     let Klass = ()=>{}
     let result = compile('Klass.foo')
 

test/selection.js

@@ -108,9 +108,11 @@ describe('Selecting', ()=> {
 
       it('should match with nested tag substitutions', ()=>{
         let List = ({ children })=> children;
+        let Empty = React.createClass({ render(){ return null } })
 
         match(s`${List}.foo > span`,
           <div>
+            <Empty/>
             <List className='foo'>
               <span/>
             </List>