@markuplint/ml-core 3.8.0 → 3.10.0

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@markuplint/ml-core",
-	"version": "3.8.0",
+	"version": "3.10.0",
 	"description": "The core module of markuplint",
 	"repository": "git@github.com:markuplint/markuplint.git",
 	"author": "Yusuke Hirao <yusukehirao@me.com>",
@@ -23,22 +23,20 @@
 		"./lib/configs.js": "./lib/configs.browser.js"
 	},
 	"dependencies": {
-		"@markuplint/config-presets": "3.6.0",
-		"@markuplint/html-parser": "3.6.1",
-		"@markuplint/html-spec": "3.7.0",
-		"@markuplint/i18n": "3.7.0",
+		"@markuplint/config-presets": "3.6.1",
+		"@markuplint/html-parser": "3.8.0",
+		"@markuplint/html-spec": "3.9.0",
+		"@markuplint/i18n": "3.8.0",
 		"@markuplint/ml-ast": "3.1.0",
-		"@markuplint/ml-config": "3.7.0",
-		"@markuplint/ml-spec": "3.7.0",
-		"@markuplint/parser-utils": "3.6.1",
-		"@markuplint/selector": "3.7.0",
+		"@markuplint/ml-config": "3.9.0",
+		"@markuplint/ml-spec": "3.9.0",
+		"@markuplint/parser-utils": "3.8.0",
+		"@markuplint/selector": "3.9.0",
+		"@types/debug": "^4.1.7",
 		"debug": "^4.3.4",
 		"is-plain-object": "^5.0.0",
-		"tslib": "^2.4.1"
-	},
-	"devDependencies": {
-		"@types/debug": "^4.1.7",
-		"type-fest": "^3.6.1"
+		"tslib": "^2.5.0",
+		"type-fest": "^3.10.0"
 	},
-	"gitHead": "42b97b47d22b37437024e693a72a458e2963e261"
+	"gitHead": "af370797bfc887e5a5a2ff57fbaa8392ac98ead2"
 }

package/test/ml-dom/helper/accname.spec.js

