@markuplint/config-presets 3.0.0-alpha.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +21 -0
- package/README.md +75 -0
- package/build.mjs +99 -0
- package/package.json +21 -0
- package/preset.___test.json +3 -0
- package/preset.a11y.json +1 -0
- package/preset.code-styles.json +1 -0
- package/preset.html-standard.json +1 -0
- package/preset.performance.json +1 -0
- package/preset.rdfa.json +1 -0
- package/preset.recommended-react.json +1 -0
- package/preset.recommended-static-html.json +1 -0
- package/preset.recommended-svelte.json +1 -0
- package/preset.recommended-vue.json +1 -0
- package/preset.recommended.json +1 -0
- package/preset.security.json +1 -0
- package/src/README.md +39 -0
- package/src/preset.a11y.json +153 -0
- package/src/preset.code-styles.json +3 -0
- package/src/preset.html-standard.json +116 -0
- package/src/preset.performance.json +70 -0
- package/src/preset.rdfa.json +27 -0
- package/src/preset.recommended-react.json +19 -0
- package/src/preset.recommended-static-html.json +19 -0
- package/src/preset.recommended-svelte.json +19 -0
- package/src/preset.recommended-vue.json +19 -0
- package/src/preset.recommended.json +10 -0
- package/src/preset.security.json +23 -0
package/LICENSE
ADDED
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) 2017-2019 Yusuke Hirao
|
|
4
|
+
|
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
+
in the Software without restriction, including without limitation the rights
|
|
8
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
+
furnished to do so, subject to the following conditions:
|
|
11
|
+
|
|
12
|
+
The above copyright notice and this permission notice shall be included in all
|
|
13
|
+
copies or substantial portions of the Software.
|
|
14
|
+
|
|
15
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
+
SOFTWARE.
|
package/README.md
ADDED
|
@@ -0,0 +1,75 @@
|
|
|
1
|
+
# @markuplint/config-presets
|
|
2
|
+
|
|
3
|
+
[](https://www.npmjs.com/package/@markuplint/config-presets)
|
|
4
|
+
[](https://travis-ci.org/markuplint/markuplint)
|
|
5
|
+
[](https://coveralls.io/github/markuplint/markuplint?branch=main)
|
|
6
|
+
|
|
7
|
+
## Usage
|
|
8
|
+
|
|
9
|
+
To the `extends` property of the configuration, specify like below:
|
|
10
|
+
|
|
11
|
+
```json
|
|
12
|
+
{
|
|
13
|
+
"exnteds": ["markuplint:recommended"]
|
|
14
|
+
}
|
|
15
|
+
```
|
|
16
|
+
|
|
17
|
+
You can choose some presets appropriately for your preference.
|
|
18
|
+
|
|
19
|
+
```json
|
|
20
|
+
{
|
|
21
|
+
"exnteds": ["markuplint:html-standard", "markuplint:a11y"]
|
|
22
|
+
}
|
|
23
|
+
```
|
|
24
|
+
|
|
25
|
+
## Presets
|
|
26
|
+
|
|
27
|
+
Ruleset|Description|`recommended`|`recommended-vue`|`recommended-svelte`|`recommended-static-html`|`recommended-react`|`a11y`|`code-styles`|`html-standard`|`performance`|`rdfa`|`security`|
|
|
28
|
+
---|---|---|---|---|---|---|---|---|---|---|---|---|
|
|
29
|
+
[Disallow `<hgroup>`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/hgroup)|The hgroup element should not be used because no assistive technology supports it.|✅|✅|✅|✅|✅|✅|❌|❌|❌|❌|❌|
|
|
30
|
+
[Must not duplicate **ID**](https://www.w3.org/WAI/WCAG21/Techniques/html/H93.html)|Be able to avoid problems in assistive technologies from the viewpoint of machine readability.|✅|✅|✅|✅|✅|✅|❌|✅|❌|❌|❌|
|
|
31
|
+
[Disallow `autofocus` attr](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/autofocus#accessibility_considerations)||✅|✅|✅|✅|✅|✅|❌|❌|❌|❌|❌|
|
|
32
|
+
[`tabindex` attr only `-1` or `0`](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex#accessibility_concerns)||✅|✅|✅|✅|✅|✅|❌|❌|❌|❌|❌|
|
|
33
|
+
[Use **landmark**](https://www.w3.org/TR/wai-aria-practices/examples/landmarks/)||✅|✅|✅|✅|✅|✅|❌|❌|❌|❌|❌|
|
|
34
|
+
No refer to no existent **ID**||✅|✅|✅|✅|✅|✅|❌|✅|❌|❌|❌|
|
|
35
|
+
Require **accessible name**||✅|✅|✅|✅|✅|✅|❌|❌|❌|❌|❌|
|
|
36
|
+
Require `<h1>`||✅|✅|✅|✅|✅|✅|❌|❌|❌|❌|❌|
|
|
37
|
+
Use `<ul>`||✅|✅|✅|✅|✅|✅|❌|❌|❌|❌|❌|
|
|
38
|
+
Conform to **WAI-ARIA**||✅|✅|✅|✅|✅|✅|❌|❌|❌|❌|❌|
|
|
39
|
+
Require `<html lang>`||✅|✅|✅|✅|✅|✅|❌|❌|❌|❌|❌|
|
|
40
|
+
Require `<abbr title>`||✅|✅|✅|✅|✅|✅|❌|❌|❌|❌|❌|
|
|
41
|
+
Require `<track>`||✅|✅|✅|✅|✅|✅|❌|❌|❌|❌|❌|
|
|
42
|
+
Require `<video muted>`||✅|✅|✅|✅|✅|✅|❌|❌|❌|❌|❌|
|
|
43
|
+
No merge cells||✅|✅|✅|✅|✅|✅|❌|❌|❌|❌|❌|
|
|
44
|
+
[No duplicate attr](https://html.spec.whatwg.org/multipage/parsing.html#parse-error-duplicate-attribute)|The parser ignores all such duplicate occurrences of the attribute.|✅|✅|✅|✅|✅|❌|❌|✅|❌|❌|❌|
|
|
45
|
+
Use **character reference**||✅|✅|✅|✅|✅|❌|❌|✅|❌|❌|❌|
|
|
46
|
+
No use depreacted attr|You should not use deprecated attributes from the viewpoint of compatibility.|✅|✅|✅|✅|✅|❌|❌|✅|❌|❌|❌|
|
|
47
|
+
No use depreacted element|You should not use deprecated elements from the viewpoint of compatibility.|✅|✅|✅|✅|✅|❌|❌|✅|❌|❌|❌|
|
|
48
|
+
[Require `doctype`](https://html.spec.whatwg.org/multipage/syntax.html#syntax-doctype)|It has the effect of avoiding quirks mode.|✅|✅|✅|✅|✅|❌|❌|✅|❌|❌|❌|
|
|
49
|
+
No use ineffective attr||✅|✅|✅|✅|✅|❌|❌|✅|❌|❌|❌|
|
|
50
|
+
Allow only **permitted contents**||✅|✅|✅|✅|✅|❌|❌|✅|❌|❌|❌|
|
|
51
|
+
Specify required attr||✅|✅|✅|✅|✅|❌|❌|✅|❌|❌|❌|
|
|
52
|
+
[Specify `charset=UTF-8`](https://html.spec.whatwg.org/multipage/semantics.html#charset)||✅|✅|✅|✅|✅|❌|❌|✅|❌|❌|❌|
|
|
53
|
+
[No use `<small>` as **subheadings**](https://html.spec.whatwg.org/multipage/text-level-semantics.html#the-small-element)|Should not use it in `<h1>`, `<h2>`, `<h3>`, `<h4>`, `<h5>`, and `<h6>`.|✅|✅|✅|✅|✅|❌|❌|✅|❌|❌|❌|
|
|
54
|
+
[No use `<caption>` within `<figure>`](https://html.spec.whatwg.org/multipage/tables.html#the-caption-element)|When `<table>` is the only content in `<figure>` other than `<figcaption>`, `<caption>` should be omitted in favor of `<figcaption>`.|✅|✅|✅|✅|✅|❌|❌|✅|❌|❌|❌|
|
|
55
|
+
[Require `charset=UTF-8`](https://html.spec.whatwg.org/multipage/semantics.html#charset)||✅|✅|✅|✅|✅|❌|❌|❌|✅|❌|❌|
|
|
56
|
+
Require `defer` attr|Should load and parse scripts lazily to avoid render-blocking.|✅|✅|✅|✅|✅|❌|❌|❌|✅|❌|❌|
|
|
57
|
+
Require **aspect-ratio**|Require `width` and `height` attr with `<img>` to avoid **Cumulative Layout Shift**|✅|✅|✅|✅|✅|❌|❌|❌|✅|❌|❌|
|
|
58
|
+
Require async decoding image|Require `decoding=async` with `<img>` to avoid render-blocking.|✅|✅|✅|✅|✅|❌|❌|❌|✅|❌|❌|
|
|
59
|
+
Require loading `<iframe>` lazily|Require `loading=lazy` with `<iframe>` to avoid render-blocking that causes loading if its element is out of the viewport.|✅|✅|✅|✅|✅|❌|❌|❌|✅|❌|❌|
|
|
60
|
+
Allow `property` attr with `<meta>`|Be able to use **Open-Graph** etc.|✅|✅|✅|✅|✅|❌|❌|❌|❌|✅|❌|
|
|
61
|
+
No hard coding **ID**|The component that hard-coded ID cannot mount to an app duplicately because the IDs must be unique in a document. Recommend to specify dynamic IDs to avoid doing that.|❌|✅|✅|❌|✅|❌|❌|❌|❌|❌|❌|
|
|
62
|
+
No omit **end-tag**|Recommend to write an end-tag always because it is too difficult for a human decide an element is end-tag omittable.|❌|❌|❌|✅|❌|❌|❌|❌|❌|❌|❌|
|
|
63
|
+
Require `noreferrer` with `target=_blank`|Require `rel=noreferrer` with an element that has `target=_blank` to prevent leaking referrer information and to block operating referrer documents.|✅|✅|✅|✅|✅|❌|❌|❌|❌|❌|✅|
|
|
64
|
+
|
|
65
|
+
## Install
|
|
66
|
+
|
|
67
|
+
`markuplint` package includes this package.
|
|
68
|
+
|
|
69
|
+
If you are installing purposely, how below:
|
|
70
|
+
|
|
71
|
+
```sh
|
|
72
|
+
$ npm install @markuplint/config-presets
|
|
73
|
+
|
|
74
|
+
$ yarn add @markuplint/config-presets
|
|
75
|
+
```
|
package/build.mjs
ADDED
|
@@ -0,0 +1,99 @@
|
|
|
1
|
+
import { readFile, rm, writeFile } from 'fs/promises';
|
|
2
|
+
import path from 'path';
|
|
3
|
+
import { fileURLToPath } from 'url';
|
|
4
|
+
import glob from 'glob';
|
|
5
|
+
import { promisify } from 'util';
|
|
6
|
+
import { stripComments, visit } from 'jsonc-parser';
|
|
7
|
+
import mustache from 'mustache';
|
|
8
|
+
|
|
9
|
+
const asyncGlob = promisify(glob);
|
|
10
|
+
|
|
11
|
+
const dirname = path.dirname(fileURLToPath(import.meta.url));
|
|
12
|
+
const srcDir = path.resolve(dirname, 'src');
|
|
13
|
+
|
|
14
|
+
const currents = await asyncGlob('preset.*.json,!preset.___json');
|
|
15
|
+
await Promise.all(currents.map(current => rm(current)));
|
|
16
|
+
|
|
17
|
+
const files = await asyncGlob(path.resolve(srcDir, '*.json'));
|
|
18
|
+
const md = await readFile(path.resolve(srcDir, 'README.md'), { encoding: 'utf-8' });
|
|
19
|
+
|
|
20
|
+
const presets = [];
|
|
21
|
+
const rules = {};
|
|
22
|
+
const extended = {};
|
|
23
|
+
|
|
24
|
+
for (const file of files) {
|
|
25
|
+
const filename = path.basename(file);
|
|
26
|
+
const code = await readFile(path.resolve(dirname, 'src', filename), { encoding: 'utf-8' });
|
|
27
|
+
const json = JSON.parse(stripComments(code));
|
|
28
|
+
const compressed = JSON.stringify(json);
|
|
29
|
+
await writeFile(path.resolve(dirname, filename), compressed, { encoding: 'utf-8' });
|
|
30
|
+
|
|
31
|
+
const name = filename.replace(/^preset\.|\.json/g, '');
|
|
32
|
+
presets.push(name);
|
|
33
|
+
extended[name] = (json['extends'] || []).map(name => name.replace('markuplint:', ''));
|
|
34
|
+
|
|
35
|
+
visit(
|
|
36
|
+
code,
|
|
37
|
+
{
|
|
38
|
+
onComment(offset, length) {
|
|
39
|
+
const comment = code.substring(offset, offset + length);
|
|
40
|
+
const line = comment.split('\n');
|
|
41
|
+
const text = line
|
|
42
|
+
.map(line =>
|
|
43
|
+
line
|
|
44
|
+
.trim()
|
|
45
|
+
.replace(/^\/\*\*|^\*\/|^\*\s*/g, '')
|
|
46
|
+
.trim(),
|
|
47
|
+
)
|
|
48
|
+
.filter(s => s);
|
|
49
|
+
const heading = text.shift();
|
|
50
|
+
const desc = text.filter(t => !/^@see\s/i.test(t));
|
|
51
|
+
const url = (text.find(t => /^@see\s/i.test(t)) || '').replace(/^@see\s/i, '');
|
|
52
|
+
|
|
53
|
+
if (!heading) {
|
|
54
|
+
return;
|
|
55
|
+
}
|
|
56
|
+
|
|
57
|
+
if (rules[heading]?.config) {
|
|
58
|
+
rules[heading].config.push(name);
|
|
59
|
+
} else {
|
|
60
|
+
rules[heading] = {
|
|
61
|
+
desc,
|
|
62
|
+
url,
|
|
63
|
+
config: [name],
|
|
64
|
+
};
|
|
65
|
+
}
|
|
66
|
+
},
|
|
67
|
+
},
|
|
68
|
+
{ disallowComments: false },
|
|
69
|
+
);
|
|
70
|
+
}
|
|
71
|
+
|
|
72
|
+
presets.sort((a, b) => {
|
|
73
|
+
if (a.includes('recommended')) {
|
|
74
|
+
return -1;
|
|
75
|
+
}
|
|
76
|
+
return a - b;
|
|
77
|
+
});
|
|
78
|
+
|
|
79
|
+
const renderMd = mustache.render(md, {
|
|
80
|
+
presets: () => {
|
|
81
|
+
const line = [];
|
|
82
|
+
line.push(`Ruleset|Description|${presets.map(p => `\`${p}\``).join('|')}|`);
|
|
83
|
+
line.push(`---|---|${'---|'.repeat(presets.length)}`);
|
|
84
|
+
|
|
85
|
+
Object.entries(rules).forEach(([name, context]) => {
|
|
86
|
+
const title = context.url ? `[${name}](${context.url})` : name;
|
|
87
|
+
const checks = presets.map(preset => {
|
|
88
|
+
const configs = [preset, ...extended[preset]];
|
|
89
|
+
const has = configs.some(config => context.config?.includes(config));
|
|
90
|
+
return has ? '✅' : '❌';
|
|
91
|
+
});
|
|
92
|
+
line.push(`${title}|${context.desc.join(' ')}|${checks.join('|')}|`);
|
|
93
|
+
});
|
|
94
|
+
|
|
95
|
+
return line.join('\n');
|
|
96
|
+
},
|
|
97
|
+
});
|
|
98
|
+
|
|
99
|
+
await writeFile('README.md', renderMd, { encoding: 'utf-8' });
|
package/package.json
ADDED
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@markuplint/config-presets",
|
|
3
|
+
"version": "3.0.0-alpha.0",
|
|
4
|
+
"description": "markuplint config presets",
|
|
5
|
+
"repository": "git@github.com:markuplint/markuplint.git",
|
|
6
|
+
"author": "Yusuke Hirao <yusukehirao@me.com>",
|
|
7
|
+
"license": "MIT",
|
|
8
|
+
"private": false,
|
|
9
|
+
"publishConfig": {
|
|
10
|
+
"access": "public"
|
|
11
|
+
},
|
|
12
|
+
"scripts": {
|
|
13
|
+
"build": "node build.mjs"
|
|
14
|
+
},
|
|
15
|
+
"devDependencies": {
|
|
16
|
+
"glob": "^8.0.3",
|
|
17
|
+
"jsonc-parser": "^3.0.0",
|
|
18
|
+
"mustache": "^4.2.0"
|
|
19
|
+
},
|
|
20
|
+
"gitHead": "d32c522e016888e20bcbb5f09352c006b964f193"
|
|
21
|
+
}
|
package/preset.a11y.json
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"rules":{"disallowed-element":["hgroup"],"id-duplication":true,"invalid-attr":{"option":{"attrs":{"autofocus":{"disallowed":true},"accesskey":{"disallowed":true},"tabindex":{"enum":["-1","0"]}}}},"landmark-roles":true,"no-refer-to-non-existent-id":true,"require-accessible-name":true,"required-h1":true,"use-list":true,"wai-aria":true},"nodeRules":[{"selector":":where(html)","rules":{"required-attr":["lang"]}},{"selector":":where(abbr)","rules":{"required-attr":["title"]}},{"selector":":where(video, audio)","rules":{"required-element":["track"]}},{"selector":":where(video[autoplay])","rules":{"required-attr":["muted"]}},{"selector":":where(th, td)","rules":{"invalid-attr":{"option":{"attrs":{"colspan":{"disallowed":true},"rowspan":{"disallowed":true}}}}}}]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"rules":{}}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"rules":{"attr-duplication":true,"character-reference":true,"deprecated-attr":true,"deprecated-element":true,"doctype":true,"id-duplication":true,"ineffective-attr":true,"no-refer-to-non-existent-id":true,"permitted-contents":true,"required-attr":true},"nodeRules":[{"selector":":where(head)","rules":{"required-element":["meta[charset=\"UTF-8\" i]"]}},{"selector":"h1, h2, h3, h4, h5, h6","rules":{"disallowed-element":{"value":["small"],"reason":"The small element must not be used for subheadings. https://html.spec.whatwg.org/multipage/text-level-semantics.html#the-small-element"}}},{"selector":":where(figcaption ~ table, table:has(~ figcaption))","rules":{"disallowed-element":{"value":["caption"],"reason":"When a table element is the only content in a figure element other than the figcaption, the caption element should be omitted in favor of the figcaption. (https://html.spec.whatwg.org/multipage/tables.html#the-caption-element)"},"require-accessible-name":false}}]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"nodeRules":[{"selector":":where(head)","rules":{"required-element":["meta[charset=\"UTF-8\" i]"]}},{"selector":":where(script[src]:not([type=module]))","rules":{"required-attr":["defer"]}},{"selector":":where(img[src])","rules":{"required-attr":["width","height"]}},{"selector":":where(img[src][width][height])","rules":{"required-attr":[{"name":"decoding","value":"async"}]}},{"selector":":where(iframe)","rules":{"required-attr":["title",{"name":"loading","value":"lazy"}]}}]}
|
package/preset.rdfa.json
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"nodeRules":[{"selector":":where(meta[property])","rules":{"invalid-attr":{"option":{"attrs":{"property":{"type":"NoEmptyAny"},"content":{"type":"NoEmptyAny"}}}},"required-attr":false}}]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"extends":["markuplint:code-style","markuplint:html-standard","markuplint:a11y","markuplint:performance","markuplint:security","markuplint:rdfa"],"rules":{"no-hard-code-id":true}}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"extends":["markuplint:code-style","markuplint:html-standard","markuplint:a11y","markuplint:performance","markuplint:security","markuplint:rdfa"],"rules":{"end-tag":true}}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"extends":["markuplint:code-style","markuplint:html-standard","markuplint:a11y","markuplint:performance","markuplint:security","markuplint:rdfa"],"rules":{"no-hard-code-id":true}}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"extends":["markuplint:code-style","markuplint:html-standard","markuplint:a11y","markuplint:performance","markuplint:security","markuplint:rdfa"],"rules":{"no-hard-code-id":true}}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"extends":["markuplint:code-style","markuplint:html-standard","markuplint:a11y","markuplint:performance","markuplint:security","markuplint:rdfa"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"nodeRules":[{"selector":":where(a[target=_blank], area[target=_blank])","rules":{"required-attr":{"value":[{"name":"rel","value":"/(?<![^\\s]+)noreferrer(?![^\\s]+)/"}],"reason":"The \"rel\" attribute should be required with \"noreferrer\" if the \"a\" element has the \"target=_blank\""}}}]}
|
package/src/README.md
ADDED
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
# @markuplint/config-presets
|
|
2
|
+
|
|
3
|
+
[](https://www.npmjs.com/package/@markuplint/config-presets)
|
|
4
|
+
[](https://travis-ci.org/markuplint/markuplint)
|
|
5
|
+
[](https://coveralls.io/github/markuplint/markuplint?branch=main)
|
|
6
|
+
|
|
7
|
+
## Usage
|
|
8
|
+
|
|
9
|
+
To the `extends` property of the configuration, specify like below:
|
|
10
|
+
|
|
11
|
+
```json
|
|
12
|
+
{
|
|
13
|
+
"exnteds": ["markuplint:recommended"]
|
|
14
|
+
}
|
|
15
|
+
```
|
|
16
|
+
|
|
17
|
+
You can choose some presets appropriately for your preference.
|
|
18
|
+
|
|
19
|
+
```json
|
|
20
|
+
{
|
|
21
|
+
"exnteds": ["markuplint:html-standard", "markuplint:a11y"]
|
|
22
|
+
}
|
|
23
|
+
```
|
|
24
|
+
|
|
25
|
+
## Presets
|
|
26
|
+
|
|
27
|
+
{{{ presets }}}
|
|
28
|
+
|
|
29
|
+
## Install
|
|
30
|
+
|
|
31
|
+
`markuplint` package includes this package.
|
|
32
|
+
|
|
33
|
+
If you are installing purposely, how below:
|
|
34
|
+
|
|
35
|
+
```sh
|
|
36
|
+
$ npm install @markuplint/config-presets
|
|
37
|
+
|
|
38
|
+
$ yarn add @markuplint/config-presets
|
|
39
|
+
```
|
|
@@ -0,0 +1,153 @@
|
|
|
1
|
+
{
|
|
2
|
+
"rules": {
|
|
3
|
+
"disallowed-element": [
|
|
4
|
+
/**
|
|
5
|
+
* Disallow `<hgroup>`
|
|
6
|
+
*
|
|
7
|
+
* The hgroup element should not be used because no assistive technology supports it.
|
|
8
|
+
*
|
|
9
|
+
* @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/hgroup
|
|
10
|
+
*/
|
|
11
|
+
"hgroup"
|
|
12
|
+
],
|
|
13
|
+
|
|
14
|
+
/**
|
|
15
|
+
* Must not duplicate **ID**
|
|
16
|
+
*
|
|
17
|
+
* Be able to avoid problems in assistive technologies from the viewpoint of machine readability.
|
|
18
|
+
*
|
|
19
|
+
* @see https://www.w3.org/WAI/WCAG21/Techniques/html/H93.html
|
|
20
|
+
*/
|
|
21
|
+
"id-duplication": true,
|
|
22
|
+
|
|
23
|
+
"invalid-attr": {
|
|
24
|
+
"option": {
|
|
25
|
+
"attrs": {
|
|
26
|
+
/**
|
|
27
|
+
* Disallow `autofocus` attr
|
|
28
|
+
*
|
|
29
|
+
* @see https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/autofocus#accessibility_considerations
|
|
30
|
+
*/
|
|
31
|
+
"autofocus": {
|
|
32
|
+
"disallowed": true
|
|
33
|
+
},
|
|
34
|
+
|
|
35
|
+
/**
|
|
36
|
+
* Disallow `autofocus` attr
|
|
37
|
+
*
|
|
38
|
+
* @see https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/accesskey#accessibility_concerns
|
|
39
|
+
*/
|
|
40
|
+
"accesskey": {
|
|
41
|
+
"disallowed": true
|
|
42
|
+
},
|
|
43
|
+
|
|
44
|
+
/**
|
|
45
|
+
* `tabindex` attr only `-1` or `0`
|
|
46
|
+
*
|
|
47
|
+
* @see https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex#accessibility_concerns
|
|
48
|
+
*/
|
|
49
|
+
"tabindex": {
|
|
50
|
+
"enum": ["-1", "0"]
|
|
51
|
+
}
|
|
52
|
+
}
|
|
53
|
+
}
|
|
54
|
+
},
|
|
55
|
+
|
|
56
|
+
/**
|
|
57
|
+
* Use **landmark**
|
|
58
|
+
*
|
|
59
|
+
* @see https://www.w3.org/TR/wai-aria-practices/examples/landmarks/
|
|
60
|
+
*/
|
|
61
|
+
"landmark-roles": true,
|
|
62
|
+
|
|
63
|
+
/**
|
|
64
|
+
* No refer to no existent **ID**
|
|
65
|
+
*/
|
|
66
|
+
"no-refer-to-non-existent-id": true,
|
|
67
|
+
|
|
68
|
+
/**
|
|
69
|
+
* Require **accessible name**
|
|
70
|
+
*/
|
|
71
|
+
"require-accessible-name": true,
|
|
72
|
+
|
|
73
|
+
/**
|
|
74
|
+
* Require `<h1>`
|
|
75
|
+
*
|
|
76
|
+
*/
|
|
77
|
+
"required-h1": true,
|
|
78
|
+
|
|
79
|
+
/**
|
|
80
|
+
* Use `<ul>`
|
|
81
|
+
*
|
|
82
|
+
*/
|
|
83
|
+
"use-list": true,
|
|
84
|
+
|
|
85
|
+
/**
|
|
86
|
+
* Conform to **WAI-ARIA**
|
|
87
|
+
*
|
|
88
|
+
*/
|
|
89
|
+
"wai-aria": true
|
|
90
|
+
},
|
|
91
|
+
"nodeRules": [
|
|
92
|
+
{
|
|
93
|
+
"selector": ":where(html)",
|
|
94
|
+
"rules": {
|
|
95
|
+
/**
|
|
96
|
+
* Require `<html lang>`
|
|
97
|
+
*
|
|
98
|
+
*/
|
|
99
|
+
"required-attr": ["lang"]
|
|
100
|
+
}
|
|
101
|
+
},
|
|
102
|
+
{
|
|
103
|
+
"selector": ":where(abbr)",
|
|
104
|
+
"rules": {
|
|
105
|
+
/**
|
|
106
|
+
* Require `<abbr title>`
|
|
107
|
+
*/
|
|
108
|
+
"required-attr": ["title"]
|
|
109
|
+
}
|
|
110
|
+
},
|
|
111
|
+
{
|
|
112
|
+
"selector": ":where(video, audio)",
|
|
113
|
+
"rules": {
|
|
114
|
+
/**
|
|
115
|
+
* Require `<track>`
|
|
116
|
+
*
|
|
117
|
+
*/
|
|
118
|
+
"required-element": ["track"]
|
|
119
|
+
}
|
|
120
|
+
},
|
|
121
|
+
{
|
|
122
|
+
"selector": ":where(video[autoplay])",
|
|
123
|
+
"rules": {
|
|
124
|
+
/**
|
|
125
|
+
* Require `<video muted>`
|
|
126
|
+
*
|
|
127
|
+
*/
|
|
128
|
+
"required-attr": ["muted"]
|
|
129
|
+
}
|
|
130
|
+
},
|
|
131
|
+
{
|
|
132
|
+
/**
|
|
133
|
+
* No merge cells
|
|
134
|
+
*
|
|
135
|
+
*/
|
|
136
|
+
"selector": ":where(th, td)",
|
|
137
|
+
"rules": {
|
|
138
|
+
"invalid-attr": {
|
|
139
|
+
"option": {
|
|
140
|
+
"attrs": {
|
|
141
|
+
"colspan": {
|
|
142
|
+
"disallowed": true
|
|
143
|
+
},
|
|
144
|
+
"rowspan": {
|
|
145
|
+
"disallowed": true
|
|
146
|
+
}
|
|
147
|
+
}
|
|
148
|
+
}
|
|
149
|
+
}
|
|
150
|
+
}
|
|
151
|
+
}
|
|
152
|
+
]
|
|
153
|
+
}
|
|
@@ -0,0 +1,116 @@
|
|
|
1
|
+
{
|
|
2
|
+
"rules": {
|
|
3
|
+
/**
|
|
4
|
+
* No duplicate attr
|
|
5
|
+
*
|
|
6
|
+
* The parser ignores all such duplicate occurrences of the attribute.
|
|
7
|
+
*
|
|
8
|
+
* @see https://html.spec.whatwg.org/multipage/parsing.html#parse-error-duplicate-attribute
|
|
9
|
+
*/
|
|
10
|
+
"attr-duplication": true,
|
|
11
|
+
|
|
12
|
+
/**
|
|
13
|
+
* Use **character reference**
|
|
14
|
+
*
|
|
15
|
+
*/
|
|
16
|
+
"character-reference": true,
|
|
17
|
+
|
|
18
|
+
/**
|
|
19
|
+
* No use depreacted attr
|
|
20
|
+
*
|
|
21
|
+
* You should not use deprecated attributes from the viewpoint of compatibility.
|
|
22
|
+
*/
|
|
23
|
+
"deprecated-attr": true,
|
|
24
|
+
|
|
25
|
+
/**
|
|
26
|
+
* No use depreacted element
|
|
27
|
+
*
|
|
28
|
+
* You should not use deprecated elements from the viewpoint of compatibility.
|
|
29
|
+
*/
|
|
30
|
+
"deprecated-element": true,
|
|
31
|
+
|
|
32
|
+
/**
|
|
33
|
+
* Require `doctype`
|
|
34
|
+
*
|
|
35
|
+
* It has the effect of avoiding quirks mode.
|
|
36
|
+
*
|
|
37
|
+
* @see https://html.spec.whatwg.org/multipage/syntax.html#syntax-doctype
|
|
38
|
+
*/
|
|
39
|
+
"doctype": true,
|
|
40
|
+
|
|
41
|
+
/**
|
|
42
|
+
* Must not duplicate **ID**
|
|
43
|
+
*
|
|
44
|
+
*/
|
|
45
|
+
"id-duplication": true,
|
|
46
|
+
|
|
47
|
+
/**
|
|
48
|
+
* No use ineffective attr
|
|
49
|
+
*
|
|
50
|
+
*/
|
|
51
|
+
"ineffective-attr": true,
|
|
52
|
+
|
|
53
|
+
/**
|
|
54
|
+
* No refer to no existent **ID**
|
|
55
|
+
*/
|
|
56
|
+
"no-refer-to-non-existent-id": true,
|
|
57
|
+
|
|
58
|
+
/**
|
|
59
|
+
* Allow only **permitted contents**
|
|
60
|
+
*
|
|
61
|
+
*/
|
|
62
|
+
"permitted-contents": true,
|
|
63
|
+
|
|
64
|
+
/**
|
|
65
|
+
* Specify required attr
|
|
66
|
+
*
|
|
67
|
+
*/
|
|
68
|
+
"required-attr": true
|
|
69
|
+
},
|
|
70
|
+
"nodeRules": [
|
|
71
|
+
{
|
|
72
|
+
/**
|
|
73
|
+
* Specify `charset=UTF-8`
|
|
74
|
+
*
|
|
75
|
+
* @see https://html.spec.whatwg.org/multipage/semantics.html#charset
|
|
76
|
+
*/
|
|
77
|
+
"selector": ":where(head)",
|
|
78
|
+
"rules": {
|
|
79
|
+
"required-element": ["meta[charset=\"UTF-8\" i]"]
|
|
80
|
+
}
|
|
81
|
+
},
|
|
82
|
+
{
|
|
83
|
+
/**
|
|
84
|
+
* No use `<small>` as **subheadings**
|
|
85
|
+
*
|
|
86
|
+
* Should not use it in `<h1>`, `<h2>`, `<h3>`, `<h4>`, `<h5>`, and `<h6>`.
|
|
87
|
+
*
|
|
88
|
+
* @see https://html.spec.whatwg.org/multipage/text-level-semantics.html#the-small-element
|
|
89
|
+
*/
|
|
90
|
+
"selector": "h1, h2, h3, h4, h5, h6",
|
|
91
|
+
"rules": {
|
|
92
|
+
"disallowed-element": {
|
|
93
|
+
"value": ["small"],
|
|
94
|
+
"reason": "The small element must not be used for subheadings. https://html.spec.whatwg.org/multipage/text-level-semantics.html#the-small-element"
|
|
95
|
+
}
|
|
96
|
+
}
|
|
97
|
+
},
|
|
98
|
+
{
|
|
99
|
+
/**
|
|
100
|
+
* No use `<caption>` within `<figure>`
|
|
101
|
+
*
|
|
102
|
+
* When `<table>` is the only content in `<figure>` other than `<figcaption>`, `<caption>` should be omitted in favor of `<figcaption>`.
|
|
103
|
+
*
|
|
104
|
+
* @see https://html.spec.whatwg.org/multipage/tables.html#the-caption-element
|
|
105
|
+
*/
|
|
106
|
+
"selector": ":where(figcaption ~ table, table:has(~ figcaption))",
|
|
107
|
+
"rules": {
|
|
108
|
+
"disallowed-element": {
|
|
109
|
+
"value": ["caption"],
|
|
110
|
+
"reason": "When a table element is the only content in a figure element other than the figcaption, the caption element should be omitted in favor of the figcaption. (https://html.spec.whatwg.org/multipage/tables.html#the-caption-element)"
|
|
111
|
+
},
|
|
112
|
+
"require-accessible-name": false
|
|
113
|
+
}
|
|
114
|
+
}
|
|
115
|
+
]
|
|
116
|
+
}
|
|
@@ -0,0 +1,70 @@
|
|
|
1
|
+
{
|
|
2
|
+
"nodeRules": [
|
|
3
|
+
{
|
|
4
|
+
/**
|
|
5
|
+
* Require `charset=UTF-8`
|
|
6
|
+
*
|
|
7
|
+
* @see https://html.spec.whatwg.org/multipage/semantics.html#charset
|
|
8
|
+
*/
|
|
9
|
+
"selector": ":where(head)",
|
|
10
|
+
"rules": {
|
|
11
|
+
"required-element": ["meta[charset=\"UTF-8\" i]"]
|
|
12
|
+
}
|
|
13
|
+
},
|
|
14
|
+
{
|
|
15
|
+
/**
|
|
16
|
+
* Require `defer` attr
|
|
17
|
+
*
|
|
18
|
+
* Should load and parse scripts lazily to avoid render-blocking.
|
|
19
|
+
*/
|
|
20
|
+
"selector": ":where(script[src]:not([type=module]))",
|
|
21
|
+
"rules": {
|
|
22
|
+
"required-attr": ["defer"]
|
|
23
|
+
}
|
|
24
|
+
},
|
|
25
|
+
{
|
|
26
|
+
/**
|
|
27
|
+
* Require **aspect-ratio**
|
|
28
|
+
*
|
|
29
|
+
* Require `width` and `height` attr with `<img>` to avoid **Cumulative Layout Shift**
|
|
30
|
+
*/
|
|
31
|
+
"selector": ":where(img[src])",
|
|
32
|
+
"rules": {
|
|
33
|
+
"required-attr": ["width", "height"]
|
|
34
|
+
}
|
|
35
|
+
},
|
|
36
|
+
{
|
|
37
|
+
/**
|
|
38
|
+
* Require async decoding image
|
|
39
|
+
*
|
|
40
|
+
* Require `decoding=async` with `<img>` to avoid render-blocking.
|
|
41
|
+
*/
|
|
42
|
+
"selector": ":where(img[src][width][height])",
|
|
43
|
+
"rules": {
|
|
44
|
+
"required-attr": [
|
|
45
|
+
{
|
|
46
|
+
"name": "decoding",
|
|
47
|
+
"value": "async"
|
|
48
|
+
}
|
|
49
|
+
]
|
|
50
|
+
}
|
|
51
|
+
},
|
|
52
|
+
{
|
|
53
|
+
/**
|
|
54
|
+
* Require loading `<iframe>` lazily
|
|
55
|
+
*
|
|
56
|
+
* Require `loading=lazy` with `<iframe>` to avoid render-blocking that causes loading if its element is out of the viewport.
|
|
57
|
+
*/
|
|
58
|
+
"selector": ":where(iframe)",
|
|
59
|
+
"rules": {
|
|
60
|
+
"required-attr": [
|
|
61
|
+
"title",
|
|
62
|
+
{
|
|
63
|
+
"name": "loading",
|
|
64
|
+
"value": "lazy"
|
|
65
|
+
}
|
|
66
|
+
]
|
|
67
|
+
}
|
|
68
|
+
}
|
|
69
|
+
]
|
|
70
|
+
}
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
{
|
|
2
|
+
"nodeRules": [
|
|
3
|
+
{
|
|
4
|
+
/**
|
|
5
|
+
* Allow `property` attr with `<meta>`
|
|
6
|
+
*
|
|
7
|
+
* Be able to use **Open-Graph** etc.
|
|
8
|
+
*/
|
|
9
|
+
"selector": ":where(meta[property])",
|
|
10
|
+
"rules": {
|
|
11
|
+
"invalid-attr": {
|
|
12
|
+
"option": {
|
|
13
|
+
"attrs": {
|
|
14
|
+
"property": {
|
|
15
|
+
"type": "NoEmptyAny"
|
|
16
|
+
},
|
|
17
|
+
"content": {
|
|
18
|
+
"type": "NoEmptyAny"
|
|
19
|
+
}
|
|
20
|
+
}
|
|
21
|
+
}
|
|
22
|
+
},
|
|
23
|
+
"required-attr": false
|
|
24
|
+
}
|
|
25
|
+
}
|
|
26
|
+
]
|
|
27
|
+
}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
{
|
|
2
|
+
"extends": [
|
|
3
|
+
"markuplint:code-style",
|
|
4
|
+
"markuplint:html-standard",
|
|
5
|
+
"markuplint:a11y",
|
|
6
|
+
"markuplint:performance",
|
|
7
|
+
"markuplint:security",
|
|
8
|
+
"markuplint:rdfa"
|
|
9
|
+
],
|
|
10
|
+
"rules": {
|
|
11
|
+
/**
|
|
12
|
+
* No hard coding **ID**
|
|
13
|
+
*
|
|
14
|
+
* The component that hard-coded ID cannot mount to an app duplicately because the IDs must be unique in a document.
|
|
15
|
+
* Recommend to specify dynamic IDs to avoid doing that.
|
|
16
|
+
*/
|
|
17
|
+
"no-hard-code-id": true
|
|
18
|
+
}
|
|
19
|
+
}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
{
|
|
2
|
+
"extends": [
|
|
3
|
+
"markuplint:code-style",
|
|
4
|
+
"markuplint:html-standard",
|
|
5
|
+
"markuplint:a11y",
|
|
6
|
+
"markuplint:performance",
|
|
7
|
+
"markuplint:security",
|
|
8
|
+
"markuplint:rdfa"
|
|
9
|
+
],
|
|
10
|
+
"rules": {
|
|
11
|
+
/**
|
|
12
|
+
* No omit **end-tag**
|
|
13
|
+
*
|
|
14
|
+
* Recommend to write an end-tag always because it is too difficult
|
|
15
|
+
* for a human decide an element is end-tag omittable.
|
|
16
|
+
*/
|
|
17
|
+
"end-tag": true
|
|
18
|
+
}
|
|
19
|
+
}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
{
|
|
2
|
+
"extends": [
|
|
3
|
+
"markuplint:code-style",
|
|
4
|
+
"markuplint:html-standard",
|
|
5
|
+
"markuplint:a11y",
|
|
6
|
+
"markuplint:performance",
|
|
7
|
+
"markuplint:security",
|
|
8
|
+
"markuplint:rdfa"
|
|
9
|
+
],
|
|
10
|
+
"rules": {
|
|
11
|
+
/**
|
|
12
|
+
* No hard coding **ID**
|
|
13
|
+
*
|
|
14
|
+
* The component that hard-coded ID cannot mount to an app duplicately because the IDs must be unique in a document.
|
|
15
|
+
* Recommend to specify dynamic IDs to avoid doing that.
|
|
16
|
+
*/
|
|
17
|
+
"no-hard-code-id": true
|
|
18
|
+
}
|
|
19
|
+
}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
{
|
|
2
|
+
"extends": [
|
|
3
|
+
"markuplint:code-style",
|
|
4
|
+
"markuplint:html-standard",
|
|
5
|
+
"markuplint:a11y",
|
|
6
|
+
"markuplint:performance",
|
|
7
|
+
"markuplint:security",
|
|
8
|
+
"markuplint:rdfa"
|
|
9
|
+
],
|
|
10
|
+
"rules": {
|
|
11
|
+
/**
|
|
12
|
+
* No hard coding **ID**
|
|
13
|
+
*
|
|
14
|
+
* The component that hard-coded ID cannot mount to an app duplicately because the IDs must be unique in a document.
|
|
15
|
+
* Recommend to specify dynamic IDs to avoid doing that.
|
|
16
|
+
*/
|
|
17
|
+
"no-hard-code-id": true
|
|
18
|
+
}
|
|
19
|
+
}
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
{
|
|
2
|
+
"nodeRules": [
|
|
3
|
+
{
|
|
4
|
+
/**
|
|
5
|
+
* Require `noreferrer` with `target=_blank`
|
|
6
|
+
*
|
|
7
|
+
* Require `rel=noreferrer` with an element that has `target=_blank` to prevent leaking referrer information and to block operating referrer documents.
|
|
8
|
+
*/
|
|
9
|
+
"selector": ":where(a[target=_blank], area[target=_blank])",
|
|
10
|
+
"rules": {
|
|
11
|
+
"required-attr": {
|
|
12
|
+
"value": [
|
|
13
|
+
{
|
|
14
|
+
"name": "rel",
|
|
15
|
+
"value": "/(?<![^\\s]+)noreferrer(?![^\\s]+)/"
|
|
16
|
+
}
|
|
17
|
+
],
|
|
18
|
+
"reason": "The \"rel\" attribute should be required with \"noreferrer\" if the \"a\" element has the \"target=_blank\""
|
|
19
|
+
}
|
|
20
|
+
}
|
|
21
|
+
}
|
|
22
|
+
]
|
|
23
|
+
}
|