minify based on white list

mainmatter · Oct 27, 2017 · 80c7479 · 80c7479
1 parent 7d2a563
commit 80c7479
Show file tree

Hide file tree

Showing 9 changed files with 842 additions and 30 deletions.
diff --git a/__snapshots__/hbs-minifier-plugin.test.js.snap b/__snapshots__/hbs-minifier-plugin.test.js.snap
diff --git a/ember-cli-build.js b/ember-cli-build.js
@@ -7,6 +7,14 @@ const EmberAddon = require('ember-cli/lib/broccoli/ember-addon');
 module.exports = function(defaults) {
   let app = new EmberAddon(defaults, {
     // Add options here
+    'ember-hbs-minifier': {
+      whiteList: {
+        elementNodes: ['pre', 'address'],
+        elementClassNames: ['description'],
+        components: ['foo-bar'],
+        partials: []
+      }
+    }
   });
 
   /*

diff --git a/hbs-minifier-plugin.js b/hbs-minifier-plugin.js
@@ -6,10 +6,19 @@ const stripWhiteSpace = Util.stripWhiteSpace;
 const isWhitespaceTextNode = Util.isWhitespaceTextNode;
 const hasLeadingOrTrailingWhiteSpace = Util.hasLeadingOrTrailingWhiteSpace;
 const stripNoMinifyBlocks = Util.stripNoMinifyBlocks;
+const canTrimBlockStatementContent = Util.canTrimBlockStatementContent;
+const canTrimElementNodeContent = Util.canTrimElementNodeContent;
+const canTrimModule = Util.canTrimModule;
+const assignDefaultValues = Util.assignDefaultValues;
+
+class BasePlugin {
+  constructor(env) {
+    env = env || {};
+    this.moduleName = env.moduleName;
+  }
 
-class HBSMinifierPlugin {
-
-  static createASTPlugin() {
+  static createASTPlugin(config) {
+    config = config || {};
     let preStack = [];
     let visitor = {
       TextNode(node) {
@@ -21,13 +30,14 @@ class HBSMinifierPlugin {
 
       BlockStatement: {
         enter(node) {
-          if (node.path.original === 'no-minify') {
-            preStack.push(true);
+          let canTrim = canTrimBlockStatementContent(node, config);
+          if (!canTrim) {
+            preStack.push(node);
           }
         },
 
         exit(node) {
-          if (node.path.original === 'no-minify') {
+          if (preStack[preStack.length - 1] === node) {
             preStack.pop();
           }
         },
@@ -57,8 +67,10 @@ class HBSMinifierPlugin {
 
       ElementNode: {
         enter(node) {
-          if (node.tag === 'pre') {
-            preStack.push(true);
+          let canTrim = canTrimElementNodeContent(node, config);
+
+          if (!canTrim) {
+            preStack.push(node);
           }
 
           if (preStack.length !== 0) {
@@ -79,7 +91,7 @@ class HBSMinifierPlugin {
         exit(node) {
           node.children = stripNoMinifyBlocks(node.children);
 
-          if (node.tag === 'pre') {
+          if (preStack[preStack.length - 1] === node) {
             preStack.pop();
           }
         }
@@ -88,15 +100,21 @@ class HBSMinifierPlugin {
 
     return { name: 'hbs-minifier-plugin', visitor };
   }
+}
 
-  transform(ast) {
-    let plugin = HBSMinifierPlugin.createASTPlugin();
-
-    this.syntax.traverse(ast, plugin.visitor);
+module.exports = function(config) {
+  config = config || {};
+  config = assignDefaultValues(config);
 
-    return ast;
-  }
+  return class HBSMinifierPlugin extends BasePlugin {
 
-}
+    transform(ast) {
 
-module.exports = HBSMinifierPlugin;
+      if (canTrimModule(this.moduleName, config)) {
+        let plugin = HBSMinifierPlugin.createASTPlugin(config);
+        this.syntax.traverse(ast, plugin.visitor);
+      }
+      return ast;
+    }
+  };
+};
diff --git a/hbs-minifier-plugin.test.js b/hbs-minifier-plugin.test.js
@@ -1,9 +1,16 @@
 'use strict';
 
 /* eslint-env jest */
-
+const defaultConfig = {
+  whiteList: {
+    elementNodes: ['pre', 'address'],
+    elementClassNames: ['description'],
+    components: ['foo-bar'],
+    partials: []
+  }
+};
 const glimmer = require('@glimmer/syntax');
-const HbsMinifierPlugin = require('./hbs-minifier-plugin');
+const HbsMinifierPlugin = require('./hbs-minifier-plugin')(defaultConfig);
 
 it('collapses whitespace into single space character', () => {
   assert(`{{foo}}  \n\n   \n{{bar}}`);
@@ -56,6 +63,34 @@ it('12. does not collapse &nbsp; surrounding a text content into a single whites
 </div>`);
 });
 
+it('13. does not minify `tagNames` specified in .hbs-minifyrc.js', function() {
+  assert(`<address>
+  Box 564,
+  <b>
+    Disneyland
+  </b>
+  <br>
+  <u> USA </u>
+</address>`);
+});
+
+it('14. does not minify `classNames` specified in .hbs-minifyrc.js', function() {
+  assert(`<div class="description">
+  1
+  <span>
+    2
+  </span>
+</div>`);
+});
+
+it('15. does not minify `components` specified in .hbs-minifyrc.js', function() {
+  assert(`{{#foo-bar}}
+  <span>
+    yield content
+  </span>
+{{/foo-bar}}`);
+});
+
 function assert(template) {
   let ast = process(template);
   expect(ast).toMatchSnapshot();
@@ -65,9 +100,12 @@ function assert(template) {
 }
 
 function process(template) {
+  let plugin = () => {
+    return HbsMinifierPlugin.createASTPlugin(defaultConfig.whiteList);
+  };
   return glimmer.preprocess(template, {
     plugins: {
-      ast: [HbsMinifierPlugin.createASTPlugin]
+      ast: [plugin]
     }
   });
 }
diff --git a/index.js b/index.js
@@ -4,15 +4,28 @@
 module.exports = {
   name: 'ember-hbs-minifier',
 
-  setupPreprocessorRegistry(type, registry) {
-    if (type === 'parent') {
-      let HbsMinifierPlugin = require('./hbs-minifier-plugin');
+  _getMinifierOptions() {
+    return (this.parent && this.parent.options) || (this.app && this.app.options) || {};
+  },
+
+  _setupPreprocessorRegistry(app) {
+    let registry = app.registry;
+    let options = this._getMinifierOptions(app);
+    let config = options['ember-hbs-minifier'] || {};
 
-      registry.add('htmlbars-ast-plugin', {
-        name: 'hbs-minifier-plugin',
-        plugin: HbsMinifierPlugin,
-        baseDir() { return __dirname; }
-      });
-    }
+    let HbsMinifierPlugin = require('./hbs-minifier-plugin')(config.whiteList || {});
+    registry.add('htmlbars-ast-plugin', {
+      name: 'hbs-minifier-plugin',
+      plugin: HbsMinifierPlugin,
+      baseDir() { return __dirname; }
+    });
   },
+  included(app) {
+    this._super.included.apply(this, arguments);
+    /*
+      Calling setupPreprocessorRegistry in included hook since app.options is not accessible
+      Refer PR: https://github.com/ember-cli/ember-cli/pull/7059
+    */
+    this._setupPreprocessorRegistry(app);
+  }
 };
diff --git a/tests/dummy/app/components/foo-bar.js b/tests/dummy/app/components/foo-bar.js
@@ -0,0 +1,6 @@
+import Ember from 'ember';
+import layout from '../templates/components/foo-bar';
+
+export default Ember.Component.extend({
+  layout
+});
diff --git a/tests/dummy/app/templates/components/foo-bar.hbs b/tests/dummy/app/templates/components/foo-bar.hbs
@@ -0,0 +1,8 @@
+1
+<span>
+  2
+</span>
+<span>
+  3
+</span>
+{{yield}}
diff --git a/tests/integration/components/dummy-component-test.js b/tests/integration/components/dummy-component-test.js
@@ -149,4 +149,59 @@ describe('HBS Minifier plugin', function() {
     expect(childNode.textContent.trim()).to.equal('1');
   });
 
+  it('does not minify `tagNames` specified in .hbs-minifyrc.js', function() {
+    this.render(hbs `
+<address>
+  Box 564,
+  <b>
+    Disneyland
+  </b>
+  <br>
+  <u> USA </u>
+</address>`);
+
+    let childNodes = this.$('address')[0].childNodes;
+    expect(childNodes[0].textContent).to.equal('\n  Box 564,\n  ');
+    // ensuring the textContent is surrounded by whitespaces
+    expect(childNodes[1].textContent).to.equal('\n    Disneyland\n  ');
+    expect(childNodes[2].textContent).to.equal('\n  ');
+    expect(childNodes[4].textContent).to.equal('\n  ');
+    expect(childNodes[5].textContent).to.equal(' USA ');
+  });
+
+
+  it('does not minify `classNames` specified in .hbs-minifyrc.js', function() {
+    this.render(hbs `
+<div class="description">
+  1
+  <span>
+    2
+  </span>
+</div>`);
+
+    let childNodes = this.$('div')[0].childNodes;
+    expect(childNodes[0].textContent).to.equal('\n  1\n  ');
+    expect(childNodes[1].textContent).to.equal('\n    2\n  ');
+    expect(childNodes[2].textContent).to.equal('\n');
+  });
+
+  it('does not minify `components` specified in .hbs-minifyrc.js', function() {
+    this.render(hbs `
+{{#foo-bar}}
+  <span>
+    yield content
+  </span>
+{{/foo-bar}}`);
+
+    let childNodes = this.$('div')[0].childNodes;
+    expect(childNodes[0].textContent).to.equal('1\n');
+    expect(childNodes[1].textContent).to.equal('\n  2\n');
+    expect(childNodes[3].textContent).to.equal('\n  3\n');
+    expect(childNodes[4].textContent).to.equal('\n');
+    expect(childNodes[5].textContent).to.equal('  ');
+    expect(childNodes[6].textContent).to.equal('\n    yield content\n  ');
+    expect(childNodes[7].textContent).to.equal('\n');
+  });
+
+
 });