Last active
June 11, 2016 00:31
-
-
Save jscheid/dea42faec58f6e3083ad942a617563da to your computer and use it in GitHub Desktop.
html-webpack-plugin/webpack-subresource-integrity test case example
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
diff --git a/package.json b/package.json | |
index 7fba20f..0ba9d1e 100644 | |
--- a/package.json | |
+++ b/package.json | |
@@ -4,7 +4,7 @@ | |
"description": "Webpack plugin for ensuring subresource integrity", | |
"main": "index", | |
"scripts": { | |
- "test": "karma start --single-run", | |
+ "test": "karma start --single-run && mocha test/test-webpack.js", | |
"lint": "eslint ." | |
}, | |
"repository": { | |
@@ -28,18 +28,22 @@ | |
"webpack-core": "^0.6.8" | |
}, | |
"devDependencies": { | |
- "babel-eslint": "^4.1.6", | |
- "eslint": "^1.10.3", | |
- "eslint-config-airbnb-es5": "^1.0.8", | |
- "eslint-plugin-react": "^3.12.0", | |
+ "babel-eslint": "^6.0.4", | |
+ "eslint": "^2.12.0", | |
+ "eslint-config-airbnb-es5": "^1.0.9", | |
+ "eslint-plugin-react": "^5.1.1", | |
"expect": "^1.13.4", | |
"file-loader": "^0.8.5", | |
+ "html-webpack-plugin": "ampedandwired/html-webpack-plugin#feature/alter-tags", | |
+ "htmlparser": "^1.7.7", | |
"karma": "^0.13.15", | |
"karma-chrome-launcher": "^0.2.2", | |
"karma-firefox-launcher": "^0.1.7", | |
"karma-mocha": "^0.2.1", | |
"karma-webpack": "^1.7.0", | |
"mocha": "^2.3.4", | |
+ "soupselect": "^0.2.0", | |
+ "tmp": "0.0.28", | |
"webpack": "^1.12.11" | |
}, | |
"peerDependencies": { | |
diff --git a/test/test-webpack.js b/test/test-webpack.js | |
new file mode 100644 | |
index 0000000..dbe04b8 | |
--- /dev/null | |
+++ b/test/test-webpack.js | |
@@ -0,0 +1,46 @@ | |
+var webpack = require('webpack'); | |
+var HtmlWebpackPlugin = require('html-webpack-plugin'); | |
+var path = require('path'); | |
+var SriPlugin = require('../index'); | |
+var htmlparser = require('htmlparser'); | |
+var fs = require('fs'); | |
+var select = require('soupselect').select; | |
+var expect = require('expect'); | |
+var tmp = require('tmp'); | |
+ | |
+describe('html-webpack-plugin', function describe() { | |
+ it('should include integrity attributes in output', function it(callback) { | |
+ var tmpDir = tmp.dirSync(); | |
+ var webpackConfig = { | |
+ entry: path.join(__dirname, './chunk1.js'), | |
+ output: { | |
+ path: tmpDir.name | |
+ }, | |
+ plugins: [ | |
+ new HtmlWebpackPlugin({ title: 'foo' }), | |
+ new SriPlugin(['sha256', 'sha384']) | |
+ ] | |
+ }; | |
+ webpack(webpackConfig, function webpackCallback(err, result) { | |
+ var integrity = result.compilation.assets['bundle.js'].integrity; | |
+ expect(integrity).toMatch(/^sha/); | |
+ if (err) { | |
+ callback(err); | |
+ } | |
+ var handler = new htmlparser.DefaultHandler(function htmlparserCallback(error, dom) { | |
+ if (error) { | |
+ callback(error); | |
+ } else { | |
+ var scripts = select(dom, 'script'); | |
+ expect(scripts.length).toEqual(1); | |
+ expect(scripts[0].attribs.crossorigin).toEqual('anonymous'); | |
+ expect(scripts[0].attribs.integrity).toEqual(integrity); | |
+ callback(); | |
+ } | |
+ }); | |
+ var parser = new htmlparser.Parser(handler); | |
+ parser.parseComplete(fs.readFileSync(path.join(tmpDir.name, 'index.html'), 'utf-8')); | |
+ tmpDir.removeCallback(); | |
+ }); | |
+ }); | |
+}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
diff --git a/package.json b/package.json | |
index 0ba9d1e..926c200 100644 | |
--- a/package.json | |
+++ b/package.json | |
@@ -29,10 +29,12 @@ | |
}, | |
"devDependencies": { | |
"babel-eslint": "^6.0.4", | |
+ "css-loader": "^0.23.1", | |
"eslint": "^2.12.0", | |
"eslint-config-airbnb-es5": "^1.0.9", | |
"eslint-plugin-react": "^5.1.1", | |
"expect": "^1.13.4", | |
+ "extract-text-webpack-plugin": "^1.0.1", | |
"file-loader": "^0.8.5", | |
"html-webpack-plugin": "ampedandwired/html-webpack-plugin#feature/alter-tags", | |
"htmlparser": "^1.7.7", | |
@@ -43,6 +45,7 @@ | |
"karma-webpack": "^1.7.0", | |
"mocha": "^2.3.4", | |
"soupselect": "^0.2.0", | |
+ "style-loader": "^0.13.1", | |
"tmp": "0.0.28", | |
"webpack": "^1.12.11" | |
}, | |
diff --git a/test/dummy.js b/test/dummy.js | |
new file mode 100644 | |
index 0000000..e92b0ec | |
--- /dev/null | |
+++ b/test/dummy.js | |
@@ -0,0 +1 @@ | |
+require('./stylesheet.css'); | |
diff --git a/test/test-webpack.js b/test/test-webpack.js | |
index dbe04b8..acb5ac7 100644 | |
--- a/test/test-webpack.js | |
+++ b/test/test-webpack.js | |
@@ -7,26 +7,36 @@ var fs = require('fs'); | |
var select = require('soupselect').select; | |
var expect = require('expect'); | |
var tmp = require('tmp'); | |
+var ExtractTextPlugin = require('extract-text-webpack-plugin'); | |
describe('html-webpack-plugin', function describe() { | |
it('should include integrity attributes in output', function it(callback) { | |
var tmpDir = tmp.dirSync(); | |
var webpackConfig = { | |
- entry: path.join(__dirname, './chunk1.js'), | |
+ entry: path.join(__dirname, './dummy.js'), | |
output: { | |
path: tmpDir.name | |
}, | |
+ module: { | |
+ loaders: [ | |
+ { test: /\.css$/, loader: ExtractTextPlugin.extract('style-loader', 'css-loader') } | |
+ ] | |
+ }, | |
plugins: [ | |
- new HtmlWebpackPlugin({ title: 'foo' }), | |
+ new HtmlWebpackPlugin(), | |
+ new ExtractTextPlugin('styles.css'), | |
new SriPlugin(['sha256', 'sha384']) | |
] | |
}; | |
webpack(webpackConfig, function webpackCallback(err, result) { | |
- var integrity = result.compilation.assets['bundle.js'].integrity; | |
- expect(integrity).toMatch(/^sha/); | |
if (err) { | |
- callback(err); | |
+ return callback(err); | |
} | |
+ var jsIntegrity = result.compilation.assets['bundle.js'].integrity; | |
+ expect(jsIntegrity).toMatch(/^sha/); | |
+ var cssIntegrity = result.compilation.assets['styles.css'].integrity; | |
+ expect(cssIntegrity).toMatch(/^sha/); | |
+ | |
var handler = new htmlparser.DefaultHandler(function htmlparserCallback(error, dom) { | |
if (error) { | |
callback(error); | |
@@ -34,7 +44,13 @@ describe('html-webpack-plugin', function describe() { | |
var scripts = select(dom, 'script'); | |
expect(scripts.length).toEqual(1); | |
expect(scripts[0].attribs.crossorigin).toEqual('anonymous'); | |
- expect(scripts[0].attribs.integrity).toEqual(integrity); | |
+ expect(scripts[0].attribs.integrity).toEqual(jsIntegrity); | |
+ | |
+ var links = select(dom, 'link'); | |
+ expect(links.length).toEqual(1); | |
+ expect(links[0].attribs.crossorigin).toEqual('anonymous'); | |
+ expect(links[0].attribs.integrity).toEqual(cssIntegrity); | |
+ | |
callback(); | |
} | |
}); |
Is there an easy way to apply the patch?
Just download it and then in the repo something like patch -p0 < file
.
BTW I don't get notified about comments here, I'll try and check now and then but better to keep the conversation on the PR.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
@SPSwetter 2.21.0 I believe... yeah we'll have to wait for the release first.
Would you mind merging this, cleaning it up a bit perhaps (just a quick and dirty hack) and see if it's worth adding another test or two for corner cases as mentioned in the PR? Perhaps add a stylesheet?