specificity - npm Package Compare versions

Comparing version 0.1.5 to 0.1.6

package.json

 {
   "name": "specificity",
-  "version": "0.1.5",
+  "version": "0.1.6",
   "description": "Calculate the specificity of a CSS selector",
@@ -24,7 +24,7 @@ "keywords": [
   "scripts": {
-    "test": "node_modules/.bin/mocha test/test.js"
+    "test": "mocha test/test.js"
   },
   "devDependencies": {
-    "mocha": "1.11.x"
+    "mocha": "2.5.x"
   }
 }

readme.md

@@ -5,3 +5,3 @@ # Specificity Calculator
 
-Specificity Calculator is built for CSS Selectors Level 3. Specificity Calculator isn’t a CSS validator. If you enter invalid selectors it will return incorrect results. For example, the [negation pseudo-class](http://www.w3.org/TR/css3-selectors/#negation) may only take a simple selector as an argument. Using a psuedo-element or combinator as an argument for `:not()` is invalid CSS3 so Specificity Calculator will return incorrect results. Specificity Calculator doesn’t support [CSS character escape sequences](http://mathiasbynens.be/notes/css-escapes).
+Specificity Calculator is built for CSS Selectors Level 3. Specificity Calculator isn’t a CSS validator. If you enter invalid selectors it will return incorrect results. For example, the [negation pseudo-class](http://www.w3.org/TR/css3-selectors/#negation) may only take a simple selector as an argument. Using a psuedo-element or combinator as an argument for `:not()` is invalid CSS3 so Specificity Calculator will return incorrect results.
 
@@ -63,3 +63,4 @@
 
-To test this package, install dependencies: `npm install`
-Run: `npm test`
+To install dependencies, run: `npm install`
+
+Then to test, run: `npm test`

specificity.js

@@ -67,3 +67,3 @@ /**
 					parts.push({
-						selector: match,
+						selector: input.substr(index, length),
 						type: type,
@@ -79,2 +79,27 @@ index: index,
 
+		// Replace escaped characters with plain text, using the "A" character
+		// https://www.w3.org/TR/CSS21/syndata.html#characters
+		(function() {
+			var replaceWithPlainText = function(regex) {
+					var matches, i, len, match;
+					if (regex.test(selector)) {
+						matches = selector.match(regex);
+						for (i = 0, len = matches.length; i < len; i += 1) {
+							match = matches[i];
+							selector = selector.replace(match, Array(match.length + 1).join('A'));
+						}
+					}
+				},
+				// Matches a backslash followed by six hexadecimal digits followed by an optional single whitespace character
+				escapeHexadecimalRegex = /\\[0-9A-Fa-f]{6}\s?/g,
+				// Matches a backslash followed by fewer than six hexadecimal digits followed by a mandatory single whitespace character
+				escapeHexadecimalRegex2 = /\\[0-9A-Fa-f]{1,5}\s/g,
+				// Matches a backslash followed by any character
+				escapeSpecialCharacter = /\\./g;
+
+			replaceWithPlainText(escapeHexadecimalRegex);
+			replaceWithPlainText(escapeHexadecimalRegex2);
+			replaceWithPlainText(escapeSpecialCharacter);
+		}());
+
 		// Remove the negation psuedo-class (:not) but leave its argument because specificity is calculated on its argument
@@ -81,0 +106,0 @@ (function() {

test/test.js

@@ -32,7 +32,27 @@ var specificity = require('../'),
 	{ selector: 'li:nth-child(2n-1) p', expected: '0,0,1,2'},
-	{ selector: ':lang(nl-be)', expected: '0,0,1,0'}
+	{ selector: ':lang(nl-be)', expected: '0,0,1,0'},
+
+	// Tests with CSS escape sequences
+	// https://mathiasbynens.be/notes/css-escapes and https://mathiasbynens.be/demo/crazy-class
+	{ selector: '.\\3A -\\)', expected: '0,0,1,0' },             /* <p class=":-)"></p> */
+	{ selector: '.\\3A \\`\\(', expected: '0,0,1,0' },           /* <p class=":`("></p> */
+	{ selector: '.\\3A .\\`\\(', expected: '0,0,2,0' },          /* <p class=": `("></p> */
+	{ selector: '.\\31 a2b3c', expected: '0,0,1,0' },            /* <p class="1a2b3c"></p> */
+	{ selector: '.\\000031a2b3c', expected: '0,0,1,0' },         /* <p class="1a2b3c"></p> */
+	{ selector: '.\\000031 a2b3c', expected: '0,0,1,0' },        /* <p class="1a2b3c"></p> */
+	{ selector: '#\\#fake-id', expected: '0,1,0,0' },            /* <p id="#fake-id"></p> */
+	{ selector: '.\\#fake-id', expected: '0,0,1,0' },            /* <p class="#fake-id"></p> */
+	{ selector: '#\\<p\\>', expected: '0,1,0,0' },               /* <p id="<p>"></p> */
+	{ selector: '.\\#\\.\\#\\.\\#', expected: '0,0,1,0' },       /* <p class="#.#.#"></p> */
+	{ selector: '.foo\\.bar', expected: '0,0,1,0' },             /* <p class="foo.bar"></p> */
+	{ selector: '.\\:hover\\:active', expected: '0,0,1,0' },     /* <p class=":hover:active"></p> */
+	{ selector: '.\\3A hover\\3A active', expected: '0,0,1,0' }, /* <p class=":hover:active"></p> */
+	{ selector: '.\\000031  p', expected: '0,0,1,1' },           /* <p class="1"><p></p></p>" */
+	{ selector: '.\\3A \\`\\( .another', expected: '0,0,2,0' },  /* <p class=":`("><p class="another"></p></p> */
+	{ selector: '.\\--cool', expected: '0,0,1,0' },              /* <p class="--cool"></p> */
+	{ selector: '#home .\\[page\\]', expected: '0,1,1,0' },      /* <p id="home"><p class="[page]"></p></p> */
 ];
 
 testSelector = function(test) {
-	describe('#calculate("' + test.selector + '")', function() {
+	describe('#calculate("    ' + test.selector + '    ")', function() {
 		it ('should return a specificity of "' + test.expected + '"', function() {
@@ -39,0 +59,0 @@ var result = specificity.calculate(test.selector);

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

12051

increased by28.78%

Lines of code

212

increased by24.71%

Number of lines in readme file

65

increased by1.56%

No dependency changes