@@ -0,0 +1,85 @@
+const { parse } = require('@markuplint/html-parser');
+
+const { convertRuleset } = require('../../../');
+const { getAccname } = require('../../../lib/ml-dom/helper/accname');
+const { createNode } = require('../../../lib/ml-dom/helper/create-node');
+const { MLDocument } = require('../../../lib/ml-dom/node/document');
+const { dummySchemas } = require('../../../lib/test');
+
+function c(sourceCode) {
+	const ast = parse(sourceCode);
+	const astNode = ast.nodeList[0];
+	const ruleset = convertRuleset({});
+	const document = new MLDocument(ast, ruleset, dummySchemas());
+	const node = createNode(astNode, document);
+	if (node.is(node.ELEMENT_NODE)) {
+		return node;
+	}
+	throw new Error();
+}
+
+test('Get accessible name', () => {
+	expect(getAccname(c('<button>label</button>'), '1.2')).toBe('label');
+	expect(getAccname(c('<div>text</div>'), '1.2')).toBe('');
+	expect(getAccname(c('<div aria-label="label">text</div>'), '1.2')).toBe('label');
+	expect(getAccname(c('<span aria-label="label">text</span>'), '1.2')).toBe('label');
+	expect(getAccname(c('<img alt="alternative-text" />'), '1.2')).toBe('alternative-text');
+	expect(getAccname(c('<img title="title" />'), '1.2')).toBe('title');
+	expect(getAccname(c('<div><label for="a">label</label><input id="a" /></div>').children[1], '1.2')).toBe('label');
+});
+
+test('Invisible element', () => {
+	expect(getAccname(c('<button>label</button>'), '1.2')).toBe('label');
+	expect(getAccname(c('<button aria-disabled="true">label</button>'), '1.2')).toBe('label');
+	expect(getAccname(c('<button aria-hidden="true">label</button>'), '1.2')).toBe('');
+	expect(getAccname(c('<button hidden>label</button>'), '1.2')).toBe('');
+	expect(getAccname(c('<button style="display: none">label</button>'), '1.2')).toBe('label'); // Do not support the style attribute yet.
+});
+
+/**
+ * @see https://www.w3.org/TR/accname-1.1/#ex-1-example-1-element1-id-el1-aria-labelledby-el3-element2-id-el2-aria-labelledby-el1-element3-id-el3-hello-element3
+ */
+test('accname-1.1 Example 1', () => {
+	const complex = c(`<div>
+<input id="el1" aria-labelledby="el3" />
+<input id="el2" aria-labelledby="el1" />
+<h1 id="el3"> hello </h1>
+</div>`);
+	expect(getAccname(complex.children[0], '1.2')).toBe('hello');
+	expect(getAccname(complex.children[1], '1.2')).toBe('');
+	expect(getAccname(complex.children[2], '1.2')).toBe('hello');
+});
+
+/**
+ * https://www.w3.org/TR/accname-1.1/#ex-2-example-2-h1-files-h1-ul-li-a-id-file_row1-href-files-documentation-pdf-documentation-pdf-a-span-role-button-tabindex-0-id-del_row1-aria-label-delete-aria-labelledby-del_row1-file_row1-span-li-li-a-id-file_row2-href-files-holidayletter-pdf-holidayletter-pdf-a-span-role-button-tabindex-0-id-del_row2-aria-label-delete-aria-labelledby-del_row2-file_row2-span-li-ul
+ */
+test('accname-1.1 Example 2', () => {
+	const complex = c(`<ul>
+	<li>
+		<a id="file_row1" href="./files/Documentation.pdf">Documentation.pdf</a>
+		<span role="button" tabindex="0" id="del_row1" aria-label="Delete" aria-labelledby="del_row1 file_row1"></span>
+	</li>
+	<li>
+		<a id="file_row2" href="./files/HolidayLetter.pdf">HolidayLetter.pdf</a>
+		<span role="button" tabindex="0" id="del_row2" aria-label="Delete" aria-labelledby="del_row2 file_row2"></span>
+	</li>
+</ul>`);
+	const spans = complex.querySelectorAll('span');
+	expect(getAccname(spans[0], '1.2')).toBe('Delete Documentation.pdf');
+	expect(getAccname(spans[1], '1.2')).toBe('Delete HolidayLetter.pdf');
+});
+
+/**
+ * https://www.w3.org/TR/accname-1.1/#ex-3-example-3-div-role-checkbox-aria-checked-false-flash-the-screen-span-role-textbox-aria-multiline-false-5-span-times-div
+ */
+test('accname-1.1 Example 3', () => {
+	const complex = c(
+		'<div role="checkbox" aria-checked="false">Flash the screen <span role="textbox" aria-multiline="false"> 5 </span> times</div>',
+	);
+	expect(getAccname(complex, '1.2')).toBe('Flash the screen 5 times');
+});
+
+test('with comment', () => {
+	expect(getAccname(c('<button>label</button>'), '1.2')).toBe('label');
+	expect(getAccname(c('<button>label<!-- comment --></button>'), '1.2')).toBe('label');
+});

package/test/ml-dom/helper/create-node.spec.js

@@ -0,0 +1,18 @@
+const { parse } = require('@markuplint/html-parser');
+
+const { convertRuleset } = require('../../../');
+const { Document } = require('../../../lib/ml-dom/');
+const { createNode } = require('../../../lib/ml-dom/helper/create-node');
+const { dummySchemas } = require('../../../lib/test');
+
+describe('create Node', () => {
+	it('Element', () => {
+		const sourceCode = '<div>text</div>';
+		const ast = parse(sourceCode);
+		const astNode = ast.nodeList[0];
+		const ruleset = convertRuleset({});
+		const document = new Document(ast, ruleset, dummySchemas());
+		const node = createNode(astNode, document);
+		expect(node.raw).toBe('<div>');
+	});
+});

package/test/ml-dom/index.spec.js

