fix: when using the integrity option, leaves the original attributes in the script tag as is

webdiscus · webdiscus · commit 9f8a7c57867c · 2024-08-01T18:32:01.000+02:00
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,5 +1,9 @@
 # Change log
 
+## 3.17.1 (2024-08-01)
+
+- fix: when using the integrity option, leaves the original attributes in the script tag as is
+
 ## 3.17.0 (2024-07-23)
 
 - feat: add support the `?inline` query for styles imported in JavaScript:
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "html-bundler-webpack-plugin",
-  "version": "3.17.0",
+  "version": "3.17.1",
   "description": "HTML bundler plugin for webpack handles a template as an entry point, extracts CSS and JS from their sources referenced in HTML, supports template engines like Eta, EJS, Handlebars, Nunjucks.",
   "keywords": [
     "html",
diff --git a/src/Plugin/Collection.js b/src/Plugin/Collection.js
@@ -1028,7 +1028,8 @@ class Collection {
 
               let attrsStr = '';
               for (const attrName in attrs) {
-                attrsStr += ` ${attrName}="${attrs[attrName]}"`;
+                let value = attrs[attrName];
+                attrsStr += value == null ? ` ${attrName}` : ` ${attrName}="${value}"`;
               }
 
               output += content.slice(pos, startPos) + `<${tag}${attrsStr}>`;
diff --git a/test/cases/integrity-script-async-prod/expected/index.html b/test/cases/integrity-script-async-prod/expected/index.html
@@ -0,0 +1,10 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <title>Test</title>
+  <script async src="main.js" integrity="sha384-E4IoJ3Xutt/6tUVDjvtPwDTTlCfU5oG199UoqWShFCNx6mb4tdpcPLu7sLzNc8Pe" crossorigin="anonymous"></script>
+</head>
+<body>
+  <h1>Hello World!</h1>
+</body>
+</html>
diff --git a/test/cases/integrity-script-async-prod/expected/main.js b/test/cases/integrity-script-async-prod/expected/main.js
@@ -0,0 +1 @@
+console.log(">> main");
diff --git a/test/cases/integrity-script-async-prod/src/index.html b/test/cases/integrity-script-async-prod/src/index.html
@@ -0,0 +1,10 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <title>Test</title>
+  <script async src="./main.js"></script>
+</head>
+<body>
+  <h1>Hello World!</h1>
+</body>
+</html>
diff --git a/test/cases/integrity-script-async-prod/src/main.js b/test/cases/integrity-script-async-prod/src/main.js
@@ -0,0 +1 @@
+console.log('>> main');
diff --git a/test/cases/integrity-script-async-prod/webpack.config.js b/test/cases/integrity-script-async-prod/webpack.config.js
@@ -0,0 +1,20 @@
+const path = require('path');
+const HtmlBundlerPlugin = require('@test/html-bundler-webpack-plugin');
+
+module.exports = {
+  mode: 'production',
+
+  output: {
+    path: path.join(__dirname, 'dist/'),
+    crossOriginLoading: 'anonymous', // required for test Subresource Integrity
+  },
+
+  plugins: [
+    new HtmlBundlerPlugin({
+      entry: {
+        index: './src/index.html',
+      },
+      integrity: 'auto',
+    }),
+  ],
+};
diff --git a/test/integration.test.js b/test/integration.test.js
@@ -468,6 +468,9 @@ describe('integrity, common use cases', () => {
   test('script, link, publicPath="auto"', () => compareFiles('integrity-publicPath-auto'));
   test('script, link, publicPath=""', () => compareFiles('integrity-publicPath-empty'));
   test('script, link, publicPath="/"', () => compareFiles('integrity-publicPath-root'));
+  
+  
+  test('script async, prod', () => compareFiles('integrity-script-async-prod'));
 
   test('split chunks', () => compareFiles('integrity-split-chunks'));
   test('import css', () => compareFiles('integrity-import-css-in-js'));

Original file line number	Diff line number	Diff line change
`@@ -1,6 +1,6 @@`
`1`	`1`	`{`
`2`	`2`	`"name": "html-bundler-webpack-plugin",`
`3`		`- "version": "3.17.0",`
	`3`	`+ "version": "3.17.1",`
`4`	`4`	`"description": "HTML bundler plugin for webpack handles a template as an entry point, extracts CSS and JS from their sources referenced in HTML, supports template engines like Eta, EJS, Handlebars, Nunjucks.",`
`5`	`5`	`"keywords": [`
`6`	`6`	`"html",`
Original file line number	Diff line number	Diff line change
`@@ -1028,7 +1028,8 @@ class Collection {`
`1028`	`1028`
`1029`	`1029`	`let attrsStr = '';`
`1030`	`1030`	`for (const attrName in attrs) {`
`1031`		- attrsStr += ` ${attrName}="${attrs[attrName]}"`;
	`1031`	`+ let value = attrs[attrName];`
	`1032`	+ attrsStr += value == null ? ` ${attrName}` : ` ${attrName}="${value}"`;
`1032`	`1033`	`}`
`1033`	`1034`
`1034`	`1035`	output += content.slice(pos, startPos) + `<${tag}${attrsStr}>`;