feat: add new lint rule “no-entities-in-attributes”

__tests__/examples/no-enties-in-attributes/document.html

@@ -0,0 +1,4 @@
+<div style="font-family:
+&quot;Franklin Gothic Medium&quot;,
+&quot;Arial Narrow&quot;,
+Arial, sans-serif;">

__tests__/examples/no-enties-in-attributes/errors.js

@@ -0,0 +1,54 @@
+module.exports = [
+    {
+        type: 'error',
+        col: 1,
+        evidence: ""Franklin Gothic Medium",",
+        line: 2,
+        message: "Invalid entity [ " ] encapsulated in the [ style ] attribute on line 2.",
+        raw: """,
+        rule: {
+            description: "No HTML entities within tag attributes.",
+            id: "no-enties-in-attributes",
+            link: "https://thecapsule.email/docs/codes/no-enties-in-attributes",
+        }
+    },
+    {
+        type: 'error',
+        col: 29,
+        evidence: ""Franklin Gothic Medium",",
+        line: 2,
+        message: "Invalid entity [ " ] encapsulated in the [ style ] attribute on line 2.",
+        raw: """,
+        rule: {
+            description: "No HTML entities within tag attributes.",
+            id: "no-enties-in-attributes",
+            link: "https://thecapsule.email/docs/codes/no-enties-in-attributes",
+        }
+    },
+    {
+        type: 'error',
+        col: 1,
+        evidence: ""Arial Narrow",",
+        line: 3,
+        message: "Invalid entity [ " ] encapsulated in the [ style ] attribute on line 3.",
+        raw: """,
+        rule: {
+            description: "No HTML entities within tag attributes.",
+            id: "no-enties-in-attributes",
+            link: "https://thecapsule.email/docs/codes/no-enties-in-attributes",
+        }
+    },
+    {
+        type: 'error',
+        col: 19,
+        evidence: ""Arial Narrow",",
+        line: 3,
+        message: "Invalid entity [ " ] encapsulated in the [ style ] attribute on line 3.",
+        raw: """,
+        rule: {
+            description: "No HTML entities within tag attributes.",
+            id: "no-enties-in-attributes",
+            link: "https://thecapsule.email/docs/codes/no-enties-in-attributes",
+        }
+    }    
+]

__tests__/freemarker.spec.ts

@@ -1,8 +1,6 @@
 import { parse } from '../src/parser';
 
 test('that the following freemarker syntax will parse', () => {
-    console.log(parse('before<#if a></#if>after'));
-
     expect(parse('before<#if a></#if>after')).toEqual([
         'before',
         '<#if a>',

__tests__/rules.spec.ts

@@ -95,6 +95,12 @@ describe('Rule: "valid-path-format"', () => {
     });
 });
 
+describe('Rule: "no-enties-in-attributes"', () => {
+    it('Throws errors when HTML entities are inside of tag attributes.', () => {
+        rule('no-enties-in-attributes');
+    });
+});
+
 describe('Rule: "freemarker-tags"', () => {
     it('Throws errors for invalid freemarker tags.', () => {
         rule('freemarker-tags');

demo/App.vue

@@ -3,7 +3,9 @@ import { TextareaField } from '@vue-interface/textarea-field';
 import { ref, watchEffect } from 'vue';
 import { lint } from '../src/index';
 
-const document = ref<string>(`asdasd<#if a></#if>`);
+const document = ref<string>(`<div style="
+aaaaasdasdasdasd
+&quot;test&quot;">test</div>`);
 
 const errors = ref<any[]>();
 

src/capsule.config.ts

@@ -12,6 +12,7 @@ export default {
 	"img-src-required": true,
 	"invalid-attribute-char": true,
 	"nested-paragraphs": true,
+	"no-enties-in-attributes": true,
 	"spec-char-escape": true,
 	"src-not-empty": true,
 	"tag-pair": true,

src/rules/index.ts

@@ -10,6 +10,7 @@ import htmlValidChildrenOrder from './html-valid-children-order';
 import imgSrcRequired from './img-src-required';
 import invalidAttributeChar from './invalid-attribute-char';
 import nestedParagraphs from './nested-paragraphs';
+import noEntiesInAttributes from './no-enties-in-attributes';
 import specialCharEscape from './special-char-escape';
 import tagPair from './tag-pair';
 import validPathFormat from './valid-path-format';
@@ -27,6 +28,7 @@ export default {
     'img-src-required': imgSrcRequired,
     'invalid-attribute-char': invalidAttributeChar,
     'nested-paragraphs': nestedParagraphs,
+    'no-enties-in-attributes': noEntiesInAttributes,
     'special-char-escape': specialCharEscape,
     'tag-pair': tagPair,
     'valid-path-format': validPathFormat,

src/rules/no-enties-in-attributes.ts

@@ -0,0 +1,50 @@
+import { Rule } from 'htmlhint/types';
+
+const rule: Rule = {
+    id: 'no-enties-in-attributes',
+    description: 'No HTML entities within tag attributes.',
+    init(parser, reporter) {
+        parser.addListener('tagstart', event => {
+            event.attrs.forEach(({ value, name }) => {
+                value.split(/[\n\r\v]/gi).reduce(({ line, col }, str) => {
+                    const matches = str.match(
+                        /&([a-z0-9]+|#[0-9]{1,6}|#x[0-9a-fA-F]{1,6});/ig
+                    );
+
+                    if(!matches) {
+                        return {
+                            line: line + 1,
+                            col: 0
+                        };
+                    }
+
+                    let offset = 0;
+
+                    for(const match of matches) {
+                        const index = str.indexOf(match, offset);
+
+                        reporter.error(
+                            `Invalid entity [ ${match} ] encapsulated in the [ ${name} ] attribute on line ${line}.`,
+                            line,
+                            col + index + 1,
+                            this,
+                            match
+                        );
+
+                        offset = str.indexOf(match, offset) + match.length;
+                    }
+
+                    return {
+                        line: line + 1,
+                        col: 0
+                    };
+                }, {
+                    line: event.line,
+                    col: event.raw.indexOf(value)
+                });
+            });
+        });
+    }
+}
+
+export default rule;