@markuplint/ml-spec 3.0.0-canary.5 → 3.0.0-dev.176

package/test/dom-traverse/get-computed-role.spec.js

@@ -0,0 +1,294 @@
+const specs = require('@markuplint/html-spec');
+const { createSelector } = require('@markuplint/selector');
+const { createJSDOMElement } = require('@markuplint/test-tools');
+
+const { getComputedRole } = require('../../lib/dom-traverse/get-computed-role');
+
+function _(html, selector) {
+	return createJSDOMElement(html, selector, function (selector) {
+		// JSDOM supports no level 4 selectors yet.
+		return createSelector(selector, specs).match(this) !== false;
+	});
+}
+
+function c(html, version, selector) {
+	return getComputedRole(specs, _(html, selector), version);
+}
+
+function tree(html, version) {
+	const el = _(html);
+	const tree = [];
+	let current = el;
+	// eslint-disable-next-line @typescript-eslint/strict-boolean-expressions
+	while (current) {
+		const role = getComputedRole(specs, current, version);
+		const result = [current.localName, role.role?.name ?? null];
+		if (role.errorType) {
+			result.push(role.errorType);
+		}
+		tree.push(result);
+		current = current.children.item(0);
+	}
+	return tree;
+}
+
+describe('1.2', () => {
+	test('the a element', () => {
+		expect(c('<a></a>', '1.2').role?.name).toBe(undefined);
+		expect(c('<a href></a>', '1.2').role?.name).toBe('link');
+		expect(c('<a role="button"></a>', '1.2').role?.name).toBe('button');
+		expect(c('<a role="button" href></a>', '1.2').role?.name).toBe('button');
+		expect(c('<a role="foo" href></a>', '1.2').role?.name).toBe('link');
+	});
+
+	test('the heading role', () => {
+		expect(c('<h1></h1>', '1.2').role?.name).toBe('heading');
+		expect(c('<h1></h1>', '1.2').role?.isImplicit).toBe(true);
+		expect(c('<div role="heading"></div>', '1.2').role?.name).toBe('heading');
+		expect(c('<div role="heading"></div>', '1.2').role?.isImplicit).toBe(false);
+	});
+
+	test('multiple', () => {
+		expect(c('<div role="presentation heading"></div>', '1.2').role?.name).toBe('presentation');
+		expect(c('<div role="roletype heading"></div>', '1.2').role?.name).toBe('heading');
+		expect(c('<img alt="alt" role="banner button"/>', '1.2').role?.name).toBe('button');
+		expect(c('<img alt="alt" role="foo button"/>', '1.2').role?.name).toBe('button');
+		expect(c('<img alt="alt" role="graphics-symbol button"/>', '1.2').role?.name).toBe('button');
+	});
+
+	test('svg', () => {
+		expect(c('<svg><rect role="graphics-symbol img"></rect></svg>', '1.2', 'rect').role?.name).toBe(
+			'graphics-symbol',
+		);
+		expect(c('<svg><rect role="roletype img"></rect></svg>', '1.2', 'rect').role?.name).toBe('img');
+		expect(c('<svg><rect role="roletype"></rect></svg>', '1.2', 'rect').role?.name).toBe('graphics-symbol');
+	});
+
+	test('landmark', () => {
+		expect(c('<div role="region"></div>', '1.2').role?.name).toBe('generic');
+		expect(c('<div role="region" aria-label="foo"></div>', '1.2').role?.name).toBe('region');
+		expect(c('<div role="form"></div>', '1.2').role?.name).toBe('generic');
+		expect(c('<div role="form" aria-label="foo"></div>', '1.2').role?.name).toBe('form');
+		expect(c('<div role="navigation"></div>', '1.2').role?.name).toBe('navigation');
+		expect(c('<div role="navigation" aria-label="foo"></div>', '1.2').role?.name).toBe('navigation');
+	});
+
+	test('Presentational Roles Conflict Resolution (1) Interactive Elements', () => {
+		expect(c('<a href="path/to"></a>', '1.2').role?.name).toBe('link');
+		expect(c('<a role="none" href="path/to"></a>', '1.2').role?.name).toBe('link'); // No permitted role
+		expect(c('<a></a>', '1.2').role?.name).toBe(undefined);
+		expect(c('<a role="none"></a>', '1.2').role?.name).toBe('none');
+		expect(c('<a role="none" href="path/to" disabled></a>', '1.2').role?.name).toBe('link'); // No permitted role
+		expect(c('<button></button>', '1.2').role?.name).toBe('button');
+		expect(c('<button disabled></button>', '1.2').role?.name).toBe('button');
+		expect(c('<button role="none"></button>', '1.2').role?.name).toBe('button'); // No permitted role
+		expect(c('<button role="none" disabled></button>', '1.2').role?.name).toBe('button'); // No permitted role
+		expect(c('<div></div>', '1.2').role?.name).toBe('generic');
+		expect(c('<div role="none"></div>', '1.2').role?.name).toBe('none');
+		expect(c('<div tabindex="0"></div>', '1.2').role?.name).toBe('generic');
+		expect(c('<div tabindex="0" role="none"></div>', '1.2').role?.name).toBe('generic');
+		expect(c('<div><span></span></div>', '1.2', 'span').role?.name).toBe('generic');
+		expect(c('<div><span role="none"></span></div>', '1.2', 'span').role?.name).toBe('none');
+		expect(c('<div><span tabindex="0"></span></div>', '1.2', 'span').role?.name).toBe('generic');
+		expect(c('<div><span tabindex="0" role="none"></span></div>', '1.2', 'span').role?.name).toBe('generic');
+		expect(c('<div hidden><span></span></div>', '1.2', 'span').role?.name).toBe('generic');
+		expect(c('<div hidden><span role="none"></span></div>', '1.2', 'span').role?.name).toBe('none');
+		expect(c('<div hidden><span tabindex="0"></span></div>', '1.2', 'span').role?.name).toBe('generic');
+		expect(c('<div hidden><span tabindex="0" role="none"></span></div>', '1.2', 'span').role?.name).toBe('none');
+	});
+
+	test('Presentational Roles Conflict Resolution (2-1) Required Owned Elements', () => {
+		expect(c('<table><tr><td>foo</td></tr></table>', '1.2', 'td').role?.name).toBe('cell');
+		expect(c('<table><tr><td role="none">foo</td></tr></table>', '1.2', 'td').role?.name).toBe('cell');
+		expect(c('<table><tbody role="none"><tr><td>foo</td></tr></tbody></table>', '1.2', 'tbody').role?.name).toBe(
+			'rowgroup',
+		);
+		expect(c('<ul><li></li></ul>', '1.2', 'li').role?.name).toBe('listitem');
+		expect(c('<ul><li role="presentation"></li></ul>', '1.2', 'li').role?.name).toBe('listitem');
+	});
+
+	test('Presentational Roles Conflict Resolution (2-2) the accessibility tree to be malformed', () => {
+		expect(c('<table><tr><td>foo</td></tr></table>', '1.2', 'td').role?.name).toBe('cell');
+		expect(c('<table role="none"><tr><td>foo</td></tr></table>', '1.2', 'td').role?.name).toBe(undefined);
+		expect(tree('<table><tr><td>foo</td></tr></table>', '1.2')).toStrictEqual([
+			['table', 'table'],
+			['tbody', 'rowgroup'],
+			['tr', 'row'],
+			['td', 'cell'],
+		]);
+		expect(tree('<table role="none"><tr><td>foo</td></tr></table>', '1.2')).toStrictEqual([
+			['table', 'none'],
+			['tbody', null, 'NO_OWNER'],
+			['tr', null, 'NO_OWNER'],
+			['td', null /* NOT MATCHING THE CONDITIONS */],
+		]);
+		expect(
+			tree(
+				'<table role="table"><tbody role="rowgroup"><tr role="row"><td role="gridcell"></td></tr></tbody></table>',
+				'1.2',
+			),
+		).toStrictEqual([
+			['table', 'table'],
+			['tbody', 'rowgroup'],
+			['tr', 'row'],
+			['td', 'cell', 'NO_PERMITTED'],
+		]);
+		expect(
+			tree(
+				'<table role="grid"><tbody role="rowgroup"><tr role="row"><td role="gridcell"></td></tr></tbody></table>',
+				'1.2',
+			),
+		).toStrictEqual([
+			['table', 'grid'],
+			['tbody', 'rowgroup'],
+			['tr', 'row'],
+			['td', 'gridcell'],
+		]);
+	});
+
+	test('Presentational Roles Conflict Resolution (3) Global Props', () => {
+		/**
+		 * @see https://w3c.github.io/aria/#example-41
+		 */
+		expect(c('<h1 role="presentation" aria-describedby="comment-1"> Sample Content </h1>', '1.2').role?.name).toBe(
+			'heading',
+		);
+		expect(c('<h1 role="presentation" aria-level="2"> Sample Content </h1>', '1.2').role?.name).toBe(
+			'presentation',
+		);
+	});
+});
+
+describe('1.3', () => {
+	test('the a element', () => {
+		expect(c('<a></a>', '1.3').role?.name).toBe(undefined);
+		expect(c('<a href></a>', '1.3').role?.name).toBe('link');
+		expect(c('<a role="button"></a>', '1.3').role?.name).toBe('button');
+		expect(c('<a role="button" href></a>', '1.3').role?.name).toBe('button');
+		expect(c('<a role="foo" href></a>', '1.3').role?.name).toBe('link');
+	});
+
+	test('the heading role', () => {
+		expect(c('<h1></h1>', '1.3').role?.name).toBe('heading');
+		expect(c('<h1></h1>', '1.3').role?.isImplicit).toBe(true);
+		expect(c('<div role="heading"></div>', '1.3').role?.name).toBe('heading');
+		expect(c('<div role="heading"></div>', '1.3').role?.isImplicit).toBe(false);
+	});
+
+	test('multiple', () => {
+		expect(c('<div role="presentation heading"></div>', '1.3').role?.name).toBe('presentation');
+		expect(c('<div role="roletype heading"></div>', '1.3').role?.name).toBe('heading');
+		expect(c('<img alt="alt" role="banner button"/>', '1.3').role?.name).toBe('button');
+		expect(c('<img alt="alt" role="foo button"/>', '1.3').role?.name).toBe('button');
+		expect(c('<img alt="alt" role="graphics-symbol button"/>', '1.3').role?.name).toBe('button');
+	});
+
+	test('svg', () => {
+		expect(c('<svg><rect role="graphics-symbol img"></rect></svg>', '1.3', 'rect').role?.name).toBe(
+			'graphics-symbol',
+		);
+		expect(c('<svg><rect role="roletype img"></rect></svg>', '1.3', 'rect').role?.name).toBe('img');
+		expect(c('<svg><rect role="roletype"></rect></svg>', '1.3', 'rect').role?.name).toBe('graphics-symbol');
+	});
+
+	test('landmark', () => {
+		expect(c('<div role="region"></div>', '1.3').role?.name).toBe('generic');
+		expect(c('<div role="region" aria-label="foo"></div>', '1.3').role?.name).toBe('region');
+		expect(c('<div role="form"></div>', '1.3').role?.name).toBe('generic');
+		expect(c('<div role="form" aria-label="foo"></div>', '1.3').role?.name).toBe('form');
+		expect(c('<div role="navigation"></div>', '1.3').role?.name).toBe('navigation');
+		expect(c('<div role="navigation" aria-label="foo"></div>', '1.3').role?.name).toBe('navigation');
+	});
+
+	test('Presentational Roles Conflict Resolution (1) Interactive Elements', () => {
+		expect(c('<a href="path/to"></a>', '1.3').role?.name).toBe('link');
+		expect(c('<a role="none" href="path/to"></a>', '1.3').role?.name).toBe('link'); // No permitted role
+		expect(c('<a></a>', '1.3').role?.name).toBe(undefined);
+		expect(c('<a role="none"></a>', '1.3').role?.name).toBe('none');
+		expect(c('<a role="none" href="path/to" disabled></a>', '1.3').role?.name).toBe('link'); // No permitted role
+		expect(c('<button></button>', '1.3').role?.name).toBe('button');
+		expect(c('<button disabled></button>', '1.3').role?.name).toBe('button');
+		expect(c('<button role="none"></button>', '1.3').role?.name).toBe('button'); // No permitted role
+		expect(c('<button role="none" disabled></button>', '1.3').role?.name).toBe('button'); // No permitted role
+		expect(c('<div></div>', '1.3').role?.name).toBe('generic');
+		expect(c('<div role="none"></div>', '1.3').role?.name).toBe('none');
+		expect(c('<div tabindex="0"></div>', '1.3').role?.name).toBe('generic');
+		expect(c('<div tabindex="0" role="none"></div>', '1.3').role?.name).toBe('generic');
+		expect(c('<div><span></span></div>', '1.3', 'span').role?.name).toBe('generic');
+		expect(c('<div><span role="none"></span></div>', '1.3', 'span').role?.name).toBe('none');
+		expect(c('<div><span tabindex="0"></span></div>', '1.3', 'span').role?.name).toBe('generic');
+		expect(c('<div><span tabindex="0" role="none"></span></div>', '1.3', 'span').role?.name).toBe('generic');
+		expect(c('<div hidden><span></span></div>', '1.3', 'span').role?.name).toBe('generic');
+		expect(c('<div hidden><span role="none"></span></div>', '1.3', 'span').role?.name).toBe('none');
+		expect(c('<div hidden><span tabindex="0"></span></div>', '1.3', 'span').role?.name).toBe('generic');
+		expect(c('<div hidden><span tabindex="0" role="none"></span></div>', '1.3', 'span').role?.name).toBe('none');
+	});
+
+	test('Presentational Roles Conflict Resolution (2-1) Required Owned Elements', () => {
+		expect(c('<table><tr><td>foo</td></tr></table>', '1.3', 'td').role?.name).toBe('cell');
+		expect(c('<table><tr><td role="none">foo</td></tr></table>', '1.3', 'td').role?.name).toBe('cell');
+		expect(c('<table><tbody role="none"><tr><td>foo</td></tr></tbody></table>', '1.3', 'tbody').role?.name).toBe(
+			'rowgroup',
+		);
+		expect(c('<ul><li></li></ul>', '1.3', 'li').role?.name).toBe('listitem');
+		expect(c('<ul><li role="presentation"></li></ul>', '1.3', 'li').role?.name).toBe('listitem');
+	});
+
+	test('Presentational Roles Conflict Resolution (2-2) the accessibility tree to be malformed', () => {
+		expect(c('<table><tr><td>foo</td></tr></table>', '1.3', 'td').role?.name).toBe('cell');
+		expect(c('<table role="none"><tr><td>foo</td></tr></table>', '1.3', 'td').role?.name).toBe(undefined);
+		expect(tree('<table><tr><td>foo</td></tr></table>', '1.3')).toStrictEqual([
+			['table', 'table'],
+			['tbody', 'rowgroup'],
+			['tr', 'row'],
+			['td', 'cell'],
+		]);
+		expect(tree('<table role="none"><tr><td>foo</td></tr></table>', '1.3')).toStrictEqual([
+			['table', 'none'],
+			['tbody', null, 'NO_OWNER'],
+			['tr', null, 'INVALID_REQUIRED_CONTEXT_ROLE'],
+			['td', null /* NOT MATCHING THE CONDITIONS */],
+		]);
+		expect(
+			tree(
+				'<table role="table"><tbody role="rowgroup"><tr role="row"><td role="gridcell"></td></tr></tbody></table>',
+				'1.3',
+			),
+		).toStrictEqual([
+			['table', 'table'],
+			['tbody', 'rowgroup'],
+			['tr', 'row'],
+			['td', 'cell', 'NO_PERMITTED'],
+		]);
+		expect(
+			tree(
+				'<table role="grid"><tbody role="rowgroup"><tr role="row"><td role="gridcell"></td></tr></tbody></table>',
+				'1.3',
+			),
+		).toStrictEqual([
+			['table', 'grid'],
+			['tbody', 'rowgroup'],
+			['tr', 'row'],
+			['td', 'gridcell'],
+		]);
+	});
+
+	test('Presentational Roles Conflict Resolution (3) Global Props', () => {
+		/**
+		 * @see https://w3c.github.io/aria/#example-41
+		 */
+		expect(c('<h1 role="presentation" aria-describedby="comment-1"> Sample Content </h1>', '1.3').role?.name).toBe(
+			'heading',
+		);
+		expect(c('<h1 role="presentation" aria-level="2"> Sample Content </h1>', '1.3').role?.name).toBe(
+			'presentation',
+		);
+	});
+});
+
+describe('Issues', () => {
+	test('#778', () => {
+		expect(c('<td role="gridcell"></td>', '1.2').role?.name).toBe('gridcell');
+		expect(c('<td role="gridcell"></td>', '1.3').role?.name).toBe('gridcell');
+	});
+});