@@ -0,0 +1,680 @@
+const { createRule } = require('../../lib/ml-rule/create-test-rule');
+const { createTestDocument, createTestElement, createTestNodeList, createTestTokenList } = require('../../lib/test');
+
+describe('AST', () => {
+	test('node count', () => {
+		const nodeList = createTestNodeList('<div>text</div>');
+		expect(nodeList.length).toBe(2);
+	});
+
+	test('raw', () => {
+		const nodeList = createTestNodeList('<div>text</div>');
+		expect(nodeList[0].raw).toBe('<div>');
+		expect(nodeList[1].raw).toBe('text');
+		expect(nodeList[0].closeTag?.raw).toBe('</div>');
+	});
+
+	test('raw', () => {
+		const tokens = createTestTokenList(`
+<div>
+	text
+</div>`);
+		expect(tokens[0].raw).toBe('\n');
+		expect(tokens[1].raw).toBe('<div>');
+		expect(tokens[2].raw).toBe('\n\ttext\n');
+		expect(tokens[3].raw).toBe('</div>');
+	});
+
+	test('raw', () => {
+		const tokens = createTestTokenList(`
+    <div>
+        text
+    </div>`);
+		expect(tokens[0].raw).toBe('\n    ');
+		expect(tokens[1].raw).toBe('<div>');
+		expect(tokens[2].raw).toBe('\n        text\n    ');
+		expect(tokens[3].raw).toBe('</div>');
+		expect(tokens[0].prevToken).toBe(null);
+		expect(tokens[1].prevToken?.raw).toBe('\n    ');
+		expect(tokens[2].prevToken?.raw).toBe('<div>');
+		expect(tokens[1].prevToken?.uuid).toBe(tokens[0].uuid);
+		expect(tokens[2].prevToken?.uuid).toBe(tokens[1].uuid);
+	});
+
+	test('raw', () => {
+		const tokens = createTestTokenList(`
+    <div>
+        <span>text</span>
+    </div>`);
+		expect(tokens[0].raw).toBe('\n    ');
+		expect(tokens[1].raw).toBe('<div>');
+		expect(tokens[2].raw).toBe('\n        ');
+		expect(tokens[3].raw).toBe('<span>');
+		expect(tokens[4].raw).toBe('text');
+		expect(tokens[5].raw).toBe('</span>');
+		expect(tokens[6].raw).toBe('\n    ');
+		expect(tokens[7].raw).toBe('</div>');
+	});
+
+	test('raw', () => {
+		const tokens = createTestTokenList(`
+<div>
+	<span>text</span>
+</div>`);
+		expect(tokens[0].raw).toBe('\n');
+		expect(tokens[1].raw).toBe('<div>');
+		expect(tokens[2].raw).toBe('\n\t');
+		expect(tokens[3].raw).toBe('<span>');
+		expect(tokens[4].raw).toBe('text');
+		expect(tokens[5].raw).toBe('</span>');
+		expect(tokens[6].raw).toBe('\n');
+		expect(tokens[7].raw).toBe('</div>');
+	});
+
+	test('classList', () => {
+		const el = createTestElement('<div class="a b c"></div>');
+		expect(Array.from(el.classList)).toStrictEqual(['a', 'b', 'c']);
+	});
+
+	test('fixNodeName', () => {
+		const el = createTestElement('<div></div>');
+		expect(el.raw).toBe('<div>');
+		el.fixNodeName('x-div');
+		expect(el.raw).toBe('<x-div>');
+	});
+
+	test('namespace', () => {
+		const tokens = createTestTokenList(`<div>
+	<svg>
+		<a></a>
+		<foreignObject>
+			<div></div>
+		</foreignObject>
+	</svg>
+	<a></a>
+</div>
+`);
+		expect(tokens[0].nodeName).toBe('DIV');
+		expect(tokens[0].namespaceURI).toBe('http://www.w3.org/1999/xhtml');
+		expect(tokens[2].nodeName).toBe('svg');
+		expect(tokens[2].namespaceURI).toBe('http://www.w3.org/2000/svg');
+		expect(tokens[4].nodeName).toBe('a');
+		expect(tokens[4].namespaceURI).toBe('http://www.w3.org/2000/svg');
+		expect(tokens[7].nodeName).toBe('foreignObject');
+		expect(tokens[7].namespaceURI).toBe('http://www.w3.org/2000/svg');
+		expect(tokens[9].nodeName).toBe('DIV');
+		expect(tokens[9].namespaceURI).toBe('http://www.w3.org/1999/xhtml');
+		expect(tokens[16].nodeName).toBe('A');
+		expect(tokens[16].namespaceURI).toBe('http://www.w3.org/1999/xhtml');
+	});
+
+	test('toString', () => {
+		const raw = `
+	<div>
+		<span attr attr2 attr3="value" attr4=value>text</span>
+	</div>`;
+		const doc = createTestDocument(raw);
+		expect(doc.toString()).toBe(raw);
+	});
+
+	test('IDL attribute in JSX', () => {
+		expect(
+			createTestElement('<label></label>', {
+				parser: require('@markuplint/jsx-parser'),
+			}).getAttributeNode('for')?.localName,
+		).toBeUndefined();
+		expect(
+			createTestElement('<label htmlFor></label>', {
+				parser: require('@markuplint/jsx-parser'),
+			}).getAttributeNode('for')?.localName,
+		).toBe('for');
+		expect(
+			createTestElement('<label htmlFor></label>', {
+				parser: require('@markuplint/jsx-parser'),
+			}).getAttributeNode('htmlFor')?.localName,
+		).toBeUndefined();
+	});
+
+	test('rule', () => {
+		const document = createTestDocument('<div><span>text</span></div>', {
+			config: {
+				rules: {
+					ruleA: true,
+					ruleB: true,
+				},
+				nodeRules: [
+					{
+						selector: 'span',
+						rules: {
+							ruleA: false,
+						},
+					},
+				],
+			},
+		});
+		const ruleA = createRule({
+			name: 'ruleA',
+			defaultValue: 'foo',
+			defaultOptions: null,
+			verify() {
+				throw new Error();
+			},
+		});
+		document.setRule(ruleA);
+		expect(document.nodeList[1].rule.disabled).toBe(true);
+		const ruleB = createRule({
+			name: 'ruleB',
+			defaultValue: 'foo',
+			defaultOptions: null,
+			verify() {
+				throw new Error();
+			},
+		});
+		document.setRule(ruleB);
+		expect(document.nodeList[1].rule.disabled).toBe(false);
+	});
+});
+
+describe('Selector', () => {
+	test('nodeName case-sensitive', () => {
+		expect(createTestElement('<DIV></DIV>').matches('div')).toBeTruthy();
+		expect(createTestElement('<DIV></DIV>').matches('DIV')).toBeTruthy();
+		expect(
+			createTestElement('<Div></Div>', {
+				parser: require('@markuplint/jsx-parser'),
+			}).matches('DIV'),
+		).toBeFalsy();
+	});
+
+	test('Pug has PSBlock', () => {
+		const el = createTestElement(
+			`
+div#hoge.foo.bar
+	if foo
+		a(href="path/to")`,
+			{
+				parser: require('@markuplint/pug-parser'),
+			},
+		);
+		// @ts-ignore
+		const a = el.childNodes[0].childNodes[0];
+		expect(el.matches('*')).toBeTruthy();
+		expect(el.matches('div')).toBeTruthy();
+		expect(el.matches('div#hoge')).toBeTruthy();
+		expect(el.matches('div#fuga')).toBe(false);
+		expect(el.matches('#hoge')).toBeTruthy();
+		expect(el.matches('div.foo')).toBeTruthy();
+		expect(el.matches('div.bar')).toBeTruthy();
+		expect(el.matches('.foo')).toBeTruthy();
+		expect(el.matches('.foo.bar')).toBeTruthy();
+		expect(el.matches('.any')).toBe(false);
+		expect(a.matches('*')).toBeTruthy();
+		expect(a.matches('a')).toBeTruthy();
+		expect(a.matches('div a')).toBeTruthy();
+		expect(a.matches('div > a')).toBeTruthy();
+	});
+
+	test('Attribute potential name', () => {
+		expect(
+			createTestElement('<div tabIndex className><label htmlFor></label></div>', {
+				parser: require('@markuplint/jsx-parser'),
+			}).matches('[tabindex][class]:has(>label[for])'),
+		).toBeTruthy();
+
+		expect(
+			createTestElement('<svg><image clipPath /></svg>', {
+				parser: require('@markuplint/jsx-parser'),
+			}).matches('svg:has(>image[clip-path])'),
+		).toBeTruthy();
+	});
+});
+
+describe('Rule', () => {
+	test('regexSelector', () => {
+		const document = createTestDocument('<img src="path/to/name.png" />', {
+			config: {
+				rules: {
+					ruleA: true,
+				},
+				nodeRules: [
+					{
+						regexSelector: {
+							nodeName: 'img',
+							attrName: 'src',
+							attrValue: '/(?<fileName>[a-z0-9_-]+)\\.png$/',
+						},
+						rules: {
+							ruleA: {
+								value: 'fileName is {{ fileName }}',
+								options: {
+									propA: 'fileName is {{ fileName }}',
+									propB: ['fileName is {{ fileName }}'],
+									propC: {
+										prop: 'fileName is {{ fileName }}',
+									},
+								},
+							},
+						},
+					},
+				],
+			},
+		});
+		const ruleA = createRule({
+			name: 'ruleA',
+			defaultValue: 'foo',
+			defaultOptions: null,
+			verify() {
+				throw new Error();
+			},
+		});
+		document.setRule(ruleA);
+		expect(document.nodeList[0].rule).toStrictEqual({
+			disabled: false,
+			reason: undefined,
+			severity: 'error',
+			value: 'fileName is name',
+			options: {
+				propA: 'fileName is name',
+				propB: ['fileName is name'],
+				propC: {
+					prop: 'fileName is name',
+				},
+			},
+		});
+	});
+
+	test('extend rule settings', () => {
+		const document = createTestDocument('<span class="a"></span><div class="b"><span></span></div>', {
+			config: {
+				rules: {
+					ruleA: {
+						severity: 'error',
+						reason: '123',
+					},
+					ruleB: {
+						severity: 'info',
+						reason: '456',
+					},
+					ruleC: false,
+					ruleD: true,
+					ruleE: {
+						value: '789',
+					},
+				},
+				nodeRules: [
+					{
+						selector: '.a',
+						rules: {
+							ruleA: {
+								severity: 'info',
+								reason: '456',
+							},
+							ruleB: {},
+							ruleC: true,
+							ruleD: false,
+							ruleE: false,
+						},
+					},
+				],
+				childNodeRules: [
+					{
+						selector: '.b',
+						rules: {
+							ruleA: {
+								severity: 'info',
+								reason: '456',
+							},
+							ruleB: {},
+							ruleC: true,
+							ruleD: false,
+							ruleE: false,
+						},
+					},
+				],
+			},
+		});
+
+		expect(document.nodeList[0].nodeName).toBe('SPAN');
+		expect(document.nodeList[1].nodeName).toBe('DIV');
+		expect(document.nodeList[2].nodeName).toBe('SPAN');
+
+		const ruleA = createRule({
+			name: 'ruleA',
+			defaultValue: 'foo',
+			defaultOptions: null,
+			verify() {
+				throw new Error();
+			},
+		});
+		const ruleB = createRule({
+			name: 'ruleB',
+			defaultValue: 'bar',
+			defaultOptions: null,
+			verify() {
+				throw new Error();
+			},
+		});
+		const ruleC = createRule({
+			name: 'ruleC',
+			defaultValue: 'buz',
+			defaultOptions: null,
+			verify() {
+				throw new Error();
+			},
+		});
+		const ruleD = createRule({
+			name: 'ruleD',
+			defaultValue: 'fuz',
+			defaultOptions: null,
+			verify() {
+				throw new Error();
+			},
+		});
+		const ruleE = createRule({
+			name: 'ruleE',
+			defaultValue: 'piyo',
+			defaultOptions: null,
+			verify() {
+				throw new Error();
+			},
+		});
+
+		document.setRule(ruleA);
+		const resultA = {
+			disabled: false,
+			reason: '456',
+			severity: 'info',
+			value: 'foo',
+			options: null,
+		};
+		expect(document.nodeList[0].rule).toStrictEqual(resultA);
+		expect(document.nodeList[1].rule).not.toStrictEqual(resultA);
+		expect(document.nodeList[2].rule).toStrictEqual(resultA);
+
+		document.setRule(ruleB);
+		const resultB = {
+			disabled: false,
+			reason: '456',
+			severity: 'info',
+			value: 'bar',
+			options: null,
+		};
+		expect(document.nodeList[0].rule).toStrictEqual(resultB);
+		expect(document.nodeList[1].rule).toStrictEqual(resultB);
+		expect(document.nodeList[2].rule).toStrictEqual(resultB);
+
+		document.setRule(ruleC);
+		const resultC = {
+			disabled: false,
+			reason: undefined,
+			severity: 'error',
+			value: 'buz',
+			options: null,
+		};
+		expect(document.nodeList[0].rule).toStrictEqual(resultC);
+		expect(document.nodeList[1].rule).not.toStrictEqual(resultC);
+		expect(document.nodeList[2].rule).toStrictEqual(resultC);
+
+		document.setRule(ruleD);
+		const resultD = {
+			disabled: true,
+			reason: undefined,
+			severity: 'error',
+			value: 'fuz',
+			options: null,
+		};
+		expect(document.nodeList[0].rule).toStrictEqual(resultD);
+		expect(document.nodeList[1].rule).not.toStrictEqual(resultC);
+		expect(document.nodeList[2].rule).toStrictEqual(resultD);
+
+		document.setRule(ruleE);
+		const resultE = {
+			disabled: true,
+			reason: undefined,
+			severity: 'error',
+			value: 'piyo',
+			options: null,
+		};
+		expect(document.nodeList[0].rule).toStrictEqual(resultE);
+		expect(document.nodeList[1].rule).not.toStrictEqual(resultE);
+		expect(document.nodeList[2].rule).toStrictEqual(resultE);
+	});
+
+	test('regexSelector + pug', () => {
+		const document = createTestDocument(
+			`section.Card
+	.Card__inner1
+		.Card__inner2
+			if true
+				.Card__inner3`,
+			{
+				config: {
+					rules: {
+						ruleA: 'global',
+					},
+					childNodeRules: [
+						{
+							regexSelector: {
+								attrName: 'class',
+								attrValue: '/^(?<BlockName>[A-Z][a-z0-9]+)$/',
+							},
+							inheritance: true,
+							rules: {
+								ruleA: '{{ BlockName }}',
+							},
+						},
+					],
+				},
+				parser: require('@markuplint/pug-parser'),
+			},
+		);
+		const ruleA = createRule({
+			name: 'ruleA',
+			defaultValue: 'foo',
+			defaultOptions: null,
+			verify() {
+				throw new Error();
+			},
+		});
+		document.setRule(ruleA);
+		expect(document.nodeList[0].rule).toStrictEqual({
+			disabled: false,
+			reason: undefined,
+			severity: 'error',
+			value: 'global',
+			options: null,
+		});
+		expect(document.nodeList[1].rule).toStrictEqual({
+			disabled: false,
+			reason: undefined,
+			severity: 'error',
+			value: 'Card',
+			options: null,
+		});
+		expect(document.nodeList[2].rule).toStrictEqual({
+			disabled: false,
+			reason: undefined,
+			severity: 'error',
+			value: 'Card',
+			options: null,
+		});
+		expect(document.nodeList[4].rule).toStrictEqual({
+			disabled: false,
+			reason: undefined,
+			severity: 'error',
+			value: 'Card',
+			options: null,
+		});
+	});
+
+	test('regexSelector + jsx', () => {
+		const document = createTestDocument(
+			`<section className="Card">
+	<div className="Card__inner1">
+		<div className="Card__inner2">
+			{() => (<div className="Card__inner3" />)}
+		</div>
+	</div>
+</section>`,
+			{
+				config: {
+					rules: {
+						ruleA: 'global',
+					},
+					childNodeRules: [
+						{
+							regexSelector: {
+								attrName: 'class',
+								attrValue: '/^(?<BlockName>[A-Z][a-z0-9]+)$/',
+							},
+							inheritance: true,
+							rules: {
+								ruleA: '{{ BlockName }}',
+							},
+						},
+					],
+				},
+				parser: require('@markuplint/jsx-parser'),
+			},
+		);
+		const ruleA = createRule({
+			name: 'ruleA',
+			defaultValue: 'foo',
+			defaultOptions: null,
+			verify() {
+				throw new Error();
+			},
+		});
+		document.setRule(ruleA);
+		expect(document.nodeList[0].rule).toStrictEqual({
+			disabled: false,
+			reason: undefined,
+			severity: 'error',
+			value: 'global',
+			options: null,
+		});
+		expect(document.nodeList[2].rule).toStrictEqual({
+			disabled: false,
+			reason: undefined,
+			severity: 'error',
+			value: 'Card',
+			options: null,
+		});
+		expect(document.nodeList[4].rule).toStrictEqual({
+			disabled: false,
+			reason: undefined,
+			severity: 'error',
+			value: 'Card',
+			options: null,
+		});
+		expect(document.nodeList[7].rule).toStrictEqual({
+			disabled: false,
+			reason: undefined,
+			severity: 'error',
+			value: 'Card',
+			options: null,
+		});
+	});
+
+	test('Rule Mapping', () => {
+		const config = {
+			rules: {
+				ruleA: 'global',
+			},
+			childNodeRules: [
+				{
+					regexSelector: {
+						nodeName: '/^x-(?<name>[a-c])/',
+					},
+					inheritance: true,
+					rules: {
+						ruleA: '{{ name }}',
+					},
+				},
+			],
+		};
+
+		const html = createTestDocument('<x-a><x-b><x-c></x-c></x-b></x-a>', {
+			config,
+		});
+		const htmlRules = html.nodeList.map(node => node.nodeName.toLowerCase() + ':' + node.rules['ruleA']);
+		expect(htmlRules).toStrictEqual(['x-a:global', 'x-b:a', 'x-c:b']);
+
+		const pug = createTestDocument('x-a: x-b: x-c', {
+			config,
+			parser: require('@markuplint/pug-parser'),
+		});
+		const pugRules = pug.nodeList.map(node => node.nodeName.toLowerCase() + ':' + node.rules['ruleA']);
+		expect(pugRules).toStrictEqual(['x-a:global', 'x-b:a', 'x-c:b']);
+	});
+});
+
+describe('Issues', () => {
+	test('#607', () => {
+		const dom = createTestDocument('<% %><div></div>', {
+			config: {
+				nodeRules: [{ selector: '* ~ div', rules: {} }],
+			},
+			parser: require('@markuplint/ejs-parser'),
+		});
+		expect(dom.nodeList[0].nodeName).toBe('#ml-block');
+	});
+
+	test('#641', () => {
+		const dom = createTestDocument('<p>{array.map(_ => <></>)}</p>', {
+			parser: require('@markuplint/jsx-parser'),
+		});
+		expect(dom.nodeList[0].raw).toBe('<p>');
+		expect(dom.nodeList[1].raw).toBe('{array.map(_ => <></>)}');
+		expect(dom.nodeList[2].raw).toBe('<>');
+		expect(dom.nodeList[3]).toBeUndefined();
+		expect(dom.nodeList[0].childNodes[0].raw).toBe('{array.map(_ => <></>)}');
+		expect(dom.nodeList[0].childNodes[0].childNodes[0].raw).toBe('<>');
+		const elements = dom.querySelectorAll('*');
+		expect(elements.length).toBe(2);
+	});
+
+	test('#698', () => {
+		const dom = createTestDocument(
+			`<ul>
+	{#if cond === valueA}
+		<li>A</li>
+	{:else if cond === valueB}
+		<li>B</li>
+	{/if}
+</ul>`,
+			{ parser: require('@markuplint/svelte-parser') },
+		);
+
+		// 💡 This calling is a test that checks it
+		// doesn't throw an error when it referrers a DOM object.
+		dom.querySelectorAll('*');
+
+		const map = dom.debugMap();
+		expect(map).toStrictEqual([
+			'[1:1]>[1:5](0,4)UL: <ul>',
+			'  namespaceURI: true',
+			'  elementType: html',
+			'  isInFragmentDocument: true',
+			'  isForeignElement: false',
+			'[1:5]>[2:2](4,6)#text: ⏎→',
+			'[2:2]>[3:3](6,30)#ml-block: {#if␣cond␣===␣valueA}⏎→→',
+			'[3:3]>[3:7](30,34)LI: <li>',
+			'  namespaceURI: true',
+			'  elementType: html',
+			'  isInFragmentDocument: true',
+			'  isForeignElement: false',
+			'[3:7]>[3:8](34,35)#text: A',
+			'[3:13]>[5:3](40,71)#ml-block: ⏎→{:else␣if␣cond␣===␣valueB}⏎→→',
+			'[5:3]>[5:7](71,75)LI: <li>',
+			'  namespaceURI: true',
+			'  elementType: html',
+			'  isInFragmentDocument: true',
+			'  isForeignElement: false',
+			'[5:7]>[5:8](75,76)#text: B',
+			'[5:13]>[6:2](81,83)#text: ⏎→',
+			'[6:2]>[6:7](83,88)#ml-block: {/if}',
+			'[6:7]>[7:1](88,89)#text: ⏎',
+		]);
+	});
+});