fix: correct attributes type, #35

webdiscus · Oct 12, 2023 · 52d96fb · 52d96fb
1 parent f9c53f2
commit 52d96fb
Show file tree

Hide file tree

Showing 8 changed files with 43 additions and 37 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,5 +1,11 @@
 # Change log
 
+## 2.14.4 (2023-10-12)
+
+- fix: correct attributes type in the `filter()` function of the `sources` loader option
+- refactor: improve code
+- docs: fix attributes type
+
 ## 2.14.3 (2023-10-08)
 
 - chore: update dependencies in examples

diff --git a/README.md b/README.md
@@ -1324,7 +1324,7 @@ type Preload = Array<{
   as?: string;
   rel?: string;
   type?: string;
-  attributes?: {};
+  attributes?: { [k: string]: string | boolean };
 }>;
 ```
 
@@ -1375,7 +1375,7 @@ preload: [
 ],
 ```
 
-The generated preload tag like following:
+The generated preload tag like the following:
 
 ```html
 <link rel="preload" href="css/styles.1f4faaff.css" as="style" />
@@ -1392,7 +1392,7 @@ preload: [
 ],
 ```
 
-The generated preload tag like following:
+The generated preload tag like the following:
 
 ```html
 <link rel="preload" href="js/main.c608b1cd.js" as="script" />
@@ -1411,7 +1411,7 @@ preload: [
 ],
 ```
 
