@markuplint/rules 2.0.0-rc.0 → 2.0.0-rc.1

package/lib/index.js

@@ -12,13 +12,21 @@ const character_reference_1 = (0, tslib_1.__importDefault)(require("./character-
 const class_naming_1 = (0, tslib_1.__importDefault)(require("./class-naming"));
 const deprecated_attr_1 = (0, tslib_1.__importDefault)(require("./deprecated-attr"));
 const deprecated_element_1 = (0, tslib_1.__importDefault)(require("./deprecated-element"));
+const disallowed_element_1 = (0, tslib_1.__importDefault)(require("./disallowed-element"));
 const doctype_1 = (0, tslib_1.__importDefault)(require("./doctype"));
 const id_duplication_1 = (0, tslib_1.__importDefault)(require("./id-duplication"));
 const indentation_1 = (0, tslib_1.__importDefault)(require("./indentation"));
+const ineffective_attr_1 = (0, tslib_1.__importDefault)(require("./ineffective-attr"));
 const invalid_attr_1 = (0, tslib_1.__importDefault)(require("./invalid-attr"));
 const landmark_roles_1 = (0, tslib_1.__importDefault)(require("./landmark-roles"));
+const no_boolean_attr_value_1 = (0, tslib_1.__importDefault)(require("./no-boolean-attr-value"));
+const no_default_value_1 = (0, tslib_1.__importDefault)(require("./no-default-value"));
+const no_hard_code_id_1 = (0, tslib_1.__importDefault)(require("./no-hard-code-id"));
+const no_refer_to_non_existent_id_1 = (0, tslib_1.__importDefault)(require("./no-refer-to-non-existent-id"));
+const no_use_event_handler_attr_1 = (0, tslib_1.__importDefault)(require("./no-use-event-handler-attr"));
 const permitted_contents_1 = (0, tslib_1.__importDefault)(require("./permitted-contents"));
 const required_attr_1 = (0, tslib_1.__importDefault)(require("./required-attr"));
+const required_element_1 = (0, tslib_1.__importDefault)(require("./required-element"));
 const required_h1_1 = (0, tslib_1.__importDefault)(require("./required-h1"));
 const wai_aria_1 = (0, tslib_1.__importDefault)(require("./wai-aria"));
 exports.default = {
@@ -33,13 +41,21 @@ exports.default = {
     'class-naming': class_naming_1.default,
     'deprecated-attr': deprecated_attr_1.default,
     'deprecated-element': deprecated_element_1.default,
+    'disallowed-element': disallowed_element_1.default,
     doctype: doctype_1.default,
     'id-duplication': id_duplication_1.default,
     indentation: indentation_1.default,
+    'ineffective-attr': ineffective_attr_1.default,
     'invalid-attr': invalid_attr_1.default,
     'landmark-roles': landmark_roles_1.default,
+    'no-boolean-attr-value': no_boolean_attr_value_1.default,
+    'no-default-value': no_default_value_1.default,
+    'no-hard-code-id': no_hard_code_id_1.default,
+    'no-refer-to-non-existent-id': no_refer_to_non_existent_id_1.default,
+    'no-use-event-handler-attr': no_use_event_handler_attr_1.default,
     'permitted-contents': permitted_contents_1.default,
     'required-attr': required_attr_1.default,
+    'required-element': required_element_1.default,
     'required-h1': required_h1_1.default,
     'wai-aria': wai_aria_1.default,
 };

package/lib/ineffective-attr/index.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("@markuplint/ml-core").RuleSeed<import("@markuplint/ml-core").RuleConfigValue, null>;
+export default _default;

package/lib/ineffective-attr/index.js

@@ -0,0 +1,40 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const ml_core_1 = require("@markuplint/ml-core");
+exports.default = (0, ml_core_1.createRule)({
+    defaultServerity: 'warning',
+    async verify({ document, report, t }) {
+        document.walkOn('Element', el => {
+            const attrSpec = (0, ml_core_1.getAttrSpecs)(el.nameWithNS, document.specs);
+            if (!attrSpec) {
+                return;
+            }
+            for (const attr of el.attributes) {
+                if (attr.attrType === 'ps-attr') {
+                    continue;
+                }
+                const name = attr.getName().potential;
+                const spec = attrSpec.find(s => s.name === name);
+                if (!spec) {
+                    continue;
+                }
+                const ineffectiveConditions = spec.ineffective
+                    ? Array.isArray(spec.ineffective)
+                        ? spec.ineffective
+                        : [spec.ineffective]
+                    : [];
+                if (ineffectiveConditions.some(selector => el.matches(selector))) {
+                    report({
+                        scope: el,
+                        raw: attr.raw,
+                        line: attr.startLine,
+                        col: attr.startCol,
+                        message: t('{0} is {1:c}', t('the "{0}" {1}', name, 'attribute'), 'ineffective') +
+                            t('. ') +
+                            t("It doesn't need {0}", t('the {0}', 'attribute')),
+                    });
+                }
+            }
+        });
+    },
+});

package/lib/invalid-attr/index.d.ts

@@ -4,11 +4,13 @@ declare type Option = {
     ignoreAttrNamePrefix?: string | string[];
 };
 declare type Rule = {
-    enum: string[];
+    enum: [string, ...string[]];
 } | {
     pattern: string;
 } | {
     type: AttributeType;
+} | {
+    disallowed: true;
 };
-declare const _default: import("@markuplint/ml-core").RuleSeed<true, Option>;
+declare const _default: import("@markuplint/ml-core").RuleSeed<boolean, Option>;
 export default _default;

package/lib/invalid-attr/index.js

@@ -2,13 +2,15 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 const ml_core_1 = require("@markuplint/ml-core");
 const attr_check_1 = require("../attr-check");
+const debug_1 = require("../debug");
 const helpers_1 = require("../helpers");
+const log = debug_1.log.extend('invalid-attr');
 exports.default = (0, ml_core_1.createRule)({
-    defaultValue: true,
     defaultOptions: {},
     async verify({ document, report, t }) {
         await document.walkOn('Element', async (node) => {
-            const attrSpecs = (0, helpers_1.getAttrSpecs)(node.nameWithNS, document.specs);
+            var _a, _b, _c, _d, _e, _f, _g, _h;
+            const attrSpecs = (0, ml_core_1.getAttrSpecs)(node.nameWithNS, document.specs);
             for (const attr of node.attributes) {
                 if (attr.attrType === 'html-attr' && attr.isDirective) {
                     continue;
@@ -29,7 +31,7 @@ exports.default = (0, ml_core_1.createRule)({
                     continue;
                 }
                 const attrValue = attr.getValue();
-                const value = attrValue.raw;
+                const value = attrValue.potential;
                 if (node.rule.option.ignoreAttrNamePrefix) {
                     const ignoreAttrNamePrefixes = Array.isArray(node.rule.option.ignoreAttrNamePrefix)
                         ? node.rule.option.ignoreAttrNamePrefix
@@ -61,9 +63,16 @@ exports.default = (0, ml_core_1.createRule)({
                     else if ('type' in customRule) {
                         invalid = (0, attr_check_1.attrCheck)(t, name, value, true, { name, type: customRule.type, description: '' });
                     }
+                    else if ('disallowed' in customRule && customRule.disallowed) {
+                        invalid = {
+                            invalidType: 'non-existent',
+                            message: t('{0} is disallowed', t('the "{0}" {1}', name, 'attribute')),
+                        };
+                    }
                 }
                 else if (!node.isCustomElement && attrSpecs) {
-                    invalid = (0, helpers_1.isValidAttr)(t, name, value, (attr.attrType === 'html-attr' && attr.isDynamicValue) || false, node, attrSpecs);
+                    log('Checking %s[%s="%s"]', node.nodeName, name, value);
+                    invalid = (0, helpers_1.isValidAttr)(t, name, value, (attr.attrType === 'html-attr' && attr.isDynamicValue) || false, node, attrSpecs, log);
                 }
                 if (invalid) {
                     switch (invalid.invalidType) {
@@ -71,9 +80,9 @@ exports.default = (0, ml_core_1.createRule)({
                             report({
                                 scope: node,
                                 message: invalid.message,
-                                line: attrValue.line,
-                                col: attrValue.col,
-                                raw: value,
+                                line: attrValue.line + ((_b = (_a = invalid.loc) === null || _a === void 0 ? void 0 : _a.line) !== null && _b !== void 0 ? _b : 0),
+                                col: ((_c = invalid.loc) === null || _c === void 0 ? void 0 : _c.line) ? ((_d = invalid.loc) === null || _d === void 0 ? void 0 : _d.col) + 1 : attrValue.col + ((_f = (_e = invalid.loc) === null || _e === void 0 ? void 0 : _e.col) !== null && _f !== void 0 ? _f : 0),
+                                raw: (_h = (_g = invalid.loc) === null || _g === void 0 ? void 0 : _g.raw) !== null && _h !== void 0 ? _h : value,
                             });
                             break;
                         }

package/lib/landmark-roles/index.js

@@ -13,7 +13,6 @@ const selectors = {
 const topLevelRoles = ['banner', 'main', 'complementary', 'contentinfo'];
 exports.default = (0, ml_core_1.createRule)({
     defaultServerity: 'warning',
-    defaultValue: true,
     defaultOptions: {
         ignoreRoles: [],
         labelEachArea: true,

package/lib/no-boolean-attr-value/index.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("@markuplint/ml-core").RuleSeed<import("@markuplint/ml-core").RuleConfigValue, null>;
+export default _default;

package/lib/no-boolean-attr-value/index.js

@@ -0,0 +1,47 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const ml_core_1 = require("@markuplint/ml-core");
+exports.default = (0, ml_core_1.createRule)({
+    defaultServerity: 'warning',
+    async verify({ document, report, t }) {
+        await document.walkOn('Element', el => {
+            const attrSpec = (0, ml_core_1.getAttrSpecs)(el.nameWithNS, document.specs);
+            if (!attrSpec) {
+                return;
+            }
+            for (const attr of el.attributes) {
+                if (attr.attrType === 'ps-attr') {
+                    continue;
+                }
+                const name = attr.getName().potential;
+                const spec = attrSpec.find(s => s.name === name);
+                if (!spec) {
+                    continue;
+                }
+                if (spec.type !== 'Boolean') {
+                    continue;
+                }
+                const extraTokens = [
+                    attr.spacesBeforeEqual,
+                    attr.equal,
+                    attr.spacesAfterEqual,
+                    attr.startQuote,
+                    attr.value,
+                    attr.endQuote,
+                ];
+                const extraRaw = extraTokens.reduce((raw, t) => raw + t.raw, '');
+                if (extraRaw) {
+                    report({
+                        scope: el,
+                        raw: extraRaw,
+                        line: attr.spacesBeforeEqual.startLine,
+                        col: attr.spacesBeforeEqual.startCol,
+                        message: t('{0} is {1}', t('the "{0}" {1}', name, 'attribute'), t('a {0}', 'boolean attribute')) +
+                            t('. ') +
+                            t("It doesn't need {0}", t('the {0}', 'value')),
+                    });
+                }
+            }
+        });
+    },
+});

package/lib/no-default-value/index.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("@markuplint/ml-core").RuleSeed<import("@markuplint/ml-core").RuleConfigValue, null>;
+export default _default;

package/lib/no-default-value/index.js

@@ -0,0 +1,38 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const ml_core_1 = require("@markuplint/ml-core");
+const helpers_1 = require("../helpers");
+exports.default = (0, ml_core_1.createRule)({
+    defaultServerity: 'warning',
+    async verify({ document, report, t }) {
+        await document.walkOn('Element', el => {
+            const attrSpec = (0, ml_core_1.getAttrSpecs)(el.nameWithNS, document.specs);
+            if (!attrSpec) {
+                return;
+            }
+            for (const attr of el.attributes) {
+                if (attr.attrType !== 'html-attr') {
+                    continue;
+                }
+                const spec = attrSpec.find(s => s.name === attr.getName().potential);
+                if (!spec) {
+                    continue;
+                }
+                if (!spec.defaultValue) {
+                    continue;
+                }
+                const normalizedValue = (0, helpers_1.toNormalizedValue)(attr.getValue().potential, spec);
+                const defaultValue = (0, helpers_1.toNormalizedValue)(spec.defaultValue, spec);
+                if (defaultValue === normalizedValue) {
+                    report({
+                        scope: el,
+                        line: attr.value.startLine,
+                        col: attr.value.startCol,
+                        raw: attr.value.raw,
+                        message: t('It is {0}', t('the {0}', 'default value')),
+                    });
+                }
+            }
+        });
+    },
+});

package/lib/no-hard-code-id/index.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("@markuplint/ml-core").RuleSeed<import("@markuplint/ml-core").RuleConfigValue, null>;
+export default _default;

package/lib/no-hard-code-id/index.js

@@ -0,0 +1,27 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const ml_core_1 = require("@markuplint/ml-core");
+exports.default = (0, ml_core_1.createRule)({
+    defaultServerity: 'warning',
+    async verify({ document, report, t }) {
+        if (!document.isFragment) {
+            return;
+        }
+        await document.walkOn('Element', el => {
+            for (const attr of el.attributes) {
+                if ((attr.attrType === 'html-attr' && !attr.isDynamicValue) ||
+                    (attr.attrType === 'ps-attr' &&
+                        attr.potentialName.toLowerCase() === 'id' &&
+                        attr.valueType !== 'code')) {
+                    report({
+                        scope: el,
+                        line: attr.startLine,
+                        col: attr.startCol,
+                        raw: attr.raw,
+                        message: t('It is {0:c}', 'hard-coded'),
+                    });
+                }
+            }
+        });
+    },
+});

package/lib/no-refer-to-non-existent-id/index.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("@markuplint/ml-core").RuleSeed<import("@markuplint/ml-core").RuleConfigValue, null>;
+export default _default;

package/lib/no-refer-to-non-existent-id/index.js

@@ -0,0 +1,110 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const ml_core_1 = require("@markuplint/ml-core");
+const helpers_1 = require("../helpers");
+exports.default = (0, ml_core_1.createRule)({
+    async verify({ document, report, t }) {
+        const { ariaAttrs } = (0, helpers_1.ariaSpec)();
+        const idList = new Set();
+        let hasDynamicId = false;
+        await document.walkOn('Element', el => {
+            for (const attr of el.attributes) {
+                if (attr.getName().potential.toLowerCase() !== 'id') {
+                    continue;
+                }
+                if (attr.attrType === 'html-attr') {
+                    if (attr.isDynamicValue) {
+                        hasDynamicId = true;
+                    }
+                    idList.add(attr.getValue().potential);
+                }
+                else {
+                    if (attr.valueType !== 'code') {
+                        idList.add(attr.getValue().potential);
+                    }
+                }
+            }
+        });
+        if (hasDynamicId) {
+            return;
+        }
+        document.walkOn('Element', el => {
+            const attrSpec = (0, ml_core_1.getAttrSpecs)(el.nameWithNS, document.specs);
+            if (!attrSpec) {
+                return;
+            }
+            for (const attr of el.attributes) {
+                if (attr.attrType !== 'html-attr') {
+                    continue;
+                }
+                const name = attr.getName().potential;
+                if (name.toLowerCase() === 'id') {
+                    continue;
+                }
+                const value = attr.getValue().potential;
+                const spec = attrSpec.find(s => s.name === name);
+                if (spec) {
+                    // DOMID and DOMID List do not become in the array type.
+                    if (Array.isArray(spec.type)) {
+                        continue;
+                    }
+                    if (spec.type === 'DOMID' && !idList.has(value)) {
+                        report({
+                            scope: el,
+                            line: attr.value.startLine,
+                            col: attr.value.startCol,
+                            raw: attr.value.raw,
+                            message: t('Missing {0}', t('"{0*}" ID', value)),
+                        });
+                    }
+                    if (typeof spec.type !== 'string' && 'token' in spec.type && spec.type.token === 'DOMID') {
+                        const refs = value
+                            .split(spec.type.separator === 'space' ? /\s/ : ',')
+                            .map(id => id.trim())
+                            .filter(_ => _);
+                        for (const ref of refs) {
+                            if (!idList.has(ref)) {
+                                report({
+                                    scope: el,
+                                    line: attr.value.startLine,
+                                    col: attr.value.startCol,
+                                    raw: attr.value.raw,
+                                    message: t('Missing {0}', t('"{0*}" ID', ref)),
+                                });
+                            }
+                        }
+                    }
+                }
+                const aria = ariaAttrs.find(aria => aria.name === name);
+                if (aria) {
+                    if (aria.value === 'ID reference' && !idList.has(value)) {
+                        report({
+                            scope: el,
+                            line: attr.value.startLine,
+                            col: attr.value.startCol,
+                            raw: attr.value.raw,
+                            message: t('Missing {0}', t('"{0*}" ID', value)),
+                        });
+                    }
+                    else if (aria.value === 'ID reference list') {
+                        const refs = value
+                            .split(/\s/)
+                            .map(id => id.trim())
+                            .filter(_ => _);
+                        for (const ref of refs) {
+                            if (!idList.has(ref)) {
+                                report({
+                                    scope: el,
+                                    line: attr.value.startLine,
+                                    col: attr.value.startCol,
+                                    raw: attr.value.raw,
+                                    message: t('Missing {0}', t('"{0*}" ID', ref)),
+                                });
+                            }
+                        }
+                    }
+                }
+            }
+        });
+    },
+});

package/lib/no-use-event-handler-attr/index.d.ts

@@ -0,0 +1,5 @@
+declare type Options = {
+    ignore?: string | string[];
+};
+declare const _default: import("@markuplint/ml-core").RuleSeed<boolean, Options>;
+export default _default;

package/lib/no-use-event-handler-attr/index.js

@@ -0,0 +1,37 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const ml_core_1 = require("@markuplint/ml-core");
+const helpers_1 = require("../helpers");
+exports.default = (0, ml_core_1.createRule)({
+    defaultServerity: 'warning',
+    defaultOptions: {},
+    async verify({ document, report, t }) {
+        await document.walkOn('Element', el => {
+            if (el.isCustomElement) {
+                return;
+            }
+            const ignoreList = Array.isArray(el.rule.option.ignore)
+                ? el.rule.option.ignore
+                : el.rule.option.ignore
+                    ? [el.rule.option.ignore]
+                    : [];
+            el.attributes.forEach(attr => {
+                const name = attr.getName().potential;
+                for (const ignore of ignoreList) {
+                    if ((0, helpers_1.match)(name, ignore)) {
+                        return;
+                    }
+                }
+                if (/^on/i.test(name)) {
+                    report({
+                        scope: el,
+                        raw: attr.raw,
+                        line: attr.startLine,
+                        col: attr.startCol,
+                        message: t('{0} is disallowed', t('the "{0}" {1}', name, 'attribute')),
+                    });
+                }
+            });
+        });
+    },
+});

package/lib/permitted-contents/index.js

@@ -166,8 +166,19 @@ function getRegExpFromParentNode(node, expGen) {
     const parentExp = node.parentNode ? getRegExpFromNode(node.parentNode, expGen) : null;
     return parentExp;
 }
+const matchingCacheMap = new Map();
 function match(exp, childNodes, ownNS, evalCustomElement) {
     const target = normalization(childNodes, ownNS, evalCustomElement);
+    const cacheKey = target + exp.source + childNodes.map(n => (n.type == 'Element' ? n.toNormalizeString() : n.originRaw)).join('');
+    const res = matchingCacheMap.get(cacheKey);
+    if (res != null) {
+        return res;
+    }
+    const matched = _match(target, exp, childNodes);
+    matchingCacheMap.set(cacheKey, matched);
+    return matched;
+}
+function _match(target, exp, childNodes) {
     const result = exp.exec(target);
     if (!result) {
         return false;

package/lib/require-element/index.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("@markuplint/ml-core").RuleSeed<string[], null>;
+export default _default;

package/lib/require-element/index.js

@@ -0,0 +1,38 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const ml_core_1 = require("@markuplint/ml-core");
+exports.default = (0, ml_core_1.createRule)({
+    defaultValue: [],
+    defaultOptions: null,
+    async verify({ document, report, t, globalRule }) {
+        for (const query of globalRule.value) {
+            const exists = document.matchNodes(query);
+            if (exists.length === 0) {
+                const message = t('Require {0}', t('the "{0*}" {1}', query, 'element'));
+                report({
+                    message,
+                    line: 1,
+                    col: 1,
+                    raw: document.nodeList[0].raw.slice(0, 1),
+                });
+            }
+        }
+        await document.walkOn('Element', el => {
+            if (el.rule.value === globalRule.value) {
+                return;
+            }
+            for (const query of el.rule.value) {
+                const exists = el.children.find(child => child.matches(query));
+                if (!exists) {
+                    const message = t('Require {0}', t('the "{0*}" {1}', query, 'element'));
+                    report({
+                        message,
+                        line: 1,
+                        col: 1,
+                        raw: document.nodeList[0].raw.slice(0, 1),
+                    });
+                }
+            }
+        });
+    },
+});

package/lib/required-attr/index.d.ts

@@ -1,3 +1,7 @@
-declare type RequiredAttributes = string | string[];
+declare type RequiredAttributes = string | (string | Attr)[];
+declare type Attr = {
+    name: string;
+    value: string | string[];
+};
 declare const _default: import("@markuplint/ml-core").RuleSeed<RequiredAttributes, null>;
 export default _default;

package/lib/required-attr/index.js

@@ -4,32 +4,47 @@ const ml_core_1 = require("@markuplint/ml-core");
 const helpers_1 = require("../helpers");
 exports.default = (0, ml_core_1.createRule)({
     defaultValue: [],
-    defaultOptions: null,
     async verify({ document, report, t }) {
         await document.walkOn('Element', async (node) => {
+            var _a;
             if (node.hasSpreadAttr) {
                 return;
             }
             const customRequiredAttrs = typeof node.rule.value === 'string' ? [node.rule.value] : node.rule.value;
-            const attrSpec = (0, helpers_1.getAttrSpecs)(node.nameWithNS, document.specs);
-            const attributeSpecs = attrSpec
-                ? attrSpec.map(attr => {
-                    const required = customRequiredAttrs.includes(attr.name);
-                    if (required) {
-                        return {
-                            ...attr,
-                            required: true,
+            const attrSpec = (0, ml_core_1.getAttrSpecs)(node.nameWithNS, document.specs);
+            const attributeSpecs = {};
+            if (attrSpec && !node.isCustomElement) {
+                for (const spec of attrSpec) {
+                    if (spec.required || spec.requiredEither || spec.condition) {
+                        attributeSpecs[spec.name] = {
+                            ...spec,
+                            values: [],
                         };
                     }
-                    return attr;
-                })
-                : customRequiredAttrs.map(attr => ({
-                    name: attr,
+                }
+            }
+            for (const req of customRequiredAttrs) {
+                let name;
+                const values = [];
+                if (typeof req === 'string') {
+                    name = req;
+                }
+                else {
+                    name = req.name;
+                    if (Array.isArray(req.value)) {
+                        values.push(...req.value);
+                    }
+                    else {
+                        values.push(req.value);
+                    }
+                }
+                attributeSpecs[name] = {
+                    name,
+                    values,
                     required: true,
-                    requiredEither: undefined,
-                    condition: undefined,
-                }));
-            for (const spec of attributeSpecs) {
+                };
+            }
+            for (const spec of Object.values(attributeSpecs)) {
                 const didntHave = !node.hasAttribute(spec.name);
                 let invalid = false;
                 if (spec.requiredEither) {
@@ -41,17 +56,43 @@ exports.default = (0, ml_core_1.createRule)({
                 }
                 else if (spec.required) {
                     if ('ancestor' in spec.required && spec.required.ancestor) {
-                        const ancestors = spec.required.ancestor.split(',').map(a => a.trim());
+                        const ancestorList = Array.isArray(spec.required.ancestor)
+                            ? spec.required.ancestor
+                            : [spec.required.ancestor];
+                        const ancestors = ancestorList
+                            .join(',')
+                            .split(',')
+                            .map(a => a.trim());
                         invalid = ancestors.some(a => node.closest(a)) && didntHave;
                     }
                 }
                 if (invalid) {
-                    const message = t('{0} expects {1}', t('the "{0}" {1}', spec.name, 'attribute'), t('the "{0}" {1}', node.nodeName, 'element'));
+                    const message = t('{0} expects {1}', t('the "{0}" {1}', node.nodeName, 'element'), t('the "{0}" {1}', spec.name, 'attribute'));
                     report({
                         scope: node,
                         message,
                     });
                 }
+                const value = node.getAttribute(spec.name);
+                if (spec.values.length && value) {
+                    const matched = spec.values.some(pattern => (0, helpers_1.match)(value, pattern));
+                    if (!matched) {
+                        const expects = spec.values.length === 1 ? t(spec.values) : t('either {0}', t(spec.values));
+                        const message = t('{0} expects {1}', t('the "{0}" {1}', spec.name, 'attribute'), expects);
+                        const attrToken = node.getAttributeToken(spec.name);
+                        const valueToken = ((_a = attrToken[0]) === null || _a === void 0 ? void 0 : _a.attrType) === 'html-attr' ? attrToken[0].value : null;
+                        const token = valueToken || attrToken[0];
+                        report({
+                            scope: {
+                                rule: node.rule,
+                                raw: token.raw,
+                                startCol: token.startCol,
+                                startLine: token.startLine,
+                            },
+                            message,
+                        });
+                    }
+                }
             }
         });
     },

package/lib/required-element/index.d.ts

@@ -0,0 +1,5 @@
+declare type Options = {
+    ignoreHasMutableContents?: boolean;
+};
+declare const _default: import("@markuplint/ml-core").RuleSeed<string[], Options>;
+export default _default;