package/test/dom-traverse/get-implicit-role.spec.js

@@ -0,0 +1,40 @@
+const specs = require('@markuplint/html-spec');
+const { createSelector } = require('@markuplint/selector');
+const { createJSDOMElement } = require('@markuplint/test-tools');
+
+const { getImplicitRole } = require('../../lib/dom-traverse/get-implicit-role');
+
+function _(html, selector) {
+	return createJSDOMElement(html, selector, function (selector) {
+		// JSDOM supports no level 4 selectors yet.
+		return createSelector(selector, specs).match(this) !== false;
+	});
+}
+
+describe('1.2', () => {
+	test('<button>', () => {
+		const el = _('<button></button>');
+		const role = getImplicitRole(specs, el, '1.2');
+		expect(role.role?.name).toBe('button');
+	});
+
+	test('<td>', () => {
+		const el = _('<table><tr><td></td></tr></table>', 'td');
+		const role = getImplicitRole(specs, el, '1.2');
+		expect(role.role?.name).toBe('cell');
+	});
+});
+
+describe('1.3', () => {
+	test('<button>', () => {
+		const el = _('<button></button>');
+		const role = getImplicitRole(specs, el, '1.3');
+		expect(role.role?.name).toBe('button');
+	});
+
+	test('<td>', () => {
+		const el = _('<table><tr><td></td></tr></table>', 'td');
+		const role = getImplicitRole(specs, el, '1.3');
+		expect(role.role?.name).toBe('cell');
+	});
+});

