crisper - npm Package Compare versions

Comparing version 2.0.2 to 2.1.0

index.js

@@ -14,2 +14,3 @@ /**
 
+var crypto = require("crypto");
 var dom5 = require('dom5');
@@ -41,2 +42,3 @@ var pred = dom5.predicates;
   var alwaysWriteScript = options.alwaysWriteScript || false;
+  var cspHashableScriptLoader = options.cspHashableScriptLoader || false;
 
@@ -69,3 +71,21 @@ var doc = dom5.parse(source);
       var newScript = dom5.constructors.element('script');
-      dom5.setAttribute(newScript, 'src', jsFileName);
+      var comment;
+      if (cspHashableScriptLoader) {
+        // hashable script loader to support hash-based CSP with strict-dynamic.
+        var loader = '// CSP \'strict-dynamic\' compatible script loader. ';
+        loader += 'Add \'strict-dynamic\' and a hash of this script to your CSP.\n';
+        loader += 'var s = document.createElement("script");\n';
+        loader += 's.src = "' + jsFileName + '";\n';
+        loader += '(document.body||document.head).appendChild(s);\n';
+        dom5.setTextContent(newScript, loader);
+
+        // Calculate hash of loader script for CSP.
+        var scriptHash = crypto.createHash('sha256');
+        scriptHash.update(loader, 'utf-8');
+        var digest = scriptHash.digest('base64');
+        var commentText = ' CSP hash: \'sha256-' + digest + '\' ';
+        comment = dom5.constructors.comment(commentText);
+      } else {
+        dom5.setAttribute(newScript, 'src', jsFileName);
+      }
       if (scriptInHead) {
@@ -78,2 +98,5 @@ dom5.setAttribute(newScript, 'defer', '');
       }
+      if (cspHashableScriptLoader) {
+        dom5.insertBefore(newScript.parentNode, newScript, comment);
+      }
     }
@@ -80,0 +103,0 @@ }

package.json

 {
   "name": "crisper",
-  "version": "2.0.2",
+  "version": "2.1.0",
   "description": "Make an HTML file with inline scripts CSP compliant",
@@ -5,0 +5,0 @@ "main": "index.js",

README.md

@@ -22,3 +22,3 @@ # Crisper
   - `--only-split`
-    - Do not write include a `<script>` tag in the output HTML
+    - Do not write a `<script>` tag in the output HTML
       file.
@@ -28,2 +28,10 @@ - `--always-write-script`
       elements.
+  - `--csp-hashable-script-loader`
+    - Create a hashable script loader that supports hash-based CSP with strict-dynamic.
+    - A strict CSP could look like this:
+    ```
+    script-src 'strict-dynamic' 'sha256-mUZwR5zj1qMvnzisSvfmC8JczLB0BUKW0Ohr3euDoIA=';
+    object-src 'none';
+    base-uri 'self';
+    ```
   - `-v` | `--version`
@@ -49,3 +57,3 @@ - Prints version number.
 When using [vulcanize](https://github.com/Polymer/vulcanize), crisper can handle
-the html string output directly and write the CSP seperated files on the command
+the html string output directly and write the CSP separated files on the command
 line
@@ -52,0 +60,0 @@

test/test.js

@@ -110,3 +110,3 @@ /**
 
-      test('script in head with defer attribute', function() {
+      test('script in body', function() {
         var doc = dom5.parse(obj.html);
@@ -125,2 +125,23 @@ var body = dom5.query(doc, pred.hasTagName('body'));
 
+    suite('script loaded via hashable inline-script if forced', function() {
+      var obj;
+      setup(function() {
+        obj = crisp({
+          source: '<div></div><script>var a = "b";</script>',
+          jsFileName: 'foo.js',
+          cspHashableScriptLoader: true
+        });
+      });
+
+      test('script loaded through hashable loader script', function() {
+        var doc = dom5.parse(obj.html);
+        var head = dom5.query(doc, pred.hasTagName('head'));
+        var script = dom5.query(head, pred.AND(
+          pred.hasTagName('script'),
+          pred.NOT(pred.hasAttrValue('src', 'foo.js'))
+        ));
+        assert.ok(script);
+      });
+    });
+
     suite('Only Split Js', function() {
@@ -127,0 +148,0 @@ var obj;

No alert changes

Improved metrics

Total package byte prevSize

21728

increased by13.3%

Lines of code

293

increased by16.27%

Number of lines in readme file

94

increased by9.3%

No dependency changes