Merge pull request #33 from mozilla/async_defer_script_attributes

Add the ability to add the `defer` or `async` attributes to scripts.

docs/API.md

@@ -74,6 +74,8 @@ Helper function for generating ``script`` tags for your Javascript files.
 ``options`` is an optional dictionary with the following optional value:
 
 * ``hash`` - MD5 hash to use instead of calculating from disk (**Default: none**)
+* ``defer`` - if true, adds the defer attribute to scripts in production mode. (**Default: false**)
+* ``async`` - if true, adds the async attribute to scripts in production mode. (**Default: false**)
 
 In production mode, a single script tag is generated, with a cache-busting
 url. In development mode (``production: false``), Multiple script tags are

lib/connect-cachify.js

@@ -205,9 +205,26 @@ var prod_or_dev_tags = function (filename, link_fmt, hash) {
 
 var cachify_js = exports.cachify_js = function (filename, options) {
   if (! options) options = {};
-  return prod_or_dev_tags(filename,
-                          '<script src="%s"></script>',
-                          options.hash);
+  var link_fmt = '<script src="%s"'
+
+  /**
+   * indicate to a browser that the script is meant to be executed after the
+   * document has been parsed.
+   */
+  if (options.defer && opts.production === true) {
+    link_fmt += ' defer';
+  }
+
+  /**
+   * indicate that the browser should, if possible, execute the script
+   * asynchronously
+   */
+  if (options.async && opts.production === true) {
+    link_fmt += ' async';
+  }
+
+  link_fmt += '></script>';
+  return prod_or_dev_tags(filename, link_fmt, options.hash);
 };
 
 var cachify_css = exports.cachify_css = function (filename, options) {

test/connect-cachify-test.js

@@ -110,6 +110,19 @@ exports.setup = nodeunit.testCase({
     links = cachify.cachify_js("/js/main.min.js").split('\n');
     test.equal(links[0], '<script src="/d41d8cd98f/js/lib/jquery.js"></script>',
               "debug option puts hash in all urls");
+
+    links = cachify.cachify_js("/js/main.min.js",
+        { defer: true }).split('\n');
+    test.equal(links[0],
+        '<script src="/d41d8cd98f/js/lib/jquery.js"></script>',
+              "defer: true does not add defer attribute with production=false");
+
+    links = cachify.cachify_js("/js/main.min.js",
+        { async: true }).split('\n');
+    test.equal(links[0],
+        '<script src="/d41d8cd98f/js/lib/jquery.js"></script>',
+              "async: true does not async attribute with production=false");
+
     files = cachify.cachify("/js/main.min.js", {tag_format: '<script src="%s" defer></script>'}).split('\n');
     test.equal(files[0], '<script src="/d41d8cd98f/js/lib/jquery.js" defer></script>');
     hints = cachify.cachify_prefetch("/js/main.min.js").split('\n');
@@ -166,6 +179,19 @@ exports.setup = nodeunit.testCase({
     var link = cachify.cachify_js("/js/main.min.js");
     test.equal(link, '<script src="/d41d8cd98f/js/main.min.js"></script>',
               "Hashes in all urls in production");
+
+    links = cachify.cachify_js("/js/main.min.js",
+        { defer: true }).split('\n');
+    test.equal(links[0],
+        '<script src="/d41d8cd98f/js/main.min.js" defer></script>',
+              "defer: true adds defer attribute with production=true");
+
+    links = cachify.cachify_js("/js/main.min.js",
+        { async: true }).split('\n');
+    test.equal(links[0],
+        '<script src="/d41d8cd98f/js/main.min.js" async></script>',
+              "async: true adds async attribute with production=true");
+
     var file = cachify.cachify("/js/main.min.js");
     test.equal(file, "/d41d8cd98f/js/main.min.js");
     var hint = cachify.cachify_prefetch("/js/main.min.js");