-The generated preload tags like following:
+The generated preload tags like the following:
 
 ```html
 <link rel="preload" href="img/apple.697ef306.png" as="image" type="image/png" />
@@ -2003,7 +2003,7 @@ type Sources =
         tag: string;
         attribute: string;
         value: string;
-        attributes: string;
+        attributes: { [k: string]: string };
         resourcePath: string;
       }) => boolean | undefined;
     }>;

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "html-bundler-webpack-plugin",
-  "version": "2.14.3",
+  "version": "2.14.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.",
   "keywords": [
     "html",

diff --git a/src/Common/HtmlParser.js b/src/Common/HtmlParser.js
@@ -116,7 +116,7 @@ class HtmlParser {
     let endPos = 0;
 
     while ((startPos = content.indexOf(open, startPos)) >= 0) {
-      let attrValues = [];
+      const parsedAttrs = [];
       endPos = indexOfChar(close, content, startPos, '<');
 
       if (endPos < 1) {
@@ -127,7 +127,7 @@ class HtmlParser {
 
       const source = content.slice(startPos, endPos);
       let type = 'asset';
-      let attrsAll = null;
+      let attrs = null;
 
       if (tag === 'script') {
         type = 'script';
@@ -137,42 +137,42 @@ class HtmlParser {
       }
 
       for (let attribute of attributes) {
-        const attrValue = this.parseAttr(source, attribute, type, startPos);
-        if (attrValue === false) continue;
+        const parsedAttr = this.parseAttr(source, attribute, type, startPos);
+        if (parsedAttr === false) continue;
 
         let res = true;
 
         if (filter) {
-          let value = attrValue.value;
+          let value = parsedAttr.value;
 
           // when is the filter defined, parse all attributes once
-          if (!attrsAll) {
-            attrsAll = this.parseAttrAll(source);
+          if (!attrs) {
+            attrs = this.parseAttrAll(source);
           }
 
-          res = filter({ tag, attribute, value, attributes: attrsAll, resourcePath }) !== false;
+          res = filter({ tag, attribute, value, attributes: attrs, resourcePath }) !== false;
         }
 
         if (res === true) {
-          if (attrValue.attrs) {
-            attrValues.push(...attrValue.attrs);
+          if (parsedAttr.attrs) {
+            parsedAttrs.push(...parsedAttr.attrs);
           } else {
-            attrValues.push(attrValue);
+            parsedAttrs.push(parsedAttr);
           }
         }
       }
 
       // sort attributes by pos
-      if (attrValues.length > 1) {
-        attrValues.sort(comparePos);
+      if (parsedAttrs.length > 1) {
+        parsedAttrs.sort(comparePos);
       }
 
       result.push({
         tag,
         source,
         type,
-        attrs: attrValues,
-        attrsAll,
+        parsedAttrs,
+        attrs,
         startPos,
         endPos,
       });
@@ -187,7 +187,7 @@ class HtmlParser {
    * Parse all attributes in the tag.
    *
    * @param {string} content The HTML tag.
-   * @return {{}}
+   * @return {{ [k: string]: string }}
    */
   static parseAttrAll(content) {
     let attrs = {};

diff --git a/src/Loader/Template.js b/src/Loader/Template.js
@@ -32,8 +32,8 @@ class Template {
     let output = '';
     let pos = 0;
 
-    for (let { type, attrs } of parsedTags) {
-      for (let { startPos, endPos, value: file, offset } of attrs) {
+    for (let { type, parsedAttrs } of parsedTags) {
+      for (let { startPos, endPos, value: file, offset } of parsedAttrs) {
         const resolvedFile = this.resolve({ isBasedir, type, file, issuer, entryId });
         // skip not resolvable value, e.g. URL
         if (!resolvedFile) continue;

diff --git a/src/Plugin/Collection.js b/src/Plugin/Collection.js
@@ -913,19 +913,19 @@ class Collection {
         let pos = 0;
         let output = '';
 
-        for (const { tag, attrs, attrsAll, startPos, endPos } of parsedResults) {
-          if (!attrsAll || attrs.length < 1) continue;
+        for (const { tag, parsedAttrs, attrs, startPos, endPos } of parsedResults) {
+          if (!attrs || parsedAttrs.length < 1) continue;
 
-          const assetFile = attrsAll.href || attrsAll.src;
+          const assetFile = attrs.href || attrs.src;
           const integrity = assetIntegrity.get(assetFile);
 
           if (integrity) {
-            attrsAll.integrity = integrity;
-            attrsAll.crossorigin = Options.webpackOptions.output.crossOriginLoading || 'anonymous';
+            attrs.integrity = integrity;
+            attrs.crossorigin = Options.webpackOptions.output.crossOriginLoading || 'anonymous';
 
             let attrsStr = '';
-            for (const attrName in attrsAll) {
-              attrsStr += ` ${attrName}="${attrsAll[attrName]}"`;
+            for (const attrName in attrs) {
+              attrsStr += ` ${attrName}="${attrs[attrName]}"`;
             }
 
             output += content.slice(pos, startPos) + `<${tag}${attrsStr}>`;

diff --git a/test/unit.test.js b/test/unit.test.js
@@ -268,7 +268,7 @@ describe('parse tags unit tests', () => {
         type: 'asset',
         startPos: 0,
         endPos: 31,
-        attrs: [
+        parsedAttrs: [
           {
             type: 'asset',
             attr: 'src',
@@ -278,7 +278,7 @@ describe('parse tags unit tests', () => {
             offset: 0,
           },
         ],
-        attrsAll: null,
+        attrs: null,
       },
     ];
     return expect(received).toEqual(expected);
@@ -296,7 +296,7 @@ describe('parse tags unit tests', () => {
         type: 'asset',
         startPos: 5,
         endPos: 58,
-        attrs: [
+        parsedAttrs: [
           {
             type: 'asset',
             attr: 'src',
@@ -322,7 +322,7 @@ describe('parse tags unit tests', () => {
             offset: 5,
           },
         ],
-        attrsAll: null,
+        attrs: null,
       },
     ];
     return expect(received).toEqual(expected);

diff --git a/types.d.ts b/types.d.ts
@@ -200,7 +200,7 @@ type Preload = Array<{
   as?: string;
   rel?: string;
   type?: string;
-  attributes?: {};
+  attributes?: { [k: string]: string | boolean };
 }>;
 
 type Sources =
@@ -212,7 +212,7 @@ type Sources =
         tag: string;
         attribute: string;
         value: string;
-        attributes: string;
+        attributes: { [k: string]: string };
         resourcePath: string;
       }) => boolean | undefined;
     }>;