package/{src/dom-traverse/has-required-owned-elements.spec.ts → test/dom-traverse/has-required-owned-elements.spec.js}

@@ -1,19 +1,17 @@
-import type { ARIAVersion } from '../types';
+const specs = require('@markuplint/html-spec');
+const { createSelector } = require('@markuplint/selector');
+const { createJSDOMElement } = require('@markuplint/test-tools');
 
-import specs from '@markuplint/html-spec';
-import { createSelector } from '@markuplint/selector';
-import { createJSDOMElement } from '@markuplint/test-tools';
+const { hasRequiredOwnedElement } = require('../../lib/dom-traverse/has-required-owned-elements');
 
-import { hasRequiredOwnedElement } from './has-required-owned-elements';
-
-function _(html: string, selector?: string) {
+function _(html, selector) {
 	return createJSDOMElement(html, selector, function (selector) {
 		// JSDOM supports no level 4 selectors yet.
-		return !!createSelector(selector, specs).match(this);
+		return createSelector(selector, specs).match(this) !== false;
 	});
 }
 
-function m(html: string, version: ARIAVersion, selector?: string) {
+function m(html, version, selector) {
 	const el = _(html, selector);
 	return hasRequiredOwnedElement(el, specs, version);
 }

package/{src/dom-traverse/is-exposed.spec.ts → test/dom-traverse/is-exposed.spec.js}

@@ -1,19 +1,17 @@
-import type { ARIAVersion } from '../types';
+const specs = require('@markuplint/html-spec');
+const { createSelector } = require('@markuplint/selector');
+const { createJSDOMElement } = require('@markuplint/test-tools');
 
-import specs from '@markuplint/html-spec';
-import { createSelector } from '@markuplint/selector';
-import { createJSDOMElement } from '@markuplint/test-tools';
+const { isExposed } = require('../../lib/dom-traverse/is-exposed');
 
-import { isExposed } from './is-exposed';
-
-function _(html: string, selector?: string) {
+function _(html, selector) {
 	return createJSDOMElement(html, selector, function (selector) {
 		// JSDOM supports no level 4 selectors yet.
-		return !!createSelector(selector, specs).match(this);
+		return createSelector(selector, specs).match(this) !== false;
 	});
 }
 
-function x(html: string, selector?: string, version: ARIAVersion = '1.2') {
+function x(html, selector, version = '1.2') {
 	const el = _(html, selector);
 	return isExposed(el, specs, version);
 }
@@ -47,4 +45,26 @@ describe('isExposed', () => {
 		expect(x('<style>a{}</style>')).toBe(false);
 		expect(x('<script>"";</script>')).toBe(false);
 	});
+
+	test('Recent element', () => {
+		expect(x('<canvas></canvas>')).toBe(true);
+		expect(x('<dialog></dialog>')).toBe(true);
+		expect(x('<details></details>')).toBe(true);
+		expect(x('<summary></summary>')).toBe(true);
+		expect(x('<meter></meter>')).toBe(true);
+		expect(x('<progress></progress>')).toBe(true);
+		expect(x('<picture></picture>')).toBe(true);
+		expect(x('<ruby></ruby>')).toBe(true);
+		expect(x('<pt></pt>')).toBe(true);
+		expect(x('<rp></rp>')).toBe(true);
+		expect(x('<time></time>')).toBe(true);
+		expect(x('<slot></slot>')).toBe(true);
+		expect(x('<portal></portal>')).toBe(true);
+	});
+
+	test('Unknown element', () => {
+		expect(x('<unknown></unknown>')).toBe(true);
+		expect(x('<font></font>')).toBe(true);
+		expect(x('<x-component></x-component>')).toBe(true);
+	});
 });

package/test/dom-traverse/matches-context-role.spec.js

@@ -0,0 +1,60 @@
+const specs = require('@markuplint/html-spec');
+const { createSelector } = require('@markuplint/selector');
+const { createJSDOMElement } = require('@markuplint/test-tools');
+
+const { matchesContextRole } = require('../../lib/dom-traverse/matches-context-role');
+
+function _(html, selector) {
+	return createJSDOMElement(html, selector, function (selector) {
+		// JSDOM supports no level 4 selectors yet.
+		return createSelector(selector, specs).match(this) !== false;
+	});
+}
+
+describe('1.2', () => {
+	const version = '1.2';
+
+	test('rowgroup', () => {
+		const el = _('<table><tbody><tr><td></td></tr></tbody></table>', 'tr');
+		expect(matchesContextRole(['rowgroup'], el, specs, version)).toBe(true);
+	});
+
+	test('rowgroup owned by table', () => {
+		const el = _('<table><tbody><tr><td></td></tr></tbody></table>', 'tr');
+		expect(matchesContextRole(['table > rowgroup'], el, specs, version)).toBe(true);
+	});
+
+	test('no rowgroup', () => {
+		const el = _('<table><tbody><tr><td></td></tr></tbody></table>', 'tr');
+		expect(matchesContextRole(['group'], el, specs, version)).toBe(false);
+	});
+
+	test('rowgroup owned by no table', () => {
+		const el = _('<table><tbody><tr><td></td></tr></tbody></table>', 'tr');
+		expect(matchesContextRole(['grid > rowgroup'], el, specs, version)).toBe(false);
+	});
+});
+
+describe('1.3', () => {
+	const version = '1.3';
+
+	test('rowgroup', () => {
+		const el = _('<table><tbody><tr><td></td></tr></tbody></table>', 'tr');
+		expect(matchesContextRole(['rowgroup'], el, specs, version)).toBe(true);
+	});
+
+	test('rowgroup owned by table', () => {
+		const el = _('<table><tbody><tr><td></td></tr></tbody></table>', 'tr');
+		expect(matchesContextRole(['table > rowgroup'], el, specs, version)).toBe(true);
+	});
+
+	test('no rowgroup', () => {
+		const el = _('<table><tbody><tr><td></td></tr></tbody></table>', 'tr');
+		expect(matchesContextRole(['group'], el, specs, version)).toBe(false);
+	});
+
+	test('rowgroup owned by no table', () => {
+		const el = _('<table><tbody><tr><td></td></tr></tbody></table>', 'tr');
+		expect(matchesContextRole(['grid > rowgroup'], el, specs, version)).toBe(false);
+	});
+});

package/{src/specs/get-attr-specs.spec.ts → test/specs/get-attr-specs.spec.js}

@@ -1,6 +1,6 @@
-import htmlSpec from '@markuplint/html-spec';
+const htmlSpec = require('@markuplint/html-spec');
 
-import { getAttrSpecs } from './get-attr-specs';
+const { getAttrSpecs } = require('../../lib/specs/get-attr-specs');
 
 describe('getSpec', () => {
 	test('svg:image[x]', () => {
@@ -38,10 +38,4 @@ describe('getSpec', () => {
 			deprecated: true,
 		});
 	});
-
-	test('img[fetchpriority] (experimental spec)', () => {
-		const attrs = getAttrSpecs('img', null, htmlSpec);
-		const fetchpriority = attrs?.find(attr => attr.name === 'fetchpriority');
-		expect(fetchpriority?.experimental).toBe(true);
-	});
 });

package/{src/specs/get-implicit-role.spec.ts → test/specs/get-implicit-role.spec.js}

@@ -1,19 +1,17 @@
-import type { ARIAVersion } from '../types';
+const specs = require('@markuplint/html-spec');
+const { createSelector } = require('@markuplint/selector');
+const { createJSDOMElement } = require('@markuplint/test-tools');
 
-import specs from '@markuplint/html-spec';
-import { createSelector } from '@markuplint/selector';
-import { createJSDOMElement } from '@markuplint/test-tools';
+const { getImplicitRole } = require('../../lib/specs/get-implicit-role');
 
-import { getImplicitRole } from './get-implicit-role';
-
-function c(html: string, version: ARIAVersion) {
+function c(html, version) {
 	const el = createJSDOMElement(html);
 	return getImplicitRole(
 		specs,
 		el.localName,
 		el.namespaceURI,
 		version,
-		selector => !!createSelector(selector, specs).match(el),
+		selector => createSelector(selector, specs).match(el) !== false,
 	);
 }
 
@@ -27,8 +25,8 @@ describe('getImplicitRole', () => {
 	});
 
 	test('the area element', () => {
-		expect(c('<area />', '1.2')).toBe(false);
-		expect(c('<area shape="rect" />', '1.2')).toBe(false);
+		expect(c('<area />', '1.2')).toBe('generic');
+		expect(c('<area shape="rect" />', '1.2')).toBe('generic');
 		expect(c('<area href />', '1.2')).toBe('link');
 		expect(c('<area href="" />', '1.2')).toBe('link');
 		expect(c('<area href="path/to" />', '1.2')).toBe('link');
@@ -68,7 +66,7 @@ describe('getImplicitRole', () => {
 	});
 
 	test('the form element', () => {
-		expect(c('<form></form>', '1.2')).toBe('form');
+		expect(c('<form></form>', '1.2')).toBe(false);
 		expect(c('<form></form>', '1.1')).toBe(false);
 		expect(c('<form aria-label="foo"></form>', '1.2')).toBe('form');
 		expect(c('<form aria-label="foo"></form>', '1.1')).toBe('form');

package/{src/specs/get-permitted-roles.spec.ts → test/specs/get-permitted-roles.spec.js}

@@ -1,19 +1,17 @@
-import type { ARIAVersion } from '../types';
+const specs = require('@markuplint/html-spec');
+const { createSelector } = require('@markuplint/selector');
+const { createJSDOMElement } = require('@markuplint/test-tools');
 
-import specs from '@markuplint/html-spec';
-import { createSelector } from '@markuplint/selector';
-import { createJSDOMElement } from '@markuplint/test-tools';
+const { getPermittedRoles } = require('../../lib/specs/get-permitted-roles');
 
-import { getPermittedRoles } from './get-permitted-roles';
-
-function c(html: string, version: ARIAVersion, selector?: string) {
+function c(html, version, selector) {
 	const el = createJSDOMElement(html, selector);
 	const roles = getPermittedRoles(
 		specs,
 		el.localName,
 		el.namespaceURI,
 		version,
-		selector => !!createSelector(selector, specs).match(el),
+		selector => createSelector(selector, specs).match(el) !== false,
 	);
 	if (Array.isArray(roles)) {
 		return roles.map(r => r.name);
@@ -125,7 +123,7 @@ describe('getPermittedRoles', () => {
 	});
 
 	test('the area element', () => {
-		expect(c('<area></area>', '1.2')).toStrictEqual(['button', 'link']);
+		expect(c('<area></area>', '1.2')).toStrictEqual(['generic', 'button', 'link']);
 		expect(c('<area></area>', '1.1')).toStrictEqual([]);
 		expect(c('<area href="path/to"></area>', '1.2')).toStrictEqual(['link']);
 	});
@@ -232,7 +230,7 @@ describe('getPermittedRoles', () => {
 	});
 
 	test('the form element', () => {
-		expect(c('<form></form>', '1.2')).toStrictEqual(['form', 'none', 'presentation', 'search']);
+		expect(c('<form></form>', '1.2')).toStrictEqual(['none', 'presentation', 'search']);
 		expect(c('<form></form>', '1.1')).toStrictEqual(['none', 'presentation', 'search']);
 		expect(c('<form aria-label="foo"></form>', '1.2')).toStrictEqual(['form', 'none', 'presentation', 'search']);
 		expect(c('<form aria-label="foo"></form>', '1.1')).toStrictEqual(['form', 'none', 'presentation', 'search']);

package/{src/specs/get-role-spec.spec.ts → test/specs/get-role-spec.spec.js}

@@ -1,10 +1,10 @@
-import specs from '@markuplint/html-spec';
+const specs = require('@markuplint/html-spec');
 
-import { getRoleSpec } from './get-role-spec';
+const { getRoleSpec } = require('../../lib/specs/get-role-spec');
 
 describe('getRoleSpec', () => {
 	test('the button role', () => {
-		const role = getRoleSpec(specs, 'button', 'http://www.w3.org/1999/xhtml', '1.2')!;
+		const role = getRoleSpec(specs, 'button', 'http://www.w3.org/1999/xhtml', '1.2');
 		const superClassRoles = role.superClassRoles.map(r => r.name);
 		expect(role.ownedProperties.map(p => p.name + (p.deprecated ? ':deprecated' : ''))).toStrictEqual([
 			'aria-atomic',
@@ -36,7 +36,7 @@ describe('getRoleSpec', () => {
 	});
 
 	test('the roletype role', () => {
-		const role = getRoleSpec(specs, 'roletype', 'http://www.w3.org/1999/xhtml', '1.2')!;
+		const role = getRoleSpec(specs, 'roletype', 'http://www.w3.org/1999/xhtml', '1.2');
 		const superClassRoles = role.superClassRoles.map(r => r.name);
 		expect(role.ownedProperties.map(p => p.name + (p.deprecated ? ':deprecated' : ''))).toStrictEqual([
 			'aria-atomic',

package/{src/specs/get-spec-by-tag-name.spec.ts → test/specs/get-spec-by-tag-name.spec.js}

@@ -1,6 +1,6 @@
-import { specs } from '@markuplint/html-spec';
+const { specs } = require('@markuplint/html-spec');
 
-import { getSpecByTagName } from './get-spec-by-tag-name';
+const { getSpecByTagName } = require('../../lib/specs/get-spec-by-tag-name');
 
 const divSpec = {
 	conditional: [