From df6d1e6dac61d686a5fa428880c728fbed4f28bd Mon Sep 17 00:00:00 2001
From: Devin Torres <devin@devintorr.es>
Date: Mon, 25 Jan 2016 19:26:27 -0600
Subject: [PATCH 1/3] WIP posthtml

---
 lib/main.js       |  104 +++--
 test/benchmark.js |    9 +-
 test/main.js      | 1025 ++++++++++++++++++++++-----------------------
 3 files changed, 576 insertions(+), 562 deletions(-)

diff --git a/lib/main.js b/lib/main.js
index c8e005c..1caee08 100644
--- a/lib/main.js
+++ b/lib/main.js
@@ -1,7 +1,7 @@
 'use strict';
 
-var cheerio = require('cheerio');
 var Hashids = require('hashids');
+var posthtml = require('posthtml');
 var postcssSafeParser = require('postcss-safe-parser');
 var postcssSelectorParser = require('postcss-selector-parser');
 
@@ -83,30 +83,27 @@ HTMLUglify.prototype.isWhitelisted = function(type, value) {
   return this.whitelist.indexOf(value) >= 0;
 };
 
-HTMLUglify.prototype.pointerizeClass = function($element, lookups) {
+HTMLUglify.prototype.pointerizeClass = function(node, lookups) {
   var self = this;
-  var value = $element.attr('class');
+  var value = node.attrs.class;
 
   if (value) {
-    var splitClasses = value.split(/\s+/);
+    var newClasses = value.split(/\s+/).map(function(value) {
+      return self.createLookup('class', value, lookups);
+    }).join(' ');
 
-    splitClasses.forEach(function(value) {
-      var pointer = self.createLookup('class', value, lookups);
-      if (pointer) {
-        $element.removeClass(value);
-        $element.addClass(pointer);
-      }
-    });
+    node.attrs.class = newClasses;
   }
 };
 
-HTMLUglify.prototype.pointerizeIdAndFor = function(type, $element, lookups) {
-  var value = $element.attr(type);
-
-  var pointer = this.createLookup('id', value, lookups);
-  if (pointer) {
-    $element.attr(type, pointer);
-  }
+HTMLUglify.prototype.pointerizeIdAndFor = function(type, node, lookups) {
+  // var value = node.attrs[type];
+  // var pointer = this.createLookup('id', value, lookups);
+  // if (pointer) {
+  //   node.attrs[type] = pointer;
+  // }
+  var pointer = this.createLookup('id', node.attrs[type], lookups);
+  node.attrs[type] = pointer;
 };
 
 HTMLUglify.prototype.processRules = function(rules, lookups) {
@@ -141,49 +138,70 @@ HTMLUglify.prototype.processRules = function(rules, lookups) {
   });
 };
 
-HTMLUglify.prototype.rewriteElements = function($, lookups) {
+HTMLUglify.prototype.rewriteElements = function(tree, lookups) {
   var self = this;
 
   lookups = lookups || {};
 
-  $('*[id]').each(function() {
-    self.pointerizeIdAndFor('id', $(this), lookups);
-  });
+  // $('*[id]').each(function() {
+  //   self.pointerizeIdAndFor('id', $(this), lookups);
+  // });
+  //
+  // $('*[for]').each(function() {
+  //   self.pointerizeIdAndFor('for', $(this), lookups);
+  // });
+  //
+  // $('*[class]').each(function() {
+  //   self.pointerizeClass($(this), lookups);
+  // });
+  return tree.walk(function(node) {
+    if (node.attrs) {
+      if (node.attrs.id) {
+        self.pointerizeIdAndFor('id', node, lookups);
+      }
 
-  $('*[for]').each(function() {
-    self.pointerizeIdAndFor('for', $(this), lookups);
-  });
+      if (node.attrs.for) {
+        self.pointerizeIdAndFor('for', node, lookups);
+      }
 
-  $('*[class]').each(function() {
-    self.pointerizeClass($(this), lookups);
+      if (node.attrs.class) {
+        self.pointerizeClass(node, lookups);
+      }
+    }
+    return node;
   });
-
-  return $;
 };
 
-HTMLUglify.prototype.rewriteStyles = function($, lookups) {
+HTMLUglify.prototype.rewriteStyles = function(tree, lookups) {
   var self = this;
 
   lookups = lookups || {};
 
-  $('style').each(function() {
-    var $style = $(this);
-    var ast = postcssSafeParser($style.text());
-    self.processRules(ast.nodes, lookups);
-    $style.text(ast.toString());
+  return tree.walk(function(node) {
+    if (node.tag === 'style' && node.content) {
+      var ast = postcssSafeParser([].concat(node.content).join(''));
+      self.processRules(ast.nodes, lookups);
+      node.content = ast.toString();
+    }
+    return node;
   });
-
-  return $;
 };
 
-HTMLUglify.prototype.process = function(html) {
+HTMLUglify.prototype.process = function(tree) {
   var lookups = {};
 
-  var $ = cheerio.load(html);
-  $ = this.rewriteStyles($, lookups);
-  $ = this.rewriteElements($, lookups);
+  tree = this.rewriteStyles(tree, lookups);
+  tree = this.rewriteElements(tree, lookups);
 
-  return $.html();
+  return tree;
 };
 
-module.exports = HTMLUglify;
+module.exports = function(options) {
+	return function(tree) {
+    return new HTMLUglify(options).process(tree);
+  }
+};
+
+module.exports.process = function(html, options) {
+	return posthtml().use(module.exports(options)).process(html, { sync: true });
+};
diff --git a/test/benchmark.js b/test/benchmark.js
index 7284ca1..b2881de 100644
--- a/test/benchmark.js
+++ b/test/benchmark.js
@@ -2,18 +2,19 @@
 
 var fs = require('fs');
 var Benchmark = require('benchmark');
-var HTMLUglify = require('../lib/main.js');
+var posthtml = require('posthtml');
+var uglify = require('../lib/main.js');
 
 var suite = new Benchmark.Suite();
-var htmlUglify = new HTMLUglify();
+var htmlUglify = posthtml().use(uglify());
 
 console.log('Running benchmark');
 
 var html = fs.readFileSync('./test/test.html');
 
 suite
-.add('#process', function() {
-   htmlUglify.process(html);
+.add('#process', function(done) {
+  htmlUglify.process(html, { sync: true });
 })
 .on('cycle', function(event) {
   console.log(String(event.target));
diff --git a/test/main.js b/test/main.js
index 3becbef..e5d69cd 100644
--- a/test/main.js
+++ b/test/main.js
@@ -1,526 +1,521 @@
 'use strict';
 
 var assert = require('chai').assert;
-var cheerio = require('cheerio');
-var HTMLUglify = require('../lib/main.js');
-
-var htmlUglify = new HTMLUglify();
+var htmlUglify = require('../lib/main.js');
 
 describe('HTMLUglify', function() {
-  describe('#isWhitelisted', function() {
-    var whitelist;
-    var htmlUglify;
-
-    beforeEach(function() {
-      whitelist = ['#theid', '.theclass', '#★', '.★'];
-      htmlUglify = new HTMLUglify({whitelist: whitelist});
-    });
-    it('returns true if id is in whitelist', function() {
-      var whitelisted = htmlUglify.isWhitelisted('id', 'theid');
-      assert.isTrue(whitelisted);
-    });
-    it('returns false if id is in the whitelist but only checking for classes', function() {
-      var whitelisted = htmlUglify.isWhitelisted('class', 'theid');
-      assert.isFalse(whitelisted);
-    });
-    it('returns true if class is in whitelist', function() {
-      var whitelisted = htmlUglify.isWhitelisted('class', 'theclass');
-      assert.isTrue(whitelisted);
-    });
-    it('returns true if id is in whitelist for a unicode character', function() {
-      var whitelisted = htmlUglify.isWhitelisted('id', '★');
-      assert.isTrue(whitelisted);
-    });
-    it('returns true if class is in whitelist for a unicode character', function() {
-      var whitelisted = htmlUglify.isWhitelisted('class', '★');
-      assert.isTrue(whitelisted);
-    });
-  });
-  describe('#checkForStandardPointer', function() {
-    it('returns undefined when name not found', function() {
-      var lookups = {
-        'class': { 'something': 'zzz' }
-      };
-      var value = 'other';
-      var pointer = htmlUglify.checkForStandardPointer(lookups, 'class', value);
-
-      assert.isUndefined(pointer);
-    });
-    it('returns pointer when found', function() {
-      var lookups = {
-        'class': { 'something': 'zzz' }
-      };
-      var value = 'something';
-      var pointer = htmlUglify.checkForStandardPointer(lookups, 'class', value);
-
-      assert.equal(pointer, 'zzz');
-    });
-  });
-  describe('#checkForAttributePointer', function() {
-    it('returns undefined when not found', function() {
-      var lookups = {
-        'class': { 'something': 'zzz' }
-      };
-      var value = 'other';
-      var pointer = htmlUglify.checkForAttributePointer(lookups, 'class', value);
-
-      assert.isUndefined(pointer);
-    });
-    it('returns the pointer when value contains same string as an existing lookup', function() {
-      var lookups = {
-        'class': { 'something': 'zzz' }
-      };
-      var value = 'somethingElse';
-      var pointer = htmlUglify.checkForAttributePointer(lookups, 'class', value);
-
-      assert.equal(pointer, 'zzzElse');
-    });
-  });
-  describe('#generatePointer', function() {
-    it('returns xz for counter 0 lookups', function() {
-      var lookups = {};
-      var pointer = htmlUglify.generatePointer(lookups);
-      assert.equal(pointer, 'xz');
-    });
-    it('returns wk for 1 lookups', function() {
-      var lookups = { 'id': { 'a': 'xz' } };
-      var pointer = htmlUglify.generatePointer(lookups);
-      assert.equal(pointer, 'wk');
-    });
-    it('returns en for 2 lookups', function() {
-      var lookups = { 'id': { 'a': 'xz' }, 'class': { 'b': 'wk' } };
-      var pointer = htmlUglify.generatePointer(lookups);
-      assert.equal(pointer, 'en');
-    });
-  });
-  describe('#pointer', function() {
-    it('generates a new pointer', function() {
-      var lookups = {};
-      var pointer = htmlUglify.pointer('class', 'newClass', {});
-      assert.equal(pointer, 'xz', lookups);
-    });
-    it('generates a new pointer given a different one exists', function() {
-      var lookups = {
-        'class': { 'otherClass': 'wk' }
-      };
-      var pointer = htmlUglify.pointer('class', 'newClass', lookups);
-      assert.equal(pointer, 'wk', lookups);
-    });
-    it('generates a new pointer given a different one exists in a different attribute', function() {
-      var lookups = {
-        'id': { 'someId': 'wk' }
-      };
-      var pointer = htmlUglify.pointer('class', 'newClass', lookups);
-      assert.equal(pointer, 'wk', lookups);
-    });
-    it('finds an existing class pointer', function() {
-      var lookups = {
-        'class': { 'someClass': 'xz' }
-      };
-      var pointer = htmlUglify.pointer('class', 'someClass', lookups);
-      assert.equal(pointer, 'xz', lookups);
-    });
-    it('finds an existing id pointer', function() {
-      var lookups = {
-        'id': { 'someId': 'en' }
-      };
-      var pointer = htmlUglify.pointer('id', 'someId', lookups);
-      assert.equal(pointer, 'en');
-    });
-    it('finds a more complex existing pointer', function() {
-      var lookups = {
-        class: {
-          test: 'xz',
-          testOther: 'wk',
-          otratest: 'en'
-        }
-      };
-      var pointer = htmlUglify.pointer('class', 'test', lookups);
-
-      assert.equal(pointer, 'xz');
-    });
-  });
-
-  describe('#rewriteStyles', function() {
-    it('rewrites an id given lookups', function() {
-      var lookups = { 'id=abe': 'xz' };
-      var html = '<style>#abe{ color: red; }</style>';
-      var $ = cheerio.load(html);
-      var results = htmlUglify.rewriteStyles($, lookups).html();
-      assert.equal(results, '<style>#xz{ color: red; }</style>');
-    });
-    it('rewrites an id', function() {
-      var lookups = { };
-      var html = '<style>#xz{ color: red; }</style>';
-      var $ = cheerio.load(html);
-      var results = htmlUglify.rewriteStyles($, lookups).html();
-      assert.equal(results, '<style>#xz{ color: red; }</style>');
-    });
-    it('rewrites an id with the same name as the element', function() {
-      var lookups = {'id': {'label': 'ab' }};
-      var html = '<style>label#label{ color: blue; }</style>';
-      var $ = cheerio.load(html);
-      var results = htmlUglify.rewriteStyles($, lookups).html();
-      assert.equal(results, '<style>label#ab{ color: blue; }</style>');
-    });
-    it('rewrites a for= given lookups', function() {
-      var lookups = { 'id': {'email': 'ab'} };
-      var html = '<style>label[for=email]{ color: blue; }</style>';
-      var $ = cheerio.load(html);
-      var results = htmlUglify.rewriteStyles($, lookups).html();
-      assert.equal(results, "<style>label[for=ab]{ color: blue; }</style>");
-    });
-    it('does rewrites a for=', function() {
-      var lookups = {};
-      var html = '<style>label[for=email]{ color: blue; }</style>';
-      var $ = cheerio.load(html);
-      var results = htmlUglify.rewriteStyles($, lookups).html();
-      assert.equal(results, "<style>label[for=xz]{ color: blue; }</style>");
-    });
-    it('rewrites a for= with quotes given lookups', function() {
-      var lookups = { 'id': {'email': 'ab'} };
-      var html = '<style>label[for="email"]{ color: blue; }</style>';
-      var $ = cheerio.load(html);
-      var results = htmlUglify.rewriteStyles($, lookups).html();
-      assert.equal(results, '<style>label[for="ab"]{ color: blue; }</style>');
-    });
-    it('rewrites a for= with the same name as the element', function() {
-      var lookups = { 'id': { 'label': 'ab' }};
-      var html = '<style>label[for="label"]{ color: blue; }</style>';
-      var $ = cheerio.load(html);
-      var results = htmlUglify.rewriteStyles($, lookups).html();
-      assert.equal(results, '<style>label[for="ab"]{ color: blue; }</style>');
-    });
-    it('rewrites an id= given lookups', function() {
-      var lookups = { 'id': {'email': 'ab'} };
-      var html = '<style>label[id=email]{ color: blue; }</style>';
-      var $ = cheerio.load(html);
-      var results = htmlUglify.rewriteStyles($, lookups).html();
-      assert.equal(results, '<style>label[id=ab]{ color: blue; }</style>');
-    });
-    it('rewrites an id= with quotes given lookups', function() {
-      var lookups = { 'id': { 'email': 'ab' } };
-      var html = '<style>label[id="email"]{ color: blue; }</style>';
-      var $ = cheerio.load(html);
-      var results = htmlUglify.rewriteStyles($, lookups).html();
-      assert.equal(results, '<style>label[id="ab"]{ color: blue; }</style>');
-    });
-    it('rewrites an id= with quotes and with the same name as the element', function() {
-      var lookups = { 'id': {'label': 'ab'} };
-      var html = '<style>label[id="label"]{ color: blue; }</style>';
-      var $ = cheerio.load(html);
-      var results = htmlUglify.rewriteStyles($, lookups).html();
-      assert.equal(results, '<style>label[id="ab"]{ color: blue; }</style>');
-    });
-    it('rewrites a class given lookups', function() {
-      var lookups = { 'class': { 'email': 'ab' }};
-      var html = '<style>label.email{ color: blue; }</style>';
-      var $ = cheerio.load(html);
-      var results = htmlUglify.rewriteStyles($, lookups).html();
-      assert.equal(results, '<style>label.ab{ color: blue; }</style>');
-    });
-    it('rewrites a class with the same name as the element', function() {
-      var lookups = { 'class': { 'label': 'ab' }};
-      var html = '<style>label.label{ color: blue; }</style>';
-      var $ = cheerio.load(html);
-      var results = htmlUglify.rewriteStyles($, lookups).html();
-      assert.equal(results, '<style>label.ab{ color: blue; }</style>');
-    });
-    it('rewrites a class= given lookups', function() {
-      var lookups = { 'class': { 'email': 'ab' }};
-      var html = '<style>form [class=email] { color: blue; }</style>';
-      var $ = cheerio.load(html);
-      var results = htmlUglify.rewriteStyles($, lookups).html();
-      assert.equal(results, "<style>form [class=ab] { color: blue; }</style>");
-    });
-    it('rewrites multi-selector rule', function() {
-      var lookups = { 'class': { 'email': 'ab' }};
-      var html = '<style>label.email, a.email { color: blue; }</style>';
-      var $ = cheerio.load(html);
-      var results = htmlUglify.rewriteStyles($, lookups).html();
-      assert.equal(results, '<style>label.ab, a.ab { color: blue; }</style>');
-    });
-    it('rewrites css media queries', function() {
-      var lookups = { 'id': { 'abe': 'wz' }};
-
-      var html = '<style>@media screen and (max-width: 300px) { #abe{ color: red; } }</style>';
-      var $ = cheerio.load(html);
-      var results = htmlUglify.rewriteStyles($, lookups).html();
-      assert.equal(results, '<style>@media screen and (max-width: 300px) { #wz{ color: red; } }</style>');
-    });
-    it('rewrites nested css media queries', function() {
-      var lookups = { 'id': { 'abe': 'wz' }};
-
-      var html = '<style>@media { @media screen and (max-width: 300px) { #abe{ color: red; } } }</style>';
-      var $ = cheerio.load(html);
-      var results = htmlUglify.rewriteStyles($, lookups).html();
-      assert.equal(results, '<style>@media { @media screen and (max-width: 300px) { #wz{ color: red; } } }</style>');
-    });
-    it('handles malformed syntax', function() {
-      var html = '<style>@media{.media{background: red}</style>';
-      var $ = cheerio.load(html);
-      var results = htmlUglify.rewriteStyles($).html();
-      assert.equal(results, '<style>@media{.xz{background: red}}</style>');
-    });
-  });
-
-  describe('#pointerizeClass', function() {
-    var $element;
-
-    beforeEach(function() {
-      var html = '<p class="one two"></p>';
-      var $ = cheerio.load(html);
-
-      $element = $('p').first();
-    });
-
-    it('works with empty lookups', function() {
-      var lookups = {};
-      htmlUglify.pointerizeClass($element, lookups);
-      assert.deepEqual(lookups, { class: { one: 'xz', two: 'wk' } });
-    });
-    it('works with single lookup', function() {
-      var lookups = { class: { one: 'ab' } };
-      htmlUglify.pointerizeClass($element, lookups);
-      assert.deepEqual(lookups, { class: { one: 'ab', two: 'wk' } });
-    });
-    it('works with whitelist', function() {
-      var lookups = {};
-      htmlUglify.whitelist = [ '.two' ];
-      htmlUglify.pointerizeClass($element, lookups);
-      assert.deepEqual(lookups, { class: { one: 'xz' } });
-    });
-  });
-  describe('#pointerizeIdAndFor', function() {
-    var $element;
-
-    beforeEach(function() {
-      var html = '<p id="one"></p>';
-      var $ = cheerio.load(html);
-
-      $element = $('p').first();
-    });
-
-    it('works with empty lookups', function() {
-      var lookups = {};
-      htmlUglify.pointerizeIdAndFor('id', $element, lookups);
-      assert.deepEqual(lookups, { id: { one: 'xz' } });
-    });
-    it('works with existing lookup', function() {
-      var lookups = { class: { one: 'ab' } };
-      htmlUglify.pointerizeClass($element, lookups);
-      assert.deepEqual(lookups, { class: { one: 'ab' } });
-    });
-    it('works with whitelist', function() {
-      var lookups = {};
-      htmlUglify.whitelist = [ '#one' ];
-      htmlUglify.pointerizeClass($element, lookups);
-      assert.deepEqual(lookups, {});
-    });
-  });
-  describe('#rewriteElements', function() {
-    it('rewrites an id', function() {
-      var html = '<h1 id="abe">Header</h1>';
-      var $ = cheerio.load(html);
-      var results = htmlUglify.rewriteElements($).html();
-      assert.equal(results, '<h1 id="xz">Header</h1>');
-    });
-    it('rewrites a class', function() {
-      var html = '<h1 class="abe">Header</h1>';
-      var $ = cheerio.load(html);
-      var results = htmlUglify.rewriteElements($).html();
-      assert.equal(results, '<h1 class="xz">Header</h1>');
-    });
-    it('rewrites a multiple classes', function() {
-      var html = '<h1 class="foo bar">Header</h1>';
-      var $ = cheerio.load(html);
-      var results = htmlUglify.rewriteElements($).html();
-      assert.equal(results, '<h1 class="xz wk">Header</h1>');
-    });
-    it('rewrites a multiple classes with more than one space between them', function() {
-      var html = '<h1 class="foo   bar">Header</h1>';
-      var $ = cheerio.load(html);
-      var results = htmlUglify.rewriteElements($).html();
-      assert.equal(results, '<h1 class="xz wk">Header</h1>');
-    });
-    it('rewrites a for', function() {
-      var html = '<label for="abe">Label</h1>';
-      var $ = cheerio.load(html);
-      var results = htmlUglify.rewriteElements($).html();
-      assert.equal(results, '<label for="xz">Label</label>');
-    });
-    it('rewrites multiple nested ids, classes, and fors', function() {
-      var html = '<h1 id="header">Header <strong id="strong"><span id="span">1</span></strong></h1><label for="something">Something</label><label for="null">null</label><div class="some classes">Some Classes</div>';
-      var $ = cheerio.load(html);
-      var results = htmlUglify.rewriteElements($).html();
-      assert.equal(results, '<h1 id="xz">Header <strong id="wk"><span id="en">1</span></strong></h1><label for="km">Something</label><label for="dj">null</label><div class="yw qr">Some Classes</div>');
-    });
-    it('rewrites ids and labels to match when matching', function() {
-      var html = '<h1 id="header">Header</h1><label for="header">Something</label><label for="header">Other</label>';
-      var $ = cheerio.load(html);
-      var results = htmlUglify.rewriteElements($).html();
-      assert.equal(results, '<h1 id="xz">Header</h1><label for="xz">Something</label><label for="xz">Other</label>');
-    });
-    it('rewrites multiple uses of the same class to the correct value', function() {
-      var html = '<h1 class="header">Header</h1><label class="header">Something</label><div class="header">Other</div>';
-      var $ = cheerio.load(html);
-      var results = htmlUglify.rewriteElements($).html();
-      assert.equal(results, '<h1 class="xz">Header</h1><label class="xz">Something</label><div class="xz">Other</div>');
-    });
-    it('rewrites multiple uses of the same class to the correct value', function() {
-      var html = '<h1 class="header">Header</h1><label class="header">Something</label><div class="other">Other</div><div class="again">Again</div>';
-      var $ = cheerio.load(html);
-      var results = htmlUglify.rewriteElements($).html();
-      assert.equal(results, '<h1 class="xz">Header</h1><label class="xz">Something</label><div class="wk">Other</div><div class="en">Again</div>');
-    });
-    it('rewrites other class combinations', function() {
-      var html = '<h1 class="header other">Header</h1><label class="header">Something</label><div class="other">Other</div><div class="again">Again</div>';
-      var $ = cheerio.load(html);
-      var results = htmlUglify.rewriteElements($).html();
-      assert.equal(results, '<h1 class="xz wk">Header</h1><label class="xz">Something</label><div class="wk">Other</div><div class="en">Again</div>');
-    });
-  });
-
-  describe('#insertLookup', function() {
-    var lookups;
-
-    beforeEach(function() {
-      lookups = {};
-    });
-
-    it('updates lookups', function() {
-      htmlUglify.insertLookup('class', 'testClass', 'xz', lookups);
-      assert.equal(lookups['class'].testClass, 'xz');
-    });
-  });
+  // describe('#isWhitelisted', function() {
+  //   var whitelist;
+  //   var htmlUglify;
+  //
+  //   beforeEach(function() {
+  //     whitelist = ['#theid', '.theclass', '#★', '.★'];
+  //     htmlUglify = new HTMLUglify({whitelist: whitelist});
+  //   });
+  //   it('returns true if id is in whitelist', function() {
+  //     var whitelisted = htmlUglify.isWhitelisted('id', 'theid');
+  //     assert.isTrue(whitelisted);
+  //   });
+  //   it('returns false if id is in the whitelist but only checking for classes', function() {
+  //     var whitelisted = htmlUglify.isWhitelisted('class', 'theid');
+  //     assert.isFalse(whitelisted);
+  //   });
+  //   it('returns true if class is in whitelist', function() {
+  //     var whitelisted = htmlUglify.isWhitelisted('class', 'theclass');
+  //     assert.isTrue(whitelisted);
+  //   });
+  //   it('returns true if id is in whitelist for a unicode character', function() {
+  //     var whitelisted = htmlUglify.isWhitelisted('id', '★');
+  //     assert.isTrue(whitelisted);
+  //   });
+  //   it('returns true if class is in whitelist for a unicode character', function() {
+  //     var whitelisted = htmlUglify.isWhitelisted('class', '★');
+  //     assert.isTrue(whitelisted);
+  //   });
+  // });
+  // describe('#checkForStandardPointer', function() {
+  //   it('returns undefined when name not found', function() {
+  //     var lookups = {
+  //       'class': { 'something': 'zzz' }
+  //     };
+  //     var value = 'other';
+  //     var pointer = htmlUglify.checkForStandardPointer(lookups, 'class', value);
+  //
+  //     assert.isUndefined(pointer);
+  //   });
+  //   it('returns pointer when found', function() {
+  //     var lookups = {
+  //       'class': { 'something': 'zzz' }
+  //     };
+  //     var value = 'something';
+  //     var pointer = htmlUglify.checkForStandardPointer(lookups, 'class', value);
+  //
+  //     assert.equal(pointer, 'zzz');
+  //   });
+  // });
+  // describe('#checkForAttributePointer', function() {
+  //   it('returns undefined when not found', function() {
+  //     var lookups = {
+  //       'class': { 'something': 'zzz' }
+  //     };
+  //     var value = 'other';
+  //     var pointer = htmlUglify.checkForAttributePointer(lookups, 'class', value);
+  //
+  //     assert.isUndefined(pointer);
+  //   });
+  //   it('returns the pointer when value contains same string as an existing lookup', function() {
+  //     var lookups = {
+  //       'class': { 'something': 'zzz' }
+  //     };
+  //     var value = 'somethingElse';
+  //     var pointer = htmlUglify.checkForAttributePointer(lookups, 'class', value);
+  //
+  //     assert.equal(pointer, 'zzzElse');
+  //   });
+  // });
+  // describe('#generatePointer', function() {
+  //   it('returns xz for counter 0 lookups', function() {
+  //     var lookups = {};
+  //     var pointer = htmlUglify.generatePointer(lookups);
+  //     assert.equal(pointer, 'xz');
+  //   });
+  //   it('returns wk for 1 lookups', function() {
+  //     var lookups = { 'id': { 'a': 'xz' } };
+  //     var pointer = htmlUglify.generatePointer(lookups);
+  //     assert.equal(pointer, 'wk');
+  //   });
+  //   it('returns en for 2 lookups', function() {
+  //     var lookups = { 'id': { 'a': 'xz' }, 'class': { 'b': 'wk' } };
+  //     var pointer = htmlUglify.generatePointer(lookups);
+  //     assert.equal(pointer, 'en');
+  //   });
+  // });
+  // describe('#pointer', function() {
+  //   it('generates a new pointer', function() {
+  //     var lookups = {};
+  //     var pointer = htmlUglify.pointer('class', 'newClass', {});
+  //     assert.equal(pointer, 'xz', lookups);
+  //   });
+  //   it('generates a new pointer given a different one exists', function() {
+  //     var lookups = {
+  //       'class': { 'otherClass': 'wk' }
+  //     };
+  //     var pointer = htmlUglify.pointer('class', 'newClass', lookups);
+  //     assert.equal(pointer, 'wk', lookups);
+  //   });
+  //   it('generates a new pointer given a different one exists in a different attribute', function() {
+  //     var lookups = {
+  //       'id': { 'someId': 'wk' }
+  //     };
+  //     var pointer = htmlUglify.pointer('class', 'newClass', lookups);
+  //     assert.equal(pointer, 'wk', lookups);
+  //   });
+  //   it('finds an existing class pointer', function() {
+  //     var lookups = {
+  //       'class': { 'someClass': 'xz' }
+  //     };
+  //     var pointer = htmlUglify.pointer('class', 'someClass', lookups);
+  //     assert.equal(pointer, 'xz', lookups);
+  //   });
+  //   it('finds an existing id pointer', function() {
+  //     var lookups = {
+  //       'id': { 'someId': 'en' }
+  //     };
+  //     var pointer = htmlUglify.pointer('id', 'someId', lookups);
+  //     assert.equal(pointer, 'en');
+  //   });
+  //   it('finds a more complex existing pointer', function() {
+  //     var lookups = {
+  //       class: {
+  //         test: 'xz',
+  //         testOther: 'wk',
+  //         otratest: 'en'
+  //       }
+  //     };
+  //     var pointer = htmlUglify.pointer('class', 'test', lookups);
+  //
+  //     assert.equal(pointer, 'xz');
+  //   });
+  // });
+
+  // describe('#rewriteStyles', function() {
+  //   it('rewrites an id given lookups', function() {
+  //     var lookups = { 'id=abe': 'xz' };
+  //     var html = '<style>#abe{ color: red; }</style>';
+  //     var $ = cheerio.load(html);
+  //     var results = htmlUglify.rewriteStyles($, lookups).html();
+  //     assert.equal(results, '<style>#xz{ color: red; }</style>');
+  //   });
+  //   it('rewrites an id', function() {
+  //     var lookups = { };
+  //     var html = '<style>#xz{ color: red; }</style>';
+  //     var $ = cheerio.load(html);
+  //     var results = htmlUglify.rewriteStyles($, lookups).html();
+  //     assert.equal(results, '<style>#xz{ color: red; }</style>');
+  //   });
+  //   it('rewrites an id with the same name as the element', function() {
+  //     var lookups = {'id': {'label': 'ab' }};
+  //     var html = '<style>label#label{ color: blue; }</style>';
+  //     var $ = cheerio.load(html);
+  //     var results = htmlUglify.rewriteStyles($, lookups).html();
+  //     assert.equal(results, '<style>label#ab{ color: blue; }</style>');
+  //   });
+  //   it('rewrites a for= given lookups', function() {
+  //     var lookups = { 'id': {'email': 'ab'} };
+  //     var html = '<style>label[for=email]{ color: blue; }</style>';
+  //     var $ = cheerio.load(html);
+  //     var results = htmlUglify.rewriteStyles($, lookups).html();
+  //     assert.equal(results, "<style>label[for=ab]{ color: blue; }</style>");
+  //   });
+  //   it('does rewrites a for=', function() {
+  //     var lookups = {};
+  //     var html = '<style>label[for=email]{ color: blue; }</style>';
+  //     var $ = cheerio.load(html);
+  //     var results = htmlUglify.rewriteStyles($, lookups).html();
+  //     assert.equal(results, "<style>label[for=xz]{ color: blue; }</style>");
+  //   });
+  //   it('rewrites a for= with quotes given lookups', function() {
+  //     var lookups = { 'id': {'email': 'ab'} };
+  //     var html = '<style>label[for="email"]{ color: blue; }</style>';
+  //     var $ = cheerio.load(html);
+  //     var results = htmlUglify.rewriteStyles($, lookups).html();
+  //     assert.equal(results, '<style>label[for="ab"]{ color: blue; }</style>');
+  //   });
+  //   it('rewrites a for= with the same name as the element', function() {
+  //     var lookups = { 'id': { 'label': 'ab' }};
+  //     var html = '<style>label[for="label"]{ color: blue; }</style>';
+  //     var $ = cheerio.load(html);
+  //     var results = htmlUglify.rewriteStyles($, lookups).html();
+  //     assert.equal(results, '<style>label[for="ab"]{ color: blue; }</style>');
+  //   });
+  //   it('rewrites an id= given lookups', function() {
+  //     var lookups = { 'id': {'email': 'ab'} };
+  //     var html = '<style>label[id=email]{ color: blue; }</style>';
+  //     var $ = cheerio.load(html);
+  //     var results = htmlUglify.rewriteStyles($, lookups).html();
+  //     assert.equal(results, '<style>label[id=ab]{ color: blue; }</style>');
+  //   });
+  //   it('rewrites an id= with quotes given lookups', function() {
+  //     var lookups = { 'id': { 'email': 'ab' } };
+  //     var html = '<style>label[id="email"]{ color: blue; }</style>';
+  //     var $ = cheerio.load(html);
+  //     var results = htmlUglify.rewriteStyles($, lookups).html();
+  //     assert.equal(results, '<style>label[id="ab"]{ color: blue; }</style>');
+  //   });
+  //   it('rewrites an id= with quotes and with the same name as the element', function() {
+  //     var lookups = { 'id': {'label': 'ab'} };
+  //     var html = '<style>label[id="label"]{ color: blue; }</style>';
+  //     var $ = cheerio.load(html);
+  //     var results = htmlUglify.rewriteStyles($, lookups).html();
+  //     assert.equal(results, '<style>label[id="ab"]{ color: blue; }</style>');
+  //   });
+  //   it('rewrites a class given lookups', function() {
+  //     var lookups = { 'class': { 'email': 'ab' }};
+  //     var html = '<style>label.email{ color: blue; }</style>';
+  //     var $ = cheerio.load(html);
+  //     var results = htmlUglify.rewriteStyles($, lookups).html();
+  //     assert.equal(results, '<style>label.ab{ color: blue; }</style>');
+  //   });
+  //   it('rewrites a class with the same name as the element', function() {
+  //     var lookups = { 'class': { 'label': 'ab' }};
+  //     var html = '<style>label.label{ color: blue; }</style>';
+  //     var $ = cheerio.load(html);
+  //     var results = htmlUglify.rewriteStyles($, lookups).html();
+  //     assert.equal(results, '<style>label.ab{ color: blue; }</style>');
+  //   });
+  //   it('rewrites a class= given lookups', function() {
+  //     var lookups = { 'class': { 'email': 'ab' }};
+  //     var html = '<style>form [class=email] { color: blue; }</style>';
+  //     var $ = cheerio.load(html);
+  //     var results = htmlUglify.rewriteStyles($, lookups).html();
+  //     assert.equal(results, "<style>form [class=ab] { color: blue; }</style>");
+  //   });
+  //   it('rewrites multi-selector rule', function() {
+  //     var lookups = { 'class': { 'email': 'ab' }};
+  //     var html = '<style>label.email, a.email { color: blue; }</style>';
+  //     var $ = cheerio.load(html);
+  //     var results = htmlUglify.rewriteStyles($, lookups).html();
+  //     assert.equal(results, '<style>label.ab, a.ab { color: blue; }</style>');
+  //   });
+  //   it('rewrites css media queries', function() {
+  //     var lookups = { 'id': { 'abe': 'wz' }};
+  //
+  //     var html = '<style>@media screen and (max-width: 300px) { #abe{ color: red; } }</style>';
+  //     var $ = cheerio.load(html);
+  //     var results = htmlUglify.rewriteStyles($, lookups).html();
+  //     assert.equal(results, '<style>@media screen and (max-width: 300px) { #wz{ color: red; } }</style>');
+  //   });
+  //   it('rewrites nested css media queries', function() {
+  //     var lookups = { 'id': { 'abe': 'wz' }};
+  //
+  //     var html = '<style>@media { @media screen and (max-width: 300px) { #abe{ color: red; } } }</style>';
+  //     var $ = cheerio.load(html);
+  //     var results = htmlUglify.rewriteStyles($, lookups).html();
+  //     assert.equal(results, '<style>@media { @media screen and (max-width: 300px) { #wz{ color: red; } } }</style>');
+  //   });
+  //   it('handles malformed syntax', function() {
+  //     var html = '<style>@media{.media{background: red}</style>';
+  //     var $ = cheerio.load(html);
+  //     var results = htmlUglify.rewriteStyles($).html();
+  //     assert.equal(results, '<style>@media{.xz{background: red}}</style>');
+  //   });
+  // });
+  //
+  // describe('#pointerizeClass', function() {
+  //   var $element;
+  //
+  //   beforeEach(function() {
+  //     var html = '<p class="one two"></p>';
+  //     var $ = cheerio.load(html);
+  //
+  //     $element = $('p').first();
+  //   });
+  //
+  //   it('works with empty lookups', function() {
+  //     var lookups = {};
+  //     htmlUglify.pointerizeClass($element, lookups);
+  //     assert.deepEqual(lookups, { class: { one: 'xz', two: 'wk' } });
+  //   });
+  //   it('works with single lookup', function() {
+  //     var lookups = { class: { one: 'ab' } };
+  //     htmlUglify.pointerizeClass($element, lookups);
+  //     assert.deepEqual(lookups, { class: { one: 'ab', two: 'wk' } });
+  //   });
+  //   it('works with whitelist', function() {
+  //     var lookups = {};
+  //     htmlUglify.whitelist = [ '.two' ];
+  //     htmlUglify.pointerizeClass($element, lookups);
+  //     assert.deepEqual(lookups, { class: { one: 'xz' } });
+  //   });
+  // });
+  // describe('#pointerizeIdAndFor', function() {
+  //   var $element;
+  //
+  //   beforeEach(function() {
+  //     var html = '<p id="one"></p>';
+  //     var $ = cheerio.load(html);
+  //
+  //     $element = $('p').first();
+  //   });
+  //
+  //   it('works with empty lookups', function() {
+  //     var lookups = {};
+  //     htmlUglify.pointerizeIdAndFor('id', $element, lookups);
+  //     assert.deepEqual(lookups, { id: { one: 'xz' } });
+  //   });
+  //   it('works with existing lookup', function() {
+  //     var lookups = { class: { one: 'ab' } };
+  //     htmlUglify.pointerizeClass($element, lookups);
+  //     assert.deepEqual(lookups, { class: { one: 'ab' } });
+  //   });
+  //   it('works with whitelist', function() {
+  //     var lookups = {};
+  //     htmlUglify.whitelist = [ '#one' ];
+  //     htmlUglify.pointerizeClass($element, lookups);
+  //     assert.deepEqual(lookups, {});
+  //   });
+  // });
+  // describe('#rewriteElements', function() {
+  //   it('rewrites an id', function() {
+  //     var html = '<h1 id="abe">Header</h1>';
+  //     var $ = cheerio.load(html);
+  //     var results = htmlUglify.rewriteElements($).html();
+  //     assert.equal(results, '<h1 id="xz">Header</h1>');
+  //   });
+  //   it('rewrites a class', function() {
+  //     var html = '<h1 class="abe">Header</h1>';
+  //     var $ = cheerio.load(html);
+  //     var results = htmlUglify.rewriteElements($).html();
+  //     assert.equal(results, '<h1 class="xz">Header</h1>');
+  //   });
+  //   it('rewrites a multiple classes', function() {
+  //     var html = '<h1 class="foo bar">Header</h1>';
+  //     var $ = cheerio.load(html);
+  //     var results = htmlUglify.rewriteElements($).html();
+  //     assert.equal(results, '<h1 class="xz wk">Header</h1>');
+  //   });
+  //   it('rewrites a multiple classes with more than one space between them', function() {
+  //     var html = '<h1 class="foo   bar">Header</h1>';
+  //     var $ = cheerio.load(html);
+  //     var results = htmlUglify.rewriteElements($).html();
+  //     assert.equal(results, '<h1 class="xz wk">Header</h1>');
+  //   });
+  //   it('rewrites a for', function() {
+  //     var html = '<label for="abe">Label</h1>';
+  //     var $ = cheerio.load(html);
+  //     var results = htmlUglify.rewriteElements($).html();
+  //     assert.equal(results, '<label for="xz">Label</label>');
+  //   });
+  //   it('rewrites multiple nested ids, classes, and fors', function() {
+  //     var html = '<h1 id="header">Header <strong id="strong"><span id="span">1</span></strong></h1><label for="something">Something</label><label for="null">null</label><div class="some classes">Some Classes</div>';
+  //     var $ = cheerio.load(html);
+  //     var results = htmlUglify.rewriteElements($).html();
+  //     assert.equal(results, '<h1 id="xz">Header <strong id="wk"><span id="en">1</span></strong></h1><label for="km">Something</label><label for="dj">null</label><div class="yw qr">Some Classes</div>');
+  //   });
+  //   it('rewrites ids and labels to match when matching', function() {
+  //     var html = '<h1 id="header">Header</h1><label for="header">Something</label><label for="header">Other</label>';
+  //     var $ = cheerio.load(html);
+  //     var results = htmlUglify.rewriteElements($).html();
+  //     assert.equal(results, '<h1 id="xz">Header</h1><label for="xz">Something</label><label for="xz">Other</label>');
+  //   });
+  //   it('rewrites multiple uses of the same class to the correct value', function() {
+  //     var html = '<h1 class="header">Header</h1><label class="header">Something</label><div class="header">Other</div>';
+  //     var $ = cheerio.load(html);
+  //     var results = htmlUglify.rewriteElements($).html();
+  //     assert.equal(results, '<h1 class="xz">Header</h1><label class="xz">Something</label><div class="xz">Other</div>');
+  //   });
+  //   it('rewrites multiple uses of the same class to the correct value', function() {
+  //     var html = '<h1 class="header">Header</h1><label class="header">Something</label><div class="other">Other</div><div class="again">Again</div>';
+  //     var $ = cheerio.load(html);
+  //     var results = htmlUglify.rewriteElements($).html();
+  //     assert.equal(results, '<h1 class="xz">Header</h1><label class="xz">Something</label><div class="wk">Other</div><div class="en">Again</div>');
+  //   });
+  //   it('rewrites other class combinations', function() {
+  //     var html = '<h1 class="header other">Header</h1><label class="header">Something</label><div class="other">Other</div><div class="again">Again</div>';
+  //     var $ = cheerio.load(html);
+  //     var results = htmlUglify.rewriteElements($).html();
+  //     assert.equal(results, '<h1 class="xz wk">Header</h1><label class="xz">Something</label><div class="wk">Other</div><div class="en">Again</div>');
+  //   });
+  // });
+  //
+  // describe('#insertLookup', function() {
+  //   var lookups;
+  //
+  //   beforeEach(function() {
+  //     lookups = {};
+  //   });
+  //
+  //   it('updates lookups', function() {
+  //     htmlUglify.insertLookup('class', 'testClass', 'xz', lookups);
+  //     assert.equal(lookups['class'].testClass, 'xz');
+  //   });
+  // });
   describe('#process', function() {
-    it('uglifies style and html', function() {
-      var html = htmlUglify.process("<style>.test#other{}</style><p class='test' id='other'></p>");
+    it('uglifies style and html', function(done) {
+      var html = htmlUglify.process("<style>.test#other{}</style><p class='test' id='other'></p>").html;
       assert.equal(html, '<style>.xz#wk{}</style><p class="xz" id="wk"></p>');
     });
-    it('uglifies differently with a different salt', function() {
-      var htmlUglify = new HTMLUglify({salt: 'other'});
-      var html = htmlUglify.process("<style>.demo_class#andID{color: red}</style><div class='demo_class' id='andID'>Welcome to HTML Uglify</div>");
-      assert.equal(html, '<style>.vy#nx{color: red}</style><div class="vy" id="nx">Welcome to HTML Uglify</div>');
-    });
-    it('uglifies media query with no name', function() {
-      var html = htmlUglify.process("<style>@media {.media{ color: red; }}</style><div class='media'>media</div>");
-      assert.equal(html, '<style>@media {.xz{ color: red; }}</style><div class="xz">media</div>');
-    });
-    it('uglifies media queries inside of media queries', function() {
-      var html = htmlUglify.process("<style>@media screen{@media screen{.media-nested{background:red;}}}</style><div class='media-nested'>media-nested</div>");
-      assert.equal(html, '<style>@media screen{@media screen{.xz{background:red;}}}</style><div class="xz">media-nested</div>');
-    });
-    it('uglifies media queries inside of media queries inside of media queries', function() {
-      var html = htmlUglify.process("<style>@media screen{@media screen{@media screen{.media-double-nested{background:red;}}}}</style><div class='media-double-nested'>media-double-nested</div>");
-      assert.equal(html, '<style>@media screen{@media screen{@media screen{.xz{background:red;}}}}</style><div class="xz">media-double-nested</div>');
-    });
-    it('uglifies css inside @supports at-rule', function() {
-      var html = htmlUglify.process("<style>@supports (animation) { .someClass {} }</style><div class='someClass'></div>");
-      assert.equal(html, '<style>@supports (animation) { .xz {} }</style><div class="xz"></div>');
-    });
-    it('uglifies with whitelisting for ids and classes', function() {
-      var whitelist = ['#noform', '.withform'];
-      var htmlUglify = new HTMLUglify({salt: 'use the force harry', whitelist: whitelist});
-      var html = htmlUglify.process("<style>#noform { color: red; } .withform{ color: red } #other{ color: red; }</style><div id='noform' class='noform'>noform</div><div class='withform'>withform</div><div id='other'>other</div>");
-      assert.equal(html, '<style>#noform { color: red; } .withform{ color: red } #xz{ color: red; }</style><div id="noform" class="wk">noform</div><div class="withform">withform</div><div id="xz">other</div>');
-    });
-    it('uglifies a class with a ::before', function() {
-      var html = htmlUglify.process("<style>.before::before{color: red}</style><div class='before'>before</div>");
-      assert.equal(html, '<style>.xz::before{color: red}</style><div class="xz">before</div>');
-    });
-    it('uglifies class attribute selectors', function() {
-      var html = htmlUglify.process('<style>body[yahoo] *[class*=paddingreset] {}</style><div class="paddingreset1">paddingreset1</div>');
-      assert.equal(html, '<style>body[yahoo] *[class*=xz] {}</style><div class="xz1">paddingreset1</div>');
-    });
-    it('uglifies id attribute selectors', function() {
-      var html = htmlUglify.process('<style>body[yahoo] *[id*=paddingreset] { padding:0 !important; }</style><div id="paddingreset1">paddingreset1</div>');
-      assert.equal(html, '<style>body[yahoo] *[id*=xz] { padding:0 !important; }</style><div id="xz1">paddingreset1</div>');
-    });
-    it('uglifies for attribute selectors', function() {
-      var html = htmlUglify.process('<style>body[yahoo] *[id*=paddingreset] { padding:0 !important; }</style><div for="paddingreset1">paddingreset1</div>');
-      assert.equal(html, '<style>body[yahoo] *[id*=xz] { padding:0 !important; }</style><div for="xz1">paddingreset1</div>');
-    });
-    it('uglifies attribute selectors correctly towards the end of a stylesheet', function() {
-      var html = htmlUglify.process("<style>.test{} .alphatest{} *[class*=test]{}</style><p class='alphatest'></p>");
-      assert.equal(html, '<style>.xz{} .alphaxz{} *[class*=xz]{}</style><p class="alphaxz"></p>');
-    });
-    it('uglifies attribute selectors with spaced classes', function() {
-      var html = htmlUglify.process("<style>.test{} .alphatest{} *[class*=test]{}</style><p class='alphatest beta'></p>");
-      assert.equal(html, '<style>.xz{} .alphaxz{} *[class*=xz]{}</style><p class="alphaxz en"></p>');
-    });
+    // it('uglifies differently with a different salt', function() {
+    //   var html = htmlUglify.process("<style>.demo_class#andID{color: red}</style><div class='demo_class' id='andID'>Welcome to HTML Uglify</div>", {salt: 'other'});
+    //   assert.equal(html, '<style>.vy#nx{color: red}</style><div class="vy" id="nx">Welcome to HTML Uglify</div>');
+    // });
+    // it('uglifies media query with no name', function() {
+    //   var html = htmlUglify.process("<style>@media {.media{ color: red; }}</style><div class='media'>media</div>");
+    //   assert.equal(html, '<style>@media {.xz{ color: red; }}</style><div class="xz">media</div>');
+    // });
+    // it('uglifies media queries inside of media queries', function() {
+    //   var html = htmlUglify.process("<style>@media screen{@media screen{.media-nested{background:red;}}}</style><div class='media-nested'>media-nested</div>");
+    //   assert.equal(html, '<style>@media screen{@media screen{.xz{background:red;}}}</style><div class="xz">media-nested</div>');
+    // });
+    // it('uglifies media queries inside of media queries inside of media queries', function() {
+    //   var html = htmlUglify.process("<style>@media screen{@media screen{@media screen{.media-double-nested{background:red;}}}}</style><div class='media-double-nested'>media-double-nested</div>");
+    //   assert.equal(html, '<style>@media screen{@media screen{@media screen{.xz{background:red;}}}}</style><div class="xz">media-double-nested</div>');
+    // });
+    // it('uglifies css inside @supports at-rule', function() {
+    //   var html = htmlUglify.process("<style>@supports (animation) { .someClass {} }</style><div class='someClass'></div>");
+    //   assert.equal(html, '<style>@supports (animation) { .xz {} }</style><div class="xz"></div>');
+    // });
+    // it('uglifies with whitelisting for ids and classes', function() {
+    //   var whitelist = ['#noform', '.withform'];
+    //   var html = htmlUglify.process("<style>#noform { color: red; } .withform{ color: red } #other{ color: red; }</style><div id='noform' class='noform'>noform</div><div class='withform'>withform</div><div id='other'>other</div>", {salt: 'use the force harry', whitelist: whitelist});
+    //   assert.equal(html, '<style>#noform { color: red; } .withform{ color: red } #xz{ color: red; }</style><div id="noform" class="wk">noform</div><div class="withform">withform</div><div id="xz">other</div>');
+    // });
+    // it('uglifies a class with a ::before', function() {
+    //   var html = htmlUglify.process("<style>.before::before{color: red}</style><div class='before'>before</div>");
+    //   assert.equal(html, '<style>.xz::before{color: red}</style><div class="xz">before</div>');
+    // });
+    // it('uglifies class attribute selectors', function() {
+    //   var html = htmlUglify.process('<style>body[yahoo] *[class*=paddingreset] {}</style><div class="paddingreset1">paddingreset1</div>');
+    //   assert.equal(html, '<style>body[yahoo] *[class*=xz] {}</style><div class="xz1">paddingreset1</div>');
+    // });
+    // it('uglifies id attribute selectors', function() {
+    //   var html = htmlUglify.process('<style>body[yahoo] *[id*=paddingreset] { padding:0 !important; }</style><div id="paddingreset1">paddingreset1</div>');
+    //   assert.equal(html, '<style>body[yahoo] *[id*=xz] { padding:0 !important; }</style><div id="xz1">paddingreset1</div>');
+    // });
+    // it('uglifies for attribute selectors', function() {
+    //   var html = htmlUglify.process('<style>body[yahoo] *[id*=paddingreset] { padding:0 !important; }</style><div for="paddingreset1">paddingreset1</div>');
+    //   assert.equal(html, '<style>body[yahoo] *[id*=xz] { padding:0 !important; }</style><div for="xz1">paddingreset1</div>');
+    // });
+    // it('uglifies attribute selectors correctly towards the end of a stylesheet', function() {
+    //   var html = htmlUglify.process("<style>.test{} .alphatest{} *[class*=test]{}</style><p class='alphatest'></p>");
+    //   assert.equal(html, '<style>.xz{} .alphaxz{} *[class*=xz]{}</style><p class="alphaxz"></p>');
+    // });
+    // it('uglifies attribute selectors with spaced classes', function() {
+    //   var html = htmlUglify.process("<style>.test{} .alphatest{} *[class*=test]{}</style><p class='alphatest beta'></p>");
+    //   assert.equal(html, '<style>.xz{} .alphaxz{} *[class*=xz]{}</style><p class="alphaxz en"></p>');
+    // });
   });
 
-  describe('attribute selectors', function() {
-    describe('equal selector', function() {
-      it('uglifies', function() {
-        var html = htmlUglify.process('<style>*[class=test] {}</style><div class="test"></div>');
-        assert.equal(html, '<style>*[class=xz] {}</style><div class="xz"></div>');
-
-        html = htmlUglify.process('<style>*[id=test] {}</style><div id="test"></div>');
-        assert.equal(html, '<style>*[id=xz] {}</style><div id="xz"></div>');
-
-        html = htmlUglify.process('<style>*[id=test] {}</style><div for="test"></div>');
-        assert.equal(html, '<style>*[id=xz] {}</style><div for="xz"></div>');
-      });
-    });
-    describe('anywhere selector', function() {
-      it('uglifies in the middle of a string', function() {
-        var html = htmlUglify.process('<style>*[class*=test] {}</style><div class="ZZtestZZ"></div>');
-        assert.equal(html, '<style>*[class*=xz] {}</style><div class="ZZxzZZ"></div>');
-
-        html = htmlUglify.process('<style>*[id*=test] {}</style><div id="ZZtestZZ"></div>');
-        assert.equal(html, '<style>*[id*=xz] {}</style><div id="ZZxzZZ"></div>');
-
-        html = htmlUglify.process('<style>*[id*=test] {}</style><div for="ZZtestZZ"></div>');
-        assert.equal(html, '<style>*[id*=xz] {}</style><div for="ZZxzZZ"></div>');
-      });
-
-      it('uglifies at the start of a string', function() {
-        var html = htmlUglify.process('<style>*[class*=test] {}</style><div class="testZZ"></div>');
-        assert.equal(html, '<style>*[class*=xz] {}</style><div class="xzZZ"></div>');
-
-        html = htmlUglify.process('<style>*[id*=test] {}</style><div id="testZZ"></div>');
-        assert.equal(html, '<style>*[id*=xz] {}</style><div id="xzZZ"></div>');
-
-        html = htmlUglify.process('<style>*[id*=test] {}</style><div for="testZZ"></div>');
-        assert.equal(html, '<style>*[id*=xz] {}</style><div for="xzZZ"></div>');
-      });
-
-      it('uglifies at the end of a string', function() {
-        var html = htmlUglify.process('<style>*[class*=test] {}</style><div class="ZZtest"></div>');
-        assert.equal(html, '<style>*[class*=xz] {}</style><div class="ZZxz"></div>');
-
-        html = htmlUglify.process('<style>*[id*=test] {}</style><div id="ZZtest"></div>');
-        assert.equal(html, '<style>*[id*=xz] {}</style><div id="ZZxz"></div>');
-
-        html = htmlUglify.process('<style>*[id*=test] {}</style><div for="ZZtest"></div>');
-        assert.equal(html, '<style>*[id*=xz] {}</style><div for="ZZxz"></div>');
-      });
-    });
-    describe('begins with selector', function() {
-      it('uglifies at the start of a string', function() {
-        var html = htmlUglify.process('<style>*[class^=test] {}</style><div class="testZZ"></div>');
-        assert.equal(html, '<style>*[class^=xz] {}</style><div class="xzZZ"></div>');
-
-        html = htmlUglify.process('<style>*[id^=test] {}</style><div id="testZZ"></div>');
-        assert.equal(html, '<style>*[id^=xz] {}</style><div id="xzZZ"></div>');
-
-        html = htmlUglify.process('<style>*[id^=test] {}</style><div for="testZZ"></div>');
-        assert.equal(html, '<style>*[id^=xz] {}</style><div for="xzZZ"></div>');
-      });
-    });
-    describe('ends with selector', function() {
-      it('uglifies at the end of a string', function() {
-        var html = htmlUglify.process('<style>*[class$=test] {}</style><div class="ZZtest"></div>');
-        assert.equal(html, '<style>*[class$=xz] {}</style><div class="ZZxz"></div>');
-
-        html = htmlUglify.process('<style>*[id$=test] {}</style><div id="ZZtest"></div>');
-        assert.equal(html, '<style>*[id$=xz] {}</style><div id="ZZxz"></div>');
-
-        html = htmlUglify.process('<style>*[id$=test] {}</style><div for="ZZtest"></div>');
-        assert.equal(html, '<style>*[id$=xz] {}</style><div for="ZZxz"></div>');
-      });
-    });
-  });
+  // describe('attribute selectors', function() {
+  //   describe('equal selector', function() {
+  //     it('uglifies', function() {
+  //       var html = htmlUglify.process('<style>*[class=test] {}</style><div class="test"></div>');
+  //       assert.equal(html, '<style>*[class=xz] {}</style><div class="xz"></div>');
+  //
+  //       html = htmlUglify.process('<style>*[id=test] {}</style><div id="test"></div>');
+  //       assert.equal(html, '<style>*[id=xz] {}</style><div id="xz"></div>');
+  //
+  //       html = htmlUglify.process('<style>*[id=test] {}</style><div for="test"></div>');
+  //       assert.equal(html, '<style>*[id=xz] {}</style><div for="xz"></div>');
+  //     });
+  //   });
+  //   describe('anywhere selector', function() {
+  //     it('uglifies in the middle of a string', function() {
+  //       var html = htmlUglify.process('<style>*[class*=test] {}</style><div class="ZZtestZZ"></div>');
+  //       assert.equal(html, '<style>*[class*=xz] {}</style><div class="ZZxzZZ"></div>');
+  //
+  //       html = htmlUglify.process('<style>*[id*=test] {}</style><div id="ZZtestZZ"></div>');
+  //       assert.equal(html, '<style>*[id*=xz] {}</style><div id="ZZxzZZ"></div>');
+  //
+  //       html = htmlUglify.process('<style>*[id*=test] {}</style><div for="ZZtestZZ"></div>');
+  //       assert.equal(html, '<style>*[id*=xz] {}</style><div for="ZZxzZZ"></div>');
+  //     });
+  //
+  //     it('uglifies at the start of a string', function() {
+  //       var html = htmlUglify.process('<style>*[class*=test] {}</style><div class="testZZ"></div>');
+  //       assert.equal(html, '<style>*[class*=xz] {}</style><div class="xzZZ"></div>');
+  //
+  //       html = htmlUglify.process('<style>*[id*=test] {}</style><div id="testZZ"></div>');
+  //       assert.equal(html, '<style>*[id*=xz] {}</style><div id="xzZZ"></div>');
+  //
+  //       html = htmlUglify.process('<style>*[id*=test] {}</style><div for="testZZ"></div>');
+  //       assert.equal(html, '<style>*[id*=xz] {}</style><div for="xzZZ"></div>');
+  //     });
+  //
+  //     it('uglifies at the end of a string', function() {
+  //       var html = htmlUglify.process('<style>*[class*=test] {}</style><div class="ZZtest"></div>');
+  //       assert.equal(html, '<style>*[class*=xz] {}</style><div class="ZZxz"></div>');
+  //
+  //       html = htmlUglify.process('<style>*[id*=test] {}</style><div id="ZZtest"></div>');
+  //       assert.equal(html, '<style>*[id*=xz] {}</style><div id="ZZxz"></div>');
+  //
+  //       html = htmlUglify.process('<style>*[id*=test] {}</style><div for="ZZtest"></div>');
+  //       assert.equal(html, '<style>*[id*=xz] {}</style><div for="ZZxz"></div>');
+  //     });
+  //   });
+  //   describe('begins with selector', function() {
+  //     it('uglifies at the start of a string', function() {
+  //       var html = htmlUglify.process('<style>*[class^=test] {}</style><div class="testZZ"></div>');
+  //       assert.equal(html, '<style>*[class^=xz] {}</style><div class="xzZZ"></div>');
+  //
+  //       html = htmlUglify.process('<style>*[id^=test] {}</style><div id="testZZ"></div>');
+  //       assert.equal(html, '<style>*[id^=xz] {}</style><div id="xzZZ"></div>');
+  //
+  //       html = htmlUglify.process('<style>*[id^=test] {}</style><div for="testZZ"></div>');
+  //       assert.equal(html, '<style>*[id^=xz] {}</style><div for="xzZZ"></div>');
+  //     });
+  //   });
+  //   describe('ends with selector', function() {
+  //     it('uglifies at the end of a string', function() {
+  //       var html = htmlUglify.process('<style>*[class$=test] {}</style><div class="ZZtest"></div>');
+  //       assert.equal(html, '<style>*[class$=xz] {}</style><div class="ZZxz"></div>');
+  //
+  //       html = htmlUglify.process('<style>*[id$=test] {}</style><div id="ZZtest"></div>');
+  //       assert.equal(html, '<style>*[id$=xz] {}</style><div id="ZZxz"></div>');
+  //
+  //       html = htmlUglify.process('<style>*[id$=test] {}</style><div for="ZZtest"></div>');
+  //       assert.equal(html, '<style>*[id$=xz] {}</style><div for="ZZxz"></div>');
+  //     });
+  //   });
+  // });
 });

From 1576d03421156ba3a87a99297e573c6b53df0515 Mon Sep 17 00:00:00 2001
From: Devin Torres <devin@devintorr.es>
Date: Tue, 2 Feb 2016 10:39:58 -0600
Subject: [PATCH 2/3] Finish migrating to PostHTML plugin

---
 lib/main.js       |   67 ++-
 package.json      |    3 +-
 test/benchmark.js |   23 +-
 test/main.js      | 1006 ++++++++++++++++++++++-----------------------
 4 files changed, 541 insertions(+), 558 deletions(-)

diff --git a/lib/main.js b/lib/main.js
index 1caee08..7e3d9ac 100644
--- a/lib/main.js
+++ b/lib/main.js
@@ -18,11 +18,11 @@ function HTMLUglify(config) {
   this.whitelist = config.whitelist || [];
 }
 
-HTMLUglify.prototype.checkForStandardPointer = function(lookups, type, value) {
+HTMLUglify.prototype.checkForStandardPointer = function(type, value, lookups) {
   return lookups[type] && lookups[type][value];
 };
 
-HTMLUglify.prototype.checkForAttributePointer = function(lookups, type, value) {
+HTMLUglify.prototype.checkForAttributePointer = function(type, value, lookups) {
   var typeLookups = lookups[type] || {};
   var keys = Object.keys(typeLookups);
   var pointer;
@@ -47,8 +47,8 @@ HTMLUglify.prototype.generatePointer = function(lookups) {
 };
 
 HTMLUglify.prototype.pointer = function(type, value, lookups) {
-  return this.checkForStandardPointer(lookups, type, value) ||
-    this.checkForAttributePointer(lookups, type, value) ||
+  return this.checkForStandardPointer(type, value, lookups) ||
+    this.checkForAttributePointer(type, value, lookups) ||
     this.generatePointer(lookups);
 };
 
@@ -69,12 +69,12 @@ HTMLUglify.prototype.createLookup = function(type, value, lookups) {
 };
 
 HTMLUglify.prototype.isWhitelisted = function(type, value) {
-  switch(type) {
+  switch (type) {
     case 'class':
-      value = ['.', value].join('');
+      value = '.' + value;
       break;
     case 'id':
-      value = ['#', value].join('');
+      value = '#' + value;
       break;
     default:
       break;
@@ -85,25 +85,25 @@ HTMLUglify.prototype.isWhitelisted = function(type, value) {
 
 HTMLUglify.prototype.pointerizeClass = function(node, lookups) {
   var self = this;
-  var value = node.attrs.class;
+  var classes = node.attrs.class;
 
-  if (value) {
-    var newClasses = value.split(/\s+/).map(function(value) {
-      return self.createLookup('class', value, lookups);
-    }).join(' ');
+  if (classes) {
+    node.attrs.class = classes.split(/\s+/).map(function(value) {
+      var pointer = self.createLookup('class', value, lookups);
+      if (pointer) {
+        return pointer;
+      }
 
-    node.attrs.class = newClasses;
+      return value;
+    }).join(' ');
   }
 };
 
 HTMLUglify.prototype.pointerizeIdAndFor = function(type, node, lookups) {
-  // var value = node.attrs[type];
-  // var pointer = this.createLookup('id', value, lookups);
-  // if (pointer) {
-  //   node.attrs[type] = pointer;
-  // }
   var pointer = this.createLookup('id', node.attrs[type], lookups);
-  node.attrs[type] = pointer;
+  if (pointer) {
+    node.attrs[type] = pointer;
+  }
 };
 
 HTMLUglify.prototype.processRules = function(rules, lookups) {
@@ -118,13 +118,13 @@ HTMLUglify.prototype.processRules = function(rules, lookups) {
         selectors.eachInside(function(selector) {
           var pointer;
 
-          if ((selector.type === 'id')
+          if ((selector.type === 'class')
+              || (selector.type === 'attribute' && selector.attribute === 'class')) {
+            pointer = self.createLookup('class', selector.value, lookups);
+          } else if ((selector.type === 'id')
               || (selector.type === 'attribute' && selector.attribute === 'id')
               || (selector.type === 'attribute' && selector.attribute === 'for')) {
             pointer = self.createLookup('id', selector.value, lookups);
-          } else if ((selector.type === 'class')
-              || (selector.type === 'attribute' && selector.attribute === 'class')) {
-            pointer = self.createLookup('class', selector.value, lookups);
           }
 
           if (pointer) {
@@ -143,19 +143,12 @@ HTMLUglify.prototype.rewriteElements = function(tree, lookups) {
 
   lookups = lookups || {};
 
-  // $('*[id]').each(function() {
-  //   self.pointerizeIdAndFor('id', $(this), lookups);
-  // });
-  //
-  // $('*[for]').each(function() {
-  //   self.pointerizeIdAndFor('for', $(this), lookups);
-  // });
-  //
-  // $('*[class]').each(function() {
-  //   self.pointerizeClass($(this), lookups);
-  // });
   return tree.walk(function(node) {
     if (node.attrs) {
+      if (node.attrs.class) {
+        self.pointerizeClass(node, lookups);
+      }
+
       if (node.attrs.id) {
         self.pointerizeIdAndFor('id', node, lookups);
       }
@@ -163,10 +156,6 @@ HTMLUglify.prototype.rewriteElements = function(tree, lookups) {
       if (node.attrs.for) {
         self.pointerizeIdAndFor('for', node, lookups);
       }
-
-      if (node.attrs.class) {
-        self.pointerizeClass(node, lookups);
-      }
     }
     return node;
   });
@@ -202,6 +191,8 @@ module.exports = function(options) {
   }
 };
 
+module.exports.HTMLUglify = HTMLUglify;
+
 module.exports.process = function(html, options) {
 	return posthtml().use(module.exports(options)).process(html, { sync: true });
 };
diff --git a/package.json b/package.json
index 2bb06f3..1095aa8 100644
--- a/package.json
+++ b/package.json
@@ -21,7 +21,8 @@
     "cheerio": "^0.19.0",
     "hashids": "^1.0.2",
     "postcss-safe-parser": "^1.0.4",
-    "postcss-selector-parser": "^1.3.0"
+    "postcss-selector-parser": "^1.3.0",
+    "posthtml": "^0.8.1"
   },
   "devDependencies": {
     "benchmark": "^2.0.0",
diff --git a/test/benchmark.js b/test/benchmark.js
index b2881de..791e007 100644
--- a/test/benchmark.js
+++ b/test/benchmark.js
@@ -8,15 +8,20 @@ var uglify = require('../lib/main.js');
 var suite = new Benchmark.Suite();
 var htmlUglify = posthtml().use(uglify());
 
-console.log('Running benchmark');
-
 var html = fs.readFileSync('./test/test.html');
 
+console.log('Running benchmark');
+
 suite
-.add('#process', function(done) {
-  htmlUglify.process(html, { sync: true });
-})
-.on('cycle', function(event) {
-  console.log(String(event.target));
-})
-.run({ 'async': true });
+  .add('#process', {
+    defer: true,
+    fn: function(deferred) {
+      htmlUglify.process(html).then(function() {
+        deferred.resolve();
+      });
+    }
+  })
+  .on('cycle', function(event) {
+    console.log(String(event.target));
+  })
+  .run({ async: true });
diff --git a/test/main.js b/test/main.js
index e5d69cd..9a219cf 100644
--- a/test/main.js
+++ b/test/main.js
@@ -1,521 +1,507 @@
 'use strict';
 
 var assert = require('chai').assert;
-var htmlUglify = require('../lib/main.js');
+
+var parser = require('posthtml-parser');
+var render = require('posthtml-render');
+var walk = require('posthtml/lib/api').walk;
+
+var plugin = require('../lib/main');
+var HTMLUglify = plugin.HTMLUglify;
+var htmlUglify = new HTMLUglify();
+
+function parse(html) {
+  var tree = parser(html);
+  tree.walk = walk;
+  return tree;
+}
 
 describe('HTMLUglify', function() {
-  // describe('#isWhitelisted', function() {
-  //   var whitelist;
-  //   var htmlUglify;
-  //
-  //   beforeEach(function() {
-  //     whitelist = ['#theid', '.theclass', '#★', '.★'];
-  //     htmlUglify = new HTMLUglify({whitelist: whitelist});
-  //   });
-  //   it('returns true if id is in whitelist', function() {
-  //     var whitelisted = htmlUglify.isWhitelisted('id', 'theid');
-  //     assert.isTrue(whitelisted);
-  //   });
-  //   it('returns false if id is in the whitelist but only checking for classes', function() {
-  //     var whitelisted = htmlUglify.isWhitelisted('class', 'theid');
-  //     assert.isFalse(whitelisted);
-  //   });
-  //   it('returns true if class is in whitelist', function() {
-  //     var whitelisted = htmlUglify.isWhitelisted('class', 'theclass');
-  //     assert.isTrue(whitelisted);
-  //   });
-  //   it('returns true if id is in whitelist for a unicode character', function() {
-  //     var whitelisted = htmlUglify.isWhitelisted('id', '★');
-  //     assert.isTrue(whitelisted);
-  //   });
-  //   it('returns true if class is in whitelist for a unicode character', function() {
-  //     var whitelisted = htmlUglify.isWhitelisted('class', '★');
-  //     assert.isTrue(whitelisted);
-  //   });
-  // });
-  // describe('#checkForStandardPointer', function() {
-  //   it('returns undefined when name not found', function() {
-  //     var lookups = {
-  //       'class': { 'something': 'zzz' }
-  //     };
-  //     var value = 'other';
-  //     var pointer = htmlUglify.checkForStandardPointer(lookups, 'class', value);
-  //
-  //     assert.isUndefined(pointer);
-  //   });
-  //   it('returns pointer when found', function() {
-  //     var lookups = {
-  //       'class': { 'something': 'zzz' }
-  //     };
-  //     var value = 'something';
-  //     var pointer = htmlUglify.checkForStandardPointer(lookups, 'class', value);
-  //
-  //     assert.equal(pointer, 'zzz');
-  //   });
-  // });
-  // describe('#checkForAttributePointer', function() {
-  //   it('returns undefined when not found', function() {
-  //     var lookups = {
-  //       'class': { 'something': 'zzz' }
-  //     };
-  //     var value = 'other';
-  //     var pointer = htmlUglify.checkForAttributePointer(lookups, 'class', value);
-  //
-  //     assert.isUndefined(pointer);
-  //   });
-  //   it('returns the pointer when value contains same string as an existing lookup', function() {
-  //     var lookups = {
-  //       'class': { 'something': 'zzz' }
-  //     };
-  //     var value = 'somethingElse';
-  //     var pointer = htmlUglify.checkForAttributePointer(lookups, 'class', value);
-  //
-  //     assert.equal(pointer, 'zzzElse');
-  //   });
-  // });
-  // describe('#generatePointer', function() {
-  //   it('returns xz for counter 0 lookups', function() {
-  //     var lookups = {};
-  //     var pointer = htmlUglify.generatePointer(lookups);
-  //     assert.equal(pointer, 'xz');
-  //   });
-  //   it('returns wk for 1 lookups', function() {
-  //     var lookups = { 'id': { 'a': 'xz' } };
-  //     var pointer = htmlUglify.generatePointer(lookups);
-  //     assert.equal(pointer, 'wk');
-  //   });
-  //   it('returns en for 2 lookups', function() {
-  //     var lookups = { 'id': { 'a': 'xz' }, 'class': { 'b': 'wk' } };
-  //     var pointer = htmlUglify.generatePointer(lookups);
-  //     assert.equal(pointer, 'en');
-  //   });
-  // });
-  // describe('#pointer', function() {
-  //   it('generates a new pointer', function() {
-  //     var lookups = {};
-  //     var pointer = htmlUglify.pointer('class', 'newClass', {});
-  //     assert.equal(pointer, 'xz', lookups);
-  //   });
-  //   it('generates a new pointer given a different one exists', function() {
-  //     var lookups = {
-  //       'class': { 'otherClass': 'wk' }
-  //     };
-  //     var pointer = htmlUglify.pointer('class', 'newClass', lookups);
-  //     assert.equal(pointer, 'wk', lookups);
-  //   });
-  //   it('generates a new pointer given a different one exists in a different attribute', function() {
-  //     var lookups = {
-  //       'id': { 'someId': 'wk' }
-  //     };
-  //     var pointer = htmlUglify.pointer('class', 'newClass', lookups);
-  //     assert.equal(pointer, 'wk', lookups);
-  //   });
-  //   it('finds an existing class pointer', function() {
-  //     var lookups = {
-  //       'class': { 'someClass': 'xz' }
-  //     };
-  //     var pointer = htmlUglify.pointer('class', 'someClass', lookups);
-  //     assert.equal(pointer, 'xz', lookups);
-  //   });
-  //   it('finds an existing id pointer', function() {
-  //     var lookups = {
-  //       'id': { 'someId': 'en' }
-  //     };
-  //     var pointer = htmlUglify.pointer('id', 'someId', lookups);
-  //     assert.equal(pointer, 'en');
-  //   });
-  //   it('finds a more complex existing pointer', function() {
-  //     var lookups = {
-  //       class: {
-  //         test: 'xz',
-  //         testOther: 'wk',
-  //         otratest: 'en'
-  //       }
-  //     };
-  //     var pointer = htmlUglify.pointer('class', 'test', lookups);
-  //
-  //     assert.equal(pointer, 'xz');
-  //   });
-  // });
-
-  // describe('#rewriteStyles', function() {
-  //   it('rewrites an id given lookups', function() {
-  //     var lookups = { 'id=abe': 'xz' };
-  //     var html = '<style>#abe{ color: red; }</style>';
-  //     var $ = cheerio.load(html);
-  //     var results = htmlUglify.rewriteStyles($, lookups).html();
-  //     assert.equal(results, '<style>#xz{ color: red; }</style>');
-  //   });
-  //   it('rewrites an id', function() {
-  //     var lookups = { };
-  //     var html = '<style>#xz{ color: red; }</style>';
-  //     var $ = cheerio.load(html);
-  //     var results = htmlUglify.rewriteStyles($, lookups).html();
-  //     assert.equal(results, '<style>#xz{ color: red; }</style>');
-  //   });
-  //   it('rewrites an id with the same name as the element', function() {
-  //     var lookups = {'id': {'label': 'ab' }};
-  //     var html = '<style>label#label{ color: blue; }</style>';
-  //     var $ = cheerio.load(html);
-  //     var results = htmlUglify.rewriteStyles($, lookups).html();
-  //     assert.equal(results, '<style>label#ab{ color: blue; }</style>');
-  //   });
-  //   it('rewrites a for= given lookups', function() {
-  //     var lookups = { 'id': {'email': 'ab'} };
-  //     var html = '<style>label[for=email]{ color: blue; }</style>';
-  //     var $ = cheerio.load(html);
-  //     var results = htmlUglify.rewriteStyles($, lookups).html();
-  //     assert.equal(results, "<style>label[for=ab]{ color: blue; }</style>");
-  //   });
-  //   it('does rewrites a for=', function() {
-  //     var lookups = {};
-  //     var html = '<style>label[for=email]{ color: blue; }</style>';
-  //     var $ = cheerio.load(html);
-  //     var results = htmlUglify.rewriteStyles($, lookups).html();
-  //     assert.equal(results, "<style>label[for=xz]{ color: blue; }</style>");
-  //   });
-  //   it('rewrites a for= with quotes given lookups', function() {
-  //     var lookups = { 'id': {'email': 'ab'} };
-  //     var html = '<style>label[for="email"]{ color: blue; }</style>';
-  //     var $ = cheerio.load(html);
-  //     var results = htmlUglify.rewriteStyles($, lookups).html();
-  //     assert.equal(results, '<style>label[for="ab"]{ color: blue; }</style>');
-  //   });
-  //   it('rewrites a for= with the same name as the element', function() {
-  //     var lookups = { 'id': { 'label': 'ab' }};
-  //     var html = '<style>label[for="label"]{ color: blue; }</style>';
-  //     var $ = cheerio.load(html);
-  //     var results = htmlUglify.rewriteStyles($, lookups).html();
-  //     assert.equal(results, '<style>label[for="ab"]{ color: blue; }</style>');
-  //   });
-  //   it('rewrites an id= given lookups', function() {
-  //     var lookups = { 'id': {'email': 'ab'} };
-  //     var html = '<style>label[id=email]{ color: blue; }</style>';
-  //     var $ = cheerio.load(html);
-  //     var results = htmlUglify.rewriteStyles($, lookups).html();
-  //     assert.equal(results, '<style>label[id=ab]{ color: blue; }</style>');
-  //   });
-  //   it('rewrites an id= with quotes given lookups', function() {
-  //     var lookups = { 'id': { 'email': 'ab' } };
-  //     var html = '<style>label[id="email"]{ color: blue; }</style>';
-  //     var $ = cheerio.load(html);
-  //     var results = htmlUglify.rewriteStyles($, lookups).html();
-  //     assert.equal(results, '<style>label[id="ab"]{ color: blue; }</style>');
-  //   });
-  //   it('rewrites an id= with quotes and with the same name as the element', function() {
-  //     var lookups = { 'id': {'label': 'ab'} };
-  //     var html = '<style>label[id="label"]{ color: blue; }</style>';
-  //     var $ = cheerio.load(html);
-  //     var results = htmlUglify.rewriteStyles($, lookups).html();
-  //     assert.equal(results, '<style>label[id="ab"]{ color: blue; }</style>');
-  //   });
-  //   it('rewrites a class given lookups', function() {
-  //     var lookups = { 'class': { 'email': 'ab' }};
-  //     var html = '<style>label.email{ color: blue; }</style>';
-  //     var $ = cheerio.load(html);
-  //     var results = htmlUglify.rewriteStyles($, lookups).html();
-  //     assert.equal(results, '<style>label.ab{ color: blue; }</style>');
-  //   });
-  //   it('rewrites a class with the same name as the element', function() {
-  //     var lookups = { 'class': { 'label': 'ab' }};
-  //     var html = '<style>label.label{ color: blue; }</style>';
-  //     var $ = cheerio.load(html);
-  //     var results = htmlUglify.rewriteStyles($, lookups).html();
-  //     assert.equal(results, '<style>label.ab{ color: blue; }</style>');
-  //   });
-  //   it('rewrites a class= given lookups', function() {
-  //     var lookups = { 'class': { 'email': 'ab' }};
-  //     var html = '<style>form [class=email] { color: blue; }</style>';
-  //     var $ = cheerio.load(html);
-  //     var results = htmlUglify.rewriteStyles($, lookups).html();
-  //     assert.equal(results, "<style>form [class=ab] { color: blue; }</style>");
-  //   });
-  //   it('rewrites multi-selector rule', function() {
-  //     var lookups = { 'class': { 'email': 'ab' }};
-  //     var html = '<style>label.email, a.email { color: blue; }</style>';
-  //     var $ = cheerio.load(html);
-  //     var results = htmlUglify.rewriteStyles($, lookups).html();
-  //     assert.equal(results, '<style>label.ab, a.ab { color: blue; }</style>');
-  //   });
-  //   it('rewrites css media queries', function() {
-  //     var lookups = { 'id': { 'abe': 'wz' }};
-  //
-  //     var html = '<style>@media screen and (max-width: 300px) { #abe{ color: red; } }</style>';
-  //     var $ = cheerio.load(html);
-  //     var results = htmlUglify.rewriteStyles($, lookups).html();
-  //     assert.equal(results, '<style>@media screen and (max-width: 300px) { #wz{ color: red; } }</style>');
-  //   });
-  //   it('rewrites nested css media queries', function() {
-  //     var lookups = { 'id': { 'abe': 'wz' }};
-  //
-  //     var html = '<style>@media { @media screen and (max-width: 300px) { #abe{ color: red; } } }</style>';
-  //     var $ = cheerio.load(html);
-  //     var results = htmlUglify.rewriteStyles($, lookups).html();
-  //     assert.equal(results, '<style>@media { @media screen and (max-width: 300px) { #wz{ color: red; } } }</style>');
-  //   });
-  //   it('handles malformed syntax', function() {
-  //     var html = '<style>@media{.media{background: red}</style>';
-  //     var $ = cheerio.load(html);
-  //     var results = htmlUglify.rewriteStyles($).html();
-  //     assert.equal(results, '<style>@media{.xz{background: red}}</style>');
-  //   });
-  // });
-  //
-  // describe('#pointerizeClass', function() {
-  //   var $element;
-  //
-  //   beforeEach(function() {
-  //     var html = '<p class="one two"></p>';
-  //     var $ = cheerio.load(html);
-  //
-  //     $element = $('p').first();
-  //   });
-  //
-  //   it('works with empty lookups', function() {
-  //     var lookups = {};
-  //     htmlUglify.pointerizeClass($element, lookups);
-  //     assert.deepEqual(lookups, { class: { one: 'xz', two: 'wk' } });
-  //   });
-  //   it('works with single lookup', function() {
-  //     var lookups = { class: { one: 'ab' } };
-  //     htmlUglify.pointerizeClass($element, lookups);
-  //     assert.deepEqual(lookups, { class: { one: 'ab', two: 'wk' } });
-  //   });
-  //   it('works with whitelist', function() {
-  //     var lookups = {};
-  //     htmlUglify.whitelist = [ '.two' ];
-  //     htmlUglify.pointerizeClass($element, lookups);
-  //     assert.deepEqual(lookups, { class: { one: 'xz' } });
-  //   });
-  // });
-  // describe('#pointerizeIdAndFor', function() {
-  //   var $element;
-  //
-  //   beforeEach(function() {
-  //     var html = '<p id="one"></p>';
-  //     var $ = cheerio.load(html);
-  //
-  //     $element = $('p').first();
-  //   });
-  //
-  //   it('works with empty lookups', function() {
-  //     var lookups = {};
-  //     htmlUglify.pointerizeIdAndFor('id', $element, lookups);
-  //     assert.deepEqual(lookups, { id: { one: 'xz' } });
-  //   });
-  //   it('works with existing lookup', function() {
-  //     var lookups = { class: { one: 'ab' } };
-  //     htmlUglify.pointerizeClass($element, lookups);
-  //     assert.deepEqual(lookups, { class: { one: 'ab' } });
-  //   });
-  //   it('works with whitelist', function() {
-  //     var lookups = {};
-  //     htmlUglify.whitelist = [ '#one' ];
-  //     htmlUglify.pointerizeClass($element, lookups);
-  //     assert.deepEqual(lookups, {});
-  //   });
-  // });
-  // describe('#rewriteElements', function() {
-  //   it('rewrites an id', function() {
-  //     var html = '<h1 id="abe">Header</h1>';
-  //     var $ = cheerio.load(html);
-  //     var results = htmlUglify.rewriteElements($).html();
-  //     assert.equal(results, '<h1 id="xz">Header</h1>');
-  //   });
-  //   it('rewrites a class', function() {
-  //     var html = '<h1 class="abe">Header</h1>';
-  //     var $ = cheerio.load(html);
-  //     var results = htmlUglify.rewriteElements($).html();
-  //     assert.equal(results, '<h1 class="xz">Header</h1>');
-  //   });
-  //   it('rewrites a multiple classes', function() {
-  //     var html = '<h1 class="foo bar">Header</h1>';
-  //     var $ = cheerio.load(html);
-  //     var results = htmlUglify.rewriteElements($).html();
-  //     assert.equal(results, '<h1 class="xz wk">Header</h1>');
-  //   });
-  //   it('rewrites a multiple classes with more than one space between them', function() {
-  //     var html = '<h1 class="foo   bar">Header</h1>';
-  //     var $ = cheerio.load(html);
-  //     var results = htmlUglify.rewriteElements($).html();
-  //     assert.equal(results, '<h1 class="xz wk">Header</h1>');
-  //   });
-  //   it('rewrites a for', function() {
-  //     var html = '<label for="abe">Label</h1>';
-  //     var $ = cheerio.load(html);
-  //     var results = htmlUglify.rewriteElements($).html();
-  //     assert.equal(results, '<label for="xz">Label</label>');
-  //   });
-  //   it('rewrites multiple nested ids, classes, and fors', function() {
-  //     var html = '<h1 id="header">Header <strong id="strong"><span id="span">1</span></strong></h1><label for="something">Something</label><label for="null">null</label><div class="some classes">Some Classes</div>';
-  //     var $ = cheerio.load(html);
-  //     var results = htmlUglify.rewriteElements($).html();
-  //     assert.equal(results, '<h1 id="xz">Header <strong id="wk"><span id="en">1</span></strong></h1><label for="km">Something</label><label for="dj">null</label><div class="yw qr">Some Classes</div>');
-  //   });
-  //   it('rewrites ids and labels to match when matching', function() {
-  //     var html = '<h1 id="header">Header</h1><label for="header">Something</label><label for="header">Other</label>';
-  //     var $ = cheerio.load(html);
-  //     var results = htmlUglify.rewriteElements($).html();
-  //     assert.equal(results, '<h1 id="xz">Header</h1><label for="xz">Something</label><label for="xz">Other</label>');
-  //   });
-  //   it('rewrites multiple uses of the same class to the correct value', function() {
-  //     var html = '<h1 class="header">Header</h1><label class="header">Something</label><div class="header">Other</div>';
-  //     var $ = cheerio.load(html);
-  //     var results = htmlUglify.rewriteElements($).html();
-  //     assert.equal(results, '<h1 class="xz">Header</h1><label class="xz">Something</label><div class="xz">Other</div>');
-  //   });
-  //   it('rewrites multiple uses of the same class to the correct value', function() {
-  //     var html = '<h1 class="header">Header</h1><label class="header">Something</label><div class="other">Other</div><div class="again">Again</div>';
-  //     var $ = cheerio.load(html);
-  //     var results = htmlUglify.rewriteElements($).html();
-  //     assert.equal(results, '<h1 class="xz">Header</h1><label class="xz">Something</label><div class="wk">Other</div><div class="en">Again</div>');
-  //   });
-  //   it('rewrites other class combinations', function() {
-  //     var html = '<h1 class="header other">Header</h1><label class="header">Something</label><div class="other">Other</div><div class="again">Again</div>';
-  //     var $ = cheerio.load(html);
-  //     var results = htmlUglify.rewriteElements($).html();
-  //     assert.equal(results, '<h1 class="xz wk">Header</h1><label class="xz">Something</label><div class="wk">Other</div><div class="en">Again</div>');
-  //   });
-  // });
-  //
-  // describe('#insertLookup', function() {
-  //   var lookups;
-  //
-  //   beforeEach(function() {
-  //     lookups = {};
-  //   });
-  //
-  //   it('updates lookups', function() {
-  //     htmlUglify.insertLookup('class', 'testClass', 'xz', lookups);
-  //     assert.equal(lookups['class'].testClass, 'xz');
-  //   });
-  // });
+  describe('#isWhitelisted', function() {
+    var whitelist;
+
+    beforeEach(function() {
+      whitelist = ['#theid', '.theclass', '#★', '.★'];
+      htmlUglify = new HTMLUglify({whitelist: whitelist});
+    });
+    it('returns true if id is in whitelist', function() {
+      var whitelisted = htmlUglify.isWhitelisted('id', 'theid');
+      assert.isTrue(whitelisted);
+    });
+    it('returns false if id is in the whitelist but only checking for classes', function() {
+      var whitelisted = htmlUglify.isWhitelisted('class', 'theid');
+      assert.isFalse(whitelisted);
+    });
+    it('returns true if class is in whitelist', function() {
+      var whitelisted = htmlUglify.isWhitelisted('class', 'theclass');
+      assert.isTrue(whitelisted);
+    });
+    it('returns true if id is in whitelist for a unicode character', function() {
+      var whitelisted = htmlUglify.isWhitelisted('id', '★');
+      assert.isTrue(whitelisted);
+    });
+    it('returns true if class is in whitelist for a unicode character', function() {
+      var whitelisted = htmlUglify.isWhitelisted('class', '★');
+      assert.isTrue(whitelisted);
+    });
+  });
+
+  describe('#checkForStandardPointer', function() {
+    it('returns undefined when name not found', function() {
+      var lookups = {
+        'class': { 'something': 'zzz' }
+      };
+      var value = 'other';
+      var pointer = htmlUglify.checkForStandardPointer('class', value, lookups);
+
+      assert.isUndefined(pointer);
+    });
+    it('returns pointer when found', function() {
+      var lookups = {
+        'class': { 'something': 'zzz' }
+      };
+      var value = 'something';
+      var pointer = htmlUglify.checkForStandardPointer('class', value, lookups);
+
+      assert.equal(pointer, 'zzz');
+    });
+  });
+
+  describe('#checkForAttributePointer', function() {
+    it('returns undefined when not found', function() {
+      var lookups = {
+        'class': { 'something': 'zzz' }
+      };
+      var value = 'other';
+      var pointer = htmlUglify.checkForAttributePointer('class', value, lookups);
+
+      assert.isUndefined(pointer);
+    });
+    it('returns the pointer when value contains same string as an existing lookup', function() {
+      var lookups = {
+        'class': { 'something': 'zzz' }
+      };
+      var value = 'somethingElse';
+      var pointer = htmlUglify.checkForAttributePointer('class', value, lookups);
+
+      assert.equal(pointer, 'zzzElse');
+    });
+  });
+
+  describe('#insertLookup', function() {
+    var lookups;
+
+    beforeEach(function() {
+      lookups = {};
+    });
+
+    it('updates lookups', function() {
+      htmlUglify.insertLookup('class', 'testClass', 'xz', lookups);
+      assert.equal(lookups['class'].testClass, 'xz');
+    });
+  });
+
+  describe('#generatePointer', function() {
+    it('returns xz for counter 0 lookups', function() {
+      var lookups = {};
+      var pointer = htmlUglify.generatePointer(lookups);
+      assert.equal(pointer, 'xz');
+    });
+    it('returns wk for 1 lookups', function() {
+      var lookups = { 'id': { 'a': 'xz' } };
+      var pointer = htmlUglify.generatePointer(lookups);
+      assert.equal(pointer, 'wk');
+    });
+    it('returns en for 2 lookups', function() {
+      var lookups = { 'id': { 'a': 'xz' }, 'class': { 'b': 'wk' } };
+      var pointer = htmlUglify.generatePointer(lookups);
+      assert.equal(pointer, 'en');
+    });
+  });
+
+  describe('#pointer', function() {
+    it('generates a new pointer', function() {
+      var lookups = {};
+      var pointer = htmlUglify.pointer('class', 'newClass', {});
+      assert.equal(pointer, 'xz', lookups);
+    });
+    it('generates a new pointer given a different one exists', function() {
+      var lookups = {
+        'class': { 'otherClass': 'wk' }
+      };
+      var pointer = htmlUglify.pointer('class', 'newClass', lookups);
+      assert.equal(pointer, 'wk', lookups);
+    });
+    it('generates a new pointer given a different one exists in a different attribute', function() {
+      var lookups = {
+        'id': { 'someId': 'wk' }
+      };
+      var pointer = htmlUglify.pointer('class', 'newClass', lookups);
+      assert.equal(pointer, 'wk', lookups);
+    });
+    it('finds an existing class pointer', function() {
+      var lookups = {
+        'class': { 'someClass': 'xz' }
+      };
+      var pointer = htmlUglify.pointer('class', 'someClass', lookups);
+      assert.equal(pointer, 'xz', lookups);
+    });
+    it('finds an existing id pointer', function() {
+      var lookups = {
+        'id': { 'someId': 'en' }
+      };
+      var pointer = htmlUglify.pointer('id', 'someId', lookups);
+      assert.equal(pointer, 'en');
+    });
+    it('finds a more complex existing pointer', function() {
+      var lookups = {
+        class: {
+          test: 'xz',
+          testOther: 'wk',
+          otratest: 'en'
+        }
+      };
+      var pointer = htmlUglify.pointer('class', 'test', lookups);
+      assert.equal(pointer, 'xz');
+    });
+  });
+
+  describe('#pointerizeIdAndFor', function() {
+    var node;
+
+    beforeEach(function() {
+      var html = '<p id="one"></p>';
+      node = parse(html)[0];
+    });
+
+    it('works with empty lookups', function() {
+      var lookups = {};
+      htmlUglify.pointerizeIdAndFor('id', node, lookups);
+      assert.deepEqual(lookups, { id: { one: 'xz' } });
+    });
+    it('works with existing lookup', function() {
+      var lookups = { class: { one: 'ab' } };
+      htmlUglify.pointerizeClass(node, lookups);
+      assert.deepEqual(lookups, { class: { one: 'ab' } });
+    });
+    it('works with whitelist', function() {
+      var lookups = {};
+      htmlUglify.whitelist = [ '#one' ];
+      htmlUglify.pointerizeClass(node, lookups);
+      assert.deepEqual(lookups, {});
+    });
+  });
+
+
+    describe('#pointerizeClass', function() {
+      var node;
+
+      beforeEach(function() {
+        var html = '<p class="one two"></p>';
+        node = parse(html)[0];
+      });
+
+      it('works with empty lookups', function() {
+        var lookups = {};
+        htmlUglify.pointerizeClass(node, lookups);
+        assert.deepEqual(lookups, { class: { one: 'xz', two: 'wk' } });
+      });
+      it('works with single lookup', function() {
+        var lookups = { class: { one: 'ab' } };
+        htmlUglify.pointerizeClass(node, lookups);
+        assert.deepEqual(lookups, { class: { one: 'ab', two: 'wk' } });
+      });
+      it('works with whitelist', function() {
+        var lookups = {};
+        htmlUglify.whitelist = ['.two'];
+        htmlUglify.pointerizeClass(node, lookups);
+        assert.deepEqual(lookups, { class: { one: 'xz' } });
+      });
+    });
+
+  describe('#rewriteStyles', function() {
+    it('rewrites an id given lookups', function() {
+      var lookups = { 'id': { 'foo': 'bar' } };
+      var html = '<style>#foo{ color: red; }</style>';
+      var result = htmlUglify.rewriteStyles(parse(html), lookups);
+      assert.equal(render(result), '<style>#bar{ color: red; }</style>');
+    });
+    it('rewrites an id', function() {
+      var lookups = { };
+      var html = '<style>#xz{ color: red; }</style>';
+      var result = htmlUglify.rewriteStyles(parse(html), lookups);
+      assert.equal(render(result), '<style>#xz{ color: red; }</style>');
+    });
+    it('rewrites an id with the same name as the element', function() {
+      var lookups = {'id': {'label': 'ab' }};
+      var html = '<style>label#label{ color: blue; }</style>';
+      var result = htmlUglify.rewriteStyles(parse(html), lookups);
+      assert.equal(render(result), '<style>label#ab{ color: blue; }</style>');
+    });
+    it('rewrites a for= given lookups', function() {
+      var lookups = { 'id': {'email': 'ab'} };
+      var html = '<style>label[for=email]{ color: blue; }</style>';
+      var result = htmlUglify.rewriteStyles(parse(html), lookups);
+      assert.equal(render(result), "<style>label[for=ab]{ color: blue; }</style>");
+    });
+    it('rewrites a for=', function() {
+      var lookups = {};
+      var html = '<style>label[for=email]{ color: blue; }</style>';
+      var result = htmlUglify.rewriteStyles(parse(html), lookups);
+      assert.equal(render(result), "<style>label[for=xz]{ color: blue; }</style>");
+    });
+    it('rewrites a for= with quotes given lookups', function() {
+      var lookups = { 'id': {'email': 'ab'} };
+      var html = '<style>label[for="email"]{ color: blue; }</style>';
+      var result = htmlUglify.rewriteStyles(parse(html), lookups);
+      assert.equal(render(result), '<style>label[for="ab"]{ color: blue; }</style>');
+    });
+    it('rewrites a for= with the same name as the element', function() {
+      var lookups = { 'id': { 'label': 'ab' }};
+      var html = '<style>label[for="label"]{ color: blue; }</style>';
+      var result = htmlUglify.rewriteStyles(parse(html), lookups);
+      assert.equal(render(result), '<style>label[for="ab"]{ color: blue; }</style>');
+    });
+    it('rewrites an id= given lookups', function() {
+      var lookups = { 'id': {'email': 'ab'} };
+      var html = '<style>label[id=email]{ color: blue; }</style>';
+      var result = htmlUglify.rewriteStyles(parse(html), lookups);
+      assert.equal(render(result), '<style>label[id=ab]{ color: blue; }</style>');
+    });
+    it('rewrites an id= with quotes given lookups', function() {
+      var lookups = { 'id': { 'email': 'ab' } };
+      var html = '<style>label[id="email"]{ color: blue; }</style>';
+      var result = htmlUglify.rewriteStyles(parse(html), lookups);
+      assert.equal(render(result), '<style>label[id="ab"]{ color: blue; }</style>');
+    });
+    it('rewrites an id= with quotes and with the same name as the element', function() {
+      var lookups = { 'id': {'label': 'ab'} };
+      var html = '<style>label[id="label"]{ color: blue; }</style>';
+      var result = htmlUglify.rewriteStyles(parse(html), lookups);
+      assert.equal(render(result), '<style>label[id="ab"]{ color: blue; }</style>');
+    });
+    it('rewrites a class given lookups', function() {
+      var lookups = { 'class': { 'email': 'ab' }};
+      var html = '<style>label.email{ color: blue; }</style>';
+      var result = htmlUglify.rewriteStyles(parse(html), lookups);
+      assert.equal(render(result), '<style>label.ab{ color: blue; }</style>');
+    });
+    it('rewrites a class with the same name as the element', function() {
+      var lookups = { 'class': { 'label': 'ab' }};
+      var html = '<style>label.label{ color: blue; }</style>';
+      var result = htmlUglify.rewriteStyles(parse(html), lookups);
+      assert.equal(render(result), '<style>label.ab{ color: blue; }</style>');
+    });
+    it('rewrites a class= given lookups', function() {
+      var lookups = { 'class': { 'email': 'ab' }};
+      var html = '<style>form [class=email] { color: blue; }</style>';
+      var result = htmlUglify.rewriteStyles(parse(html), lookups);
+      assert.equal(render(result), "<style>form [class=ab] { color: blue; }</style>");
+    });
+    it('rewrites multi-selector rule', function() {
+      var lookups = { 'class': { 'email': 'ab' }};
+      var html = '<style>label.email, a.email { color: blue; }</style>';
+      var result = htmlUglify.rewriteStyles(parse(html), lookups);
+      assert.equal(render(result), '<style>label.ab, a.ab { color: blue; }</style>');
+    });
+    it('rewrites css media queries', function() {
+      var lookups = { 'id': { 'abe': 'wz' }};
+      var html = '<style>@media screen and (max-width: 300px) { #abe{ color: red; } }</style>';
+      var result = htmlUglify.rewriteStyles(parse(html), lookups);
+      assert.equal(render(result), '<style>@media screen and (max-width: 300px) { #wz{ color: red; } }</style>');
+    });
+    it('rewrites nested css media queries', function() {
+      var lookups = { 'id': { 'abe': 'wz' }};
+      var html = '<style>@media { @media screen and (max-width: 300px) { #abe{ color: red; } } }</style>';
+      var result = htmlUglify.rewriteStyles(parse(html), lookups);
+      assert.equal(render(result), '<style>@media { @media screen and (max-width: 300px) { #wz{ color: red; } } }</style>');
+    });
+    it('handles malformed syntax', function() {
+      var html = '<style>@media{.media{background: red}</style>';
+      var result = htmlUglify.rewriteStyles(parse(html));
+      assert.equal(render(result), '<style>@media{.xz{background: red}}</style>');
+    });
+  });
+
+  describe('#rewriteElements', function() {
+    it('rewrites an id', function() {
+      var html = '<h1 id="abe">Header</h1>';
+      var result = htmlUglify.rewriteElements(parse(html));
+      assert.equal(render(result), '<h1 id="xz">Header</h1>');
+    });
+    it('rewrites a class', function() {
+      var html = '<h1 class="abe">Header</h1>';
+      var result = htmlUglify.rewriteElements(parse(html));
+      assert.equal(render(result), '<h1 class="xz">Header</h1>');
+    });
+    it('rewrites a multiple classes', function() {
+      var html = '<h1 class="foo bar">Header</h1>';
+      var result = htmlUglify.rewriteElements(parse(html));
+      assert.equal(render(result), '<h1 class="xz wk">Header</h1>');
+    });
+    it('rewrites a multiple classes with more than one space between them', function() {
+      var html = '<h1 class="foo   bar">Header</h1>';
+      var result = htmlUglify.rewriteElements(parse(html));
+      assert.equal(render(result), '<h1 class="xz wk">Header</h1>');
+    });
+    it('rewrites a for', function() {
+      var html = '<label for="abe">Label</h1>';
+      var result = htmlUglify.rewriteElements(parse(html));
+      assert.equal(render(result), '<label for="xz">Label</label>');
+    });
+    it('rewrites multiple nested ids, classes, and fors', function() {
+      var html = '<h1 id="header">Header <strong id="strong"><span id="span">1</span></strong></h1><label for="something">Something</label><label for="null">null</label><div class="some classes">Some Classes</div>';
+      var result = htmlUglify.rewriteElements(parse(html));
+      assert.equal(render(result), '<h1 id="xz">Header <strong id="wk"><span id="en">1</span></strong></h1><label for="km">Something</label><label for="dj">null</label><div class="yw qr">Some Classes</div>');
+    });
+    it('rewrites ids and labels to match when matching', function() {
+      var html = '<h1 id="header">Header</h1><label for="header">Something</label><label for="header">Other</label>';
+      var result = htmlUglify.rewriteElements(parse(html));
+      assert.equal(render(result), '<h1 id="xz">Header</h1><label for="xz">Something</label><label for="xz">Other</label>');
+    });
+    it('rewrites multiple uses of the same class to the correct value', function() {
+      var html = '<h1 class="header">Header</h1><label class="header">Something</label><div class="header">Other</div>';
+      var result = htmlUglify.rewriteElements(parse(html));
+      assert.equal(render(result), '<h1 class="xz">Header</h1><label class="xz">Something</label><div class="xz">Other</div>');
+    });
+    it('rewrites multiple uses of the same class to the correct value', function() {
+      var html = '<h1 class="header">Header</h1><label class="header">Something</label><div class="other">Other</div><div class="again">Again</div>';
+      var result = htmlUglify.rewriteElements(parse(html));
+      assert.equal(render(result), '<h1 class="xz">Header</h1><label class="xz">Something</label><div class="wk">Other</div><div class="en">Again</div>');
+    });
+    it('rewrites other class combinations', function() {
+      var html = '<h1 class="header other">Header</h1><label class="header">Something</label><div class="other">Other</div><div class="again">Again</div>';
+      var result = htmlUglify.rewriteElements(parse(html));
+      assert.equal(render(result), '<h1 class="xz wk">Header</h1><label class="xz">Something</label><div class="wk">Other</div><div class="en">Again</div>');
+    });
+  });
+
   describe('#process', function() {
-    it('uglifies style and html', function(done) {
-      var html = htmlUglify.process("<style>.test#other{}</style><p class='test' id='other'></p>").html;
+    it('uglifies style and html', function() {
+      var html = plugin.process("<style>.test#other{}</style><p class='test' id='other'></p>").html;
       assert.equal(html, '<style>.xz#wk{}</style><p class="xz" id="wk"></p>');
     });
-    // it('uglifies differently with a different salt', function() {
-    //   var html = htmlUglify.process("<style>.demo_class#andID{color: red}</style><div class='demo_class' id='andID'>Welcome to HTML Uglify</div>", {salt: 'other'});
-    //   assert.equal(html, '<style>.vy#nx{color: red}</style><div class="vy" id="nx">Welcome to HTML Uglify</div>');
-    // });
-    // it('uglifies media query with no name', function() {
-    //   var html = htmlUglify.process("<style>@media {.media{ color: red; }}</style><div class='media'>media</div>");
-    //   assert.equal(html, '<style>@media {.xz{ color: red; }}</style><div class="xz">media</div>');
-    // });
-    // it('uglifies media queries inside of media queries', function() {
-    //   var html = htmlUglify.process("<style>@media screen{@media screen{.media-nested{background:red;}}}</style><div class='media-nested'>media-nested</div>");
-    //   assert.equal(html, '<style>@media screen{@media screen{.xz{background:red;}}}</style><div class="xz">media-nested</div>');
-    // });
-    // it('uglifies media queries inside of media queries inside of media queries', function() {
-    //   var html = htmlUglify.process("<style>@media screen{@media screen{@media screen{.media-double-nested{background:red;}}}}</style><div class='media-double-nested'>media-double-nested</div>");
-    //   assert.equal(html, '<style>@media screen{@media screen{@media screen{.xz{background:red;}}}}</style><div class="xz">media-double-nested</div>');
-    // });
-    // it('uglifies css inside @supports at-rule', function() {
-    //   var html = htmlUglify.process("<style>@supports (animation) { .someClass {} }</style><div class='someClass'></div>");
-    //   assert.equal(html, '<style>@supports (animation) { .xz {} }</style><div class="xz"></div>');
-    // });
-    // it('uglifies with whitelisting for ids and classes', function() {
-    //   var whitelist = ['#noform', '.withform'];
-    //   var html = htmlUglify.process("<style>#noform { color: red; } .withform{ color: red } #other{ color: red; }</style><div id='noform' class='noform'>noform</div><div class='withform'>withform</div><div id='other'>other</div>", {salt: 'use the force harry', whitelist: whitelist});
-    //   assert.equal(html, '<style>#noform { color: red; } .withform{ color: red } #xz{ color: red; }</style><div id="noform" class="wk">noform</div><div class="withform">withform</div><div id="xz">other</div>');
-    // });
-    // it('uglifies a class with a ::before', function() {
-    //   var html = htmlUglify.process("<style>.before::before{color: red}</style><div class='before'>before</div>");
-    //   assert.equal(html, '<style>.xz::before{color: red}</style><div class="xz">before</div>');
-    // });
-    // it('uglifies class attribute selectors', function() {
-    //   var html = htmlUglify.process('<style>body[yahoo] *[class*=paddingreset] {}</style><div class="paddingreset1">paddingreset1</div>');
-    //   assert.equal(html, '<style>body[yahoo] *[class*=xz] {}</style><div class="xz1">paddingreset1</div>');
-    // });
-    // it('uglifies id attribute selectors', function() {
-    //   var html = htmlUglify.process('<style>body[yahoo] *[id*=paddingreset] { padding:0 !important; }</style><div id="paddingreset1">paddingreset1</div>');
-    //   assert.equal(html, '<style>body[yahoo] *[id*=xz] { padding:0 !important; }</style><div id="xz1">paddingreset1</div>');
-    // });
-    // it('uglifies for attribute selectors', function() {
-    //   var html = htmlUglify.process('<style>body[yahoo] *[id*=paddingreset] { padding:0 !important; }</style><div for="paddingreset1">paddingreset1</div>');
-    //   assert.equal(html, '<style>body[yahoo] *[id*=xz] { padding:0 !important; }</style><div for="xz1">paddingreset1</div>');
-    // });
-    // it('uglifies attribute selectors correctly towards the end of a stylesheet', function() {
-    //   var html = htmlUglify.process("<style>.test{} .alphatest{} *[class*=test]{}</style><p class='alphatest'></p>");
-    //   assert.equal(html, '<style>.xz{} .alphaxz{} *[class*=xz]{}</style><p class="alphaxz"></p>');
-    // });
-    // it('uglifies attribute selectors with spaced classes', function() {
-    //   var html = htmlUglify.process("<style>.test{} .alphatest{} *[class*=test]{}</style><p class='alphatest beta'></p>");
-    //   assert.equal(html, '<style>.xz{} .alphaxz{} *[class*=xz]{}</style><p class="alphaxz en"></p>');
-    // });
+    it('uglifies differently with a different salt', function() {
+      var html = plugin.process("<style>.demo_class#andID{color: red}</style><div class='demo_class' id='andID'>Welcome to HTML Uglify</div>", {salt: 'other'}).html;
+      assert.equal(html, '<style>.vy#nx{color: red}</style><div class="vy" id="nx">Welcome to HTML Uglify</div>');
+    });
+    it('uglifies media query with no name', function() {
+      var html = plugin.process("<style>@media {.media{ color: red; }}</style><div class='media'>media</div>").html;
+      assert.equal(html, '<style>@media {.xz{ color: red; }}</style><div class="xz">media</div>');
+    });
+    it('uglifies media queries inside of media queries', function() {
+      var html = plugin.process("<style>@media screen{@media screen{.media-nested{background:red;}}}</style><div class='media-nested'>media-nested</div>").html;
+      assert.equal(html, '<style>@media screen{@media screen{.xz{background:red;}}}</style><div class="xz">media-nested</div>');
+    });
+    it('uglifies media queries inside of media queries inside of media queries', function() {
+      var html = plugin.process("<style>@media screen{@media screen{@media screen{.media-double-nested{background:red;}}}}</style><div class='media-double-nested'>media-double-nested</div>").html;
+      assert.equal(html, '<style>@media screen{@media screen{@media screen{.xz{background:red;}}}}</style><div class="xz">media-double-nested</div>');
+    });
+    it('uglifies css inside @supports at-rule', function() {
+      var html = plugin.process("<style>@supports (animation) { .someClass {} }</style><div class='someClass'></div>").html;
+      assert.equal(html, '<style>@supports (animation) { .xz {} }</style><div class="xz"></div>');
+    });
+    it('uglifies with whitelisting for ids and classes', function() {
+      var whitelist = ['#noform', '.withform'];
+      var html = plugin.process("<style>#noform { color: red; } .withform{ color: red } #other{ color: red; }</style><div id='noform' class='noform'>noform</div><div class='withform'>withform</div><div id='other'>other</div>", {salt: 'use the force harry', whitelist: whitelist}).html;
+      assert.equal(html, '<style>#noform { color: red; } .withform{ color: red } #xz{ color: red; }</style><div id="noform" class="wk">noform</div><div class="withform">withform</div><div id="xz">other</div>');
+    });
+    it('uglifies a class with a ::before', function() {
+      var html = plugin.process("<style>.before::before{color: red}</style><div class='before'>before</div>").html;
+      assert.equal(html, '<style>.xz::before{color: red}</style><div class="xz">before</div>');
+    });
+    it('uglifies class attribute selectors', function() {
+      var html = plugin.process('<style>body[yahoo] *[class*=paddingreset] {}</style><div class="paddingreset1">paddingreset1</div>').html;
+      assert.equal(html, '<style>body[yahoo] *[class*=xz] {}</style><div class="xz1">paddingreset1</div>');
+    });
+    it('uglifies id attribute selectors', function() {
+      var html = plugin.process('<style>body[yahoo] *[id*=paddingreset] { padding:0 !important; }</style><div id="paddingreset1">paddingreset1</div>').html;
+      assert.equal(html, '<style>body[yahoo] *[id*=xz] { padding:0 !important; }</style><div id="xz1">paddingreset1</div>');
+    });
+    it('uglifies for attribute selectors', function() {
+      var html = plugin.process('<style>body[yahoo] *[id*=paddingreset] { padding:0 !important; }</style><div for="paddingreset1">paddingreset1</div>').html;
+      assert.equal(html, '<style>body[yahoo] *[id*=xz] { padding:0 !important; }</style><div for="xz1">paddingreset1</div>');
+    });
+    it('uglifies attribute selectors correctly towards the end of a stylesheet', function() {
+      var html = plugin.process("<style>.test{} .alphatest{} *[class*=test]{}</style><p class='alphatest'></p>").html;
+      assert.equal(html, '<style>.xz{} .alphaxz{} *[class*=xz]{}</style><p class="alphaxz"></p>');
+    });
+    it('uglifies attribute selectors with spaced classes', function() {
+      var html = plugin.process("<style>.test{} .alphatest{} *[class*=test]{}</style><p class='alphatest beta'></p>").html;
+      assert.equal(html, '<style>.xz{} .alphaxz{} *[class*=xz]{}</style><p class="alphaxz en"></p>');
+    });
   });
 
-  // describe('attribute selectors', function() {
-  //   describe('equal selector', function() {
-  //     it('uglifies', function() {
-  //       var html = htmlUglify.process('<style>*[class=test] {}</style><div class="test"></div>');
-  //       assert.equal(html, '<style>*[class=xz] {}</style><div class="xz"></div>');
-  //
-  //       html = htmlUglify.process('<style>*[id=test] {}</style><div id="test"></div>');
-  //       assert.equal(html, '<style>*[id=xz] {}</style><div id="xz"></div>');
-  //
-  //       html = htmlUglify.process('<style>*[id=test] {}</style><div for="test"></div>');
-  //       assert.equal(html, '<style>*[id=xz] {}</style><div for="xz"></div>');
-  //     });
-  //   });
-  //   describe('anywhere selector', function() {
-  //     it('uglifies in the middle of a string', function() {
-  //       var html = htmlUglify.process('<style>*[class*=test] {}</style><div class="ZZtestZZ"></div>');
-  //       assert.equal(html, '<style>*[class*=xz] {}</style><div class="ZZxzZZ"></div>');
-  //
-  //       html = htmlUglify.process('<style>*[id*=test] {}</style><div id="ZZtestZZ"></div>');
-  //       assert.equal(html, '<style>*[id*=xz] {}</style><div id="ZZxzZZ"></div>');
-  //
-  //       html = htmlUglify.process('<style>*[id*=test] {}</style><div for="ZZtestZZ"></div>');
-  //       assert.equal(html, '<style>*[id*=xz] {}</style><div for="ZZxzZZ"></div>');
-  //     });
-  //
-  //     it('uglifies at the start of a string', function() {
-  //       var html = htmlUglify.process('<style>*[class*=test] {}</style><div class="testZZ"></div>');
-  //       assert.equal(html, '<style>*[class*=xz] {}</style><div class="xzZZ"></div>');
-  //
-  //       html = htmlUglify.process('<style>*[id*=test] {}</style><div id="testZZ"></div>');
-  //       assert.equal(html, '<style>*[id*=xz] {}</style><div id="xzZZ"></div>');
-  //
-  //       html = htmlUglify.process('<style>*[id*=test] {}</style><div for="testZZ"></div>');
-  //       assert.equal(html, '<style>*[id*=xz] {}</style><div for="xzZZ"></div>');
-  //     });
-  //
-  //     it('uglifies at the end of a string', function() {
-  //       var html = htmlUglify.process('<style>*[class*=test] {}</style><div class="ZZtest"></div>');
-  //       assert.equal(html, '<style>*[class*=xz] {}</style><div class="ZZxz"></div>');
-  //
-  //       html = htmlUglify.process('<style>*[id*=test] {}</style><div id="ZZtest"></div>');
-  //       assert.equal(html, '<style>*[id*=xz] {}</style><div id="ZZxz"></div>');
-  //
-  //       html = htmlUglify.process('<style>*[id*=test] {}</style><div for="ZZtest"></div>');
-  //       assert.equal(html, '<style>*[id*=xz] {}</style><div for="ZZxz"></div>');
-  //     });
-  //   });
-  //   describe('begins with selector', function() {
-  //     it('uglifies at the start of a string', function() {
-  //       var html = htmlUglify.process('<style>*[class^=test] {}</style><div class="testZZ"></div>');
-  //       assert.equal(html, '<style>*[class^=xz] {}</style><div class="xzZZ"></div>');
-  //
-  //       html = htmlUglify.process('<style>*[id^=test] {}</style><div id="testZZ"></div>');
-  //       assert.equal(html, '<style>*[id^=xz] {}</style><div id="xzZZ"></div>');
-  //
-  //       html = htmlUglify.process('<style>*[id^=test] {}</style><div for="testZZ"></div>');
-  //       assert.equal(html, '<style>*[id^=xz] {}</style><div for="xzZZ"></div>');
-  //     });
-  //   });
-  //   describe('ends with selector', function() {
-  //     it('uglifies at the end of a string', function() {
-  //       var html = htmlUglify.process('<style>*[class$=test] {}</style><div class="ZZtest"></div>');
-  //       assert.equal(html, '<style>*[class$=xz] {}</style><div class="ZZxz"></div>');
-  //
-  //       html = htmlUglify.process('<style>*[id$=test] {}</style><div id="ZZtest"></div>');
-  //       assert.equal(html, '<style>*[id$=xz] {}</style><div id="ZZxz"></div>');
-  //
-  //       html = htmlUglify.process('<style>*[id$=test] {}</style><div for="ZZtest"></div>');
-  //       assert.equal(html, '<style>*[id$=xz] {}</style><div for="ZZxz"></div>');
-  //     });
-  //   });
-  // });
+  describe('attribute selectors', function() {
+    describe('equal selector', function() {
+      it('uglifies', function() {
+        var html = plugin.process('<style>*[class=test] {}</style><div class="test"></div>').html;
+        assert.equal(html, '<style>*[class=xz] {}</style><div class="xz"></div>');
+
+        html = plugin.process('<style>*[id=test] {}</style><div id="test"></div>').html;
+        assert.equal(html, '<style>*[id=xz] {}</style><div id="xz"></div>');
+
+        html = plugin.process('<style>*[id=test] {}</style><div for="test"></div>').html;
+        assert.equal(html, '<style>*[id=xz] {}</style><div for="xz"></div>');
+      });
+    });
+    describe('anywhere selector', function() {
+      it('uglifies in the middle of a string', function() {
+        var html = plugin.process('<style>*[class*=test] {}</style><div class="ZZtestZZ"></div>').html;
+        assert.equal(html, '<style>*[class*=xz] {}</style><div class="ZZxzZZ"></div>');
+
+        html = plugin.process('<style>*[id*=test] {}</style><div id="ZZtestZZ"></div>').html;
+        assert.equal(html, '<style>*[id*=xz] {}</style><div id="ZZxzZZ"></div>');
+
+        html = plugin.process('<style>*[id*=test] {}</style><div for="ZZtestZZ"></div>').html;
+        assert.equal(html, '<style>*[id*=xz] {}</style><div for="ZZxzZZ"></div>');
+      });
+
+      it('uglifies at the start of a string', function() {
+        var html = plugin.process('<style>*[class*=test] {}</style><div class="testZZ"></div>').html;
+        assert.equal(html, '<style>*[class*=xz] {}</style><div class="xzZZ"></div>');
+
+        html = plugin.process('<style>*[id*=test] {}</style><div id="testZZ"></div>').html;
+        assert.equal(html, '<style>*[id*=xz] {}</style><div id="xzZZ"></div>');
+
+        html = plugin.process('<style>*[id*=test] {}</style><div for="testZZ"></div>').html;
+        assert.equal(html, '<style>*[id*=xz] {}</style><div for="xzZZ"></div>');
+      });
+
+      it('uglifies at the end of a string', function() {
+        var html = plugin.process('<style>*[class*=test] {}</style><div class="ZZtest"></div>').html;
+        assert.equal(html, '<style>*[class*=xz] {}</style><div class="ZZxz"></div>');
+
+        html = plugin.process('<style>*[id*=test] {}</style><div id="ZZtest"></div>').html;
+        assert.equal(html, '<style>*[id*=xz] {}</style><div id="ZZxz"></div>');
+
+        html = plugin.process('<style>*[id*=test] {}</style><div for="ZZtest"></div>').html;
+        assert.equal(html, '<style>*[id*=xz] {}</style><div for="ZZxz"></div>');
+      });
+    });
+    describe('begins with selector', function() {
+      it('uglifies at the start of a string', function() {
+        var html = plugin.process('<style>*[class^=test] {}</style><div class="testZZ"></div>').html;
+        assert.equal(html, '<style>*[class^=xz] {}</style><div class="xzZZ"></div>');
+
+        html = plugin.process('<style>*[id^=test] {}</style><div id="testZZ"></div>').html;
+        assert.equal(html, '<style>*[id^=xz] {}</style><div id="xzZZ"></div>');
+
+        html = plugin.process('<style>*[id^=test] {}</style><div for="testZZ"></div>').html;
+        assert.equal(html, '<style>*[id^=xz] {}</style><div for="xzZZ"></div>');
+      });
+    });
+    describe('ends with selector', function() {
+      it('uglifies at the end of a string', function() {
+        var html = plugin.process('<style>*[class$=test] {}</style><div class="ZZtest"></div>').html;
+        assert.equal(html, '<style>*[class$=xz] {}</style><div class="ZZxz"></div>');
+
+        html = plugin.process('<style>*[id$=test] {}</style><div id="ZZtest"></div>').html;
+        assert.equal(html, '<style>*[id$=xz] {}</style><div id="ZZxz"></div>');
+
+        html = plugin.process('<style>*[id$=test] {}</style><div for="ZZtest"></div>').html;
+        assert.equal(html, '<style>*[id$=xz] {}</style><div for="ZZxz"></div>');
+      });
+    });
+  });
 });

From 98a6e57412fa17d2fa31f252191a138c919c3bf7 Mon Sep 17 00:00:00 2001
From: Devin Torres <devin@devintorr.es>
Date: Tue, 2 Feb 2016 11:17:35 -0600
Subject: [PATCH 3/3] Explicitly depend on posthtml-parser and posthtml-render

---
 package.json | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/package.json b/package.json
index 1095aa8..0878aa1 100644
--- a/package.json
+++ b/package.json
@@ -22,7 +22,9 @@
     "hashids": "^1.0.2",
     "postcss-safe-parser": "^1.0.4",
     "postcss-selector-parser": "^1.3.0",
-    "posthtml": "^0.8.1"
+    "posthtml": "^0.8.1",
+    "posthtml-parser": "^0.1.1",
+    "posthtml-render": "^1.0.5"
   },
   "devDependencies": {
     "benchmark": "^2.0.0",