[fixed] tag name comparisons should be case sensative

lib/README.md

@@ -170,25 +170,26 @@ let found = findAll(elements, function (node) {
 })
 ```
 
-### registerPseudo(pseudoSelector, testFunction)
+### registerPseudo(pseudoSelector, isSelector=true, testFunction)
 
 Registers a new pseudo selector with the compiler. The second parameter is a function that will be called
 with the compiled inner selector of the pseudo selector (if it exists) and should return a __new__ function that
-tests an element or node.
+tests an element or node. The second `isSelector` argument indicates that the inner text of the pseudoSelector
+(as in `'foo'` in `:has(.foo)`) is itself a selector that needs to be compiled into a function.
 
 ```js
 // A simple `:disabled` pseudo selector
-bill.registerPseudo('disabled', function() {
+bill.registerPseudo('disabled', false, function() {
   return (node) => node.nodeType !== NODE_TYPES.TEXT
     && node.element.props.disabled === true
 })
 
 // We want to test if an element has a sibling that matches
-// a selector e.g. :nextSibling('.foo')
-bill.registerPseudo('nextSibling', function (test) {
+// a selector e.g. :nextSibling(.foo)
+bill.registerPseudo('nextSibling', function (compiledInnerSelector) {
   return function (node) {
     node = node.nextSibling
-    return !!node && test(node)
+    return !!node && compiledInnerSelector(node)
   }
 })
 

lib/compiler.js

@@ -90,8 +90,11 @@ function create() {
       NESTING[name] = fn;
     },
 
-    registerPseudo: function registerPseudo(name, fn) {
-      parser.registerSelectorPseudos(name);
+    registerPseudo: function registerPseudo(name, containsSelector, fn) {
+      if (typeof containsSelector === 'function') fn = containsSelector, containsSelector = true;
+
+      if (containsSelector) parser.registerSelectorPseudos(name);
+
       PSEUDOS[name] = fn;
     }
   };
@@ -142,7 +145,7 @@ function create() {
       fns = fns.concat(rule.pseudos.map(function (pseudo) {
         if (!PSEUDOS[pseudo.name]) throw new Error('psuedo element: ' + pseudo.name + ' is not supported');
 
-        var pseudoCompiled = pseudo.valueType === 'selector' ? compile(pseudo.value, values) : pseudo;
+        var pseudoCompiled = pseudo.valueType === 'selector' ? compile(pseudo.value, values) : pseudo.value;
 
         return PSEUDOS[pseudo.name](pseudoCompiled, values, options);
       }));

lib/index.js

@@ -36,5 +36,6 @@ module.exports = _extends({
   findAll: _node.findAll,
   isNode: function isNode(el) {
     return el && el.$$typeof === _node.NODE_TYPE;
-  }
+  },
+  NODE_TYPES: _node.NODE_TYPES
 }, compiler);

lib/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bill",
-  "version": "2.0.3",
+  "version": "2.1.0",
   "description": "css selectors for React Elements",
   "main": "index.js",
   "repository": {

src/compiler.js

@@ -179,7 +179,7 @@ function getTagComparer(rule, values) {
     if (typeof tagName !== 'string')
       test = root => root.element.type === tagName
     else {
-      test = root => name(root.element.type).toUpperCase() === tagName.toUpperCase();
+      test = root => name(root.element.type) === tagName;
     }
 
     test = failText(test)

test/compiler.js

@@ -188,4 +188,20 @@ describe('create compiler', ()=> {
       props: { className: 'foo' }
     }).should.equal(true)
   })
+
+  // https://github.com/jquense/teaspoon/issues/14
+  it('should make a case sensitive tagName comparison', ()=>{
+    let result = compile('button.foo')
+    let Button = ()=>{}
+
+    result({
+      type: Button,
+      props: { className: 'foo' }
+    }).should.equal(false)
+
+    result({
+      type: 'button',
+      props: { className: 'foo' }
+    }).should.equal(true)
+  })
 })