@markuplint/spec-generator 4.0.0-alpha.10

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2017-2024 Yusuke Hirao
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,3 @@
+# @markuplint/spec-generator
+
+This is private package for generating `@markuplint/html-spec`

package/lib/aria.d.ts

@@ -0,0 +1,18 @@
+import type { ARIAProperty, ARIARoleInSchema } from '@markuplint/ml-spec';
+export declare function getAria(): Promise<{
+    '1.3': {
+        roles: ARIARoleInSchema[];
+        props: ARIAProperty[];
+        graphicsRoles: ARIARoleInSchema[];
+    };
+    '1.2': {
+        roles: ARIARoleInSchema[];
+        props: ARIAProperty[];
+        graphicsRoles: ARIARoleInSchema[];
+    };
+    '1.1': {
+        roles: ARIARoleInSchema[];
+        props: ARIAProperty[];
+        graphicsRoles: ARIARoleInSchema[];
+    };
+}>;

package/lib/aria.js

@@ -0,0 +1,301 @@
+/* global cheerio */
+import { fetch } from './fetch.js';
+import { arrayUnique, nameCompare } from './utils.js';
+export async function getAria() {
+    const roles13 = await getRoles('1.3');
+    const roles12 = await getRoles('1.2');
+    const roles11 = await getRoles('1.1');
+    return {
+        '1.3': {
+            roles: roles13,
+            props: await getProps('1.3', roles13),
+            graphicsRoles: await getRoles('1.3', true),
+        },
+        '1.2': {
+            roles: roles12,
+            props: await getProps('1.2', roles12),
+            graphicsRoles: await getRoles('1.2', true),
+        },
+        '1.1': {
+            roles: roles11,
+            props: await getProps('1.1', roles11),
+            graphicsRoles: await getRoles('1.1', true),
+        },
+    };
+}
+function getARIASpecURLByVersion(version, graphicsAria = false) {
+    switch (version) {
+        case '1.3': {
+            if (!graphicsAria) {
+                return 'https://w3c.github.io/aria/';
+            }
+            return 'https://w3c.github.io/graphics-aria/';
+        }
+        case '1.2': {
+            if (!graphicsAria) {
+                return 'https://www.w3.org/TR/wai-aria-1.2/';
+            }
+            return 'https://w3c.github.io/graphics-aria/';
+        }
+        case '1.1': {
+            if (!graphicsAria) {
+                return 'https://www.w3.org/TR/wai-aria-1.1/';
+            }
+            return 'https://www.w3.org/TR/graphics-aria-1.0/';
+        }
+    }
+}
+async function getRoles(version, graphicsAria = false) {
+    const $ = await fetch(getARIASpecURLByVersion(version, graphicsAria));
+    const $roleList = $('#role_definitions section.role');
+    const roles = [];
+    const getAttr = (
+    // eslint-disable-next-line @typescript-eslint/prefer-readonly-parameter-types
+    li) => {
+        const $li = $(li);
+        const text = $li.text();
+        const isDeprecated = /deprecated/i.test(text) || undefined;
+        const $a = $li.find('a');
+        const name = $a.length > 0
+            ? $a
+                .text()
+                .replace(/\s*\(\s*state\s*\)\s*/i, '')
+                .trim()
+            : text.trim();
+        return {
+            name,
+            deprecated: isDeprecated,
+        };
+    };
+    $roleList.each((_, el) => {
+        const $el = $(el);
+        const name = $el.find('.role-name').attr('title')?.trim() ?? '';
+        const description = $el
+            .find('.role-description p')
+            .toArray()
+            .map(p => $(p).text().trim().replaceAll(/\s+/g, ' ').replaceAll(/\t+/g, ''))
+            .join('\n\n');
+        const $features = $el.find('.role-features tr');
+        const generalization = $features
+            .find('.role-parent a')
+            .toArray()
+            .map(a => $(a).text().trim());
+        const isAbstract = $features.find('.role-abstract').text().trim().toLowerCase() === 'true' || undefined;
+        let $ownedRequiredProps = $features.find('.role-required-properties li').toArray();
+        if ($ownedRequiredProps.length === 0) {
+            $ownedRequiredProps = $features.find('.role-required-properties').toArray();
+        }
+        const ownedRequiredProps = $ownedRequiredProps.map(getAttr).map(p => ({ ...p, required: true }));
+        const ownedInheritedProps = $features
+            .find('.role-inherited li')
+            .toArray()
+            .map(getAttr)
+            .map(p => ({ ...p, inherited: true }));
+        const ownedProps = $features.find('.role-properties li, .role-properties > a').toArray().map(getAttr);
+        const requiredContextRole = $$($features, ['.role-scope li', '.role-scope a'])
+            .toArray()
+            .map(el => {
+            const text = $(el).text().trim();
+            if (/owned\s+by|with\s+parent|with\s+accessibility\s+parent/i.test(text)) {
+                return text.replaceAll(/([a-z]+)\s+(?:owned\s+by|with\s+parent|with\s+accessibility\s+parent)\s+([a-z]+)/gi, '$2 > $1');
+            }
+            return text;
+        });
+        const requiredOwnedElements = $$($features, ['.role-mustcontain li', '.role-mustcontain a'])
+            .toArray()
+            .map(el => $(el)
+            .text()
+            .trim()
+            .replaceAll(/\s+(?:owning|→|with\s+child|with\s+accessibility\s+child)\s+/gi, ' > '));
+        const accessibleNameRequired = !!/true/i.test($features.find('.role-namerequired').text());
+        const accessibleNameFromAuthor = !!/author/i.test($features.find('.role-namefrom').text());
+        const accessibleNameFromContent = !!/content/i.test($features.find('.role-namefrom').text());
+        const accessibleNameProhibited = !!/prohibited/i.test($features.find('.role-namefrom').text());
+        const $childrenPresentational = $features.find('.role-childpresentational').text();
+        const childrenPresentational = /true/i.test($childrenPresentational)
+            ? true
+            : /false/i.test($childrenPresentational)
+                ? false
+                : undefined;
+        const ownedProperties = arrayUnique([...ownedRequiredProps, ...ownedInheritedProps, ...ownedProps].sort(nameCompare));
+        const prohibitedProperties = $features
+            .find('.role-disallowed li code')
+            .toArray()
+            .map(el => $(el).text().trim());
+        roles.push({
+            name,
+            description,
+            isAbstract,
+            generalization,
+            requiredContextRole,
+            requiredOwnedElements,
+            accessibleNameRequired,
+            accessibleNameFromAuthor,
+            accessibleNameFromContent,
+            accessibleNameProhibited,
+            childrenPresentational,
+            ownedProperties,
+            prohibitedProperties,
+        });
+    });
+    // the "none" role is synonym
+    if (version === '1.1' || version === '1.2') {
+        const presentationRole = roles.find(role => role.name === 'presentation');
+        if (presentationRole) {
+            const noneRoleIndex = roles.findIndex(role => role.name === 'none');
+            roles[noneRoleIndex] = {
+                ...presentationRole,
+                name: 'none',
+                description: roles[noneRoleIndex]?.description,
+            };
+        }
+    }
+    else {
+        const noneRole = roles.find(role => role.name === 'none');
+        if (noneRole) {
+            const noneRoleIndex = roles.findIndex(role => role.name === 'presentation');
+            roles[noneRoleIndex] = {
+                ...noneRole,
+                name: 'presentation',
+                description: roles[noneRoleIndex]?.description,
+            };
+        }
+    }
+    roles.sort(nameCompare);
+    return roles;
+}
+async function getProps(version, roles) {
+    const $ = await fetch(getARIASpecURLByVersion(version));
+    const ariaNameList = new Set();
+    for (const role of roles) {
+        if (role.ownedProperties)
+            for (const prop of role.ownedProperties) {
+                ariaNameList.add(prop.name);
+            }
+    }
+    const { implicitProps } = await getAriaInHtml();
+    const globalStatesAndProperties = new Set($('#global_states li a')
+        .toArray()
+        .map(el => $(el).attr('href')?.replace('#', ''))
+        .filter((s) => !!s));
+    const arias = [...ariaNameList].sort().map((name) => {
+        const $section = $(`#${name}`);
+        const className = $section.attr('class');
+        const type = className && /property/i.test(className) ? 'property' : 'state';
+        const deprecated = (className && /deprecated/i.test(className)) || undefined;
+        const $value = $section.find(`table.${type}-features .${type}-value, .state-features .property-value`);
+        const value = $value.text().trim();
+        const $valueDescriptions = $section.find('table.value-descriptions tbody tr');
+        const valueDescriptions = {};
+        $valueDescriptions.each((_, $tr) => {
+            const name = $($tr)
+                .find('.value-name')
+                .text()
+                .replaceAll(/\(default\)\s*:?/gi, '')
+                .trim();
+            const desc = $($tr).find('.value-description').text().trim();
+            valueDescriptions[name] = desc;
+        });
+        const enumValues = [];
+        if (value === 'token' || value === 'token list') {
+            const values = $valueDescriptions
+                .find('.value-name')
+                .toArray()
+                .map(el => $(el)
+                .text()
+                .replaceAll(/\(default\)\s*:?/gi, '')
+                .trim());
+            enumValues.push(...values);
+        }
+        const $defaultValue = $section.find('table.value-descriptions .value-name .default');
+        const defaultValue = $defaultValue
+            .text()
+            .replaceAll(/\(default\)/gi, '')
+            .trim() || undefined;
+        const isGlobal = globalStatesAndProperties.has(name) || undefined;
+        let equivalentHtmlAttrs;
+        const implicitOwnProps = implicitProps.filter(p => p.name === name);
+        if (implicitOwnProps.length > 0) {
+            equivalentHtmlAttrs = implicitOwnProps.map(attr => ({
+                htmlAttrName: attr.htmlAttrName,
+                value: attr.value,
+            }));
+        }
+        const aria = {
+            name,
+            type,
+            deprecated,
+            value,
+            enum: enumValues,
+            defaultValue,
+            isGlobal,
+            equivalentHtmlAttrs,
+            valueDescriptions: Object.keys(valueDescriptions).length > 0 ? valueDescriptions : undefined,
+        };
+        // Conditional Value
+        switch (name) {
+            case 'aria-checked': {
+                aria.value = 'true/false';
+                aria.conditionalValue = [
+                    {
+                        role: ['checkbox', 'menuitemcheckbox'],
+                        value: 'tristate',
+                    },
+                ];
+                break;
+            }
+            case 'aria-hidden': {
+                if (aria.equivalentHtmlAttrs)
+                    for (const attr of aria.equivalentHtmlAttrs) {
+                        if (attr.htmlAttrName === 'hidden') {
+                            attr.isNotStrictEquivalent = true;
+                        }
+                    }
+                break;
+            }
+        }
+        return aria;
+    });
+    arias.sort(nameCompare);
+    return arias;
+}
+async function getAriaInHtml() {
+    const $ = await fetch('https://www.w3.org/TR/html-aria/');
+    const implicitProps = [];
+    const $implicitProps = $('#requirements-for-use-of-aria-attributes-in-place-of-equivalent-html-attributes table tbody tr').toArray();
+    for (const $implicitProp of $implicitProps) {
+        const htmlAttrName = $($implicitProp).find('th:nth-of-type(1) a').eq(0).text();
+        if (htmlAttrName === 'contenteditable') {
+            // FIXME:
+            // Cannot design yet because the contenteditable attribute is evaluated with ancestors.
+            continue;
+        }
+        const implicitProp = $($implicitProp).find('td:nth-of-type(1) code').eq(0).text();
+        const [name, _value] = implicitProp.split('=');
+        if (!name) {
+            continue;
+        }
+        const value = _value?.replace(/"|'/g, '').trim() ?? null;
+        const data = {
+            name: name,
+            value: value === '...' ? null : value,
+            htmlAttrName,
+        };
+        implicitProps.push(data);
+    }
+    return {
+        implicitProps,
+    };
+}
+function $$(
+// eslint-disable-next-line @typescript-eslint/prefer-readonly-parameter-types
+$el, selectors) {
+    let $found = $el;
+    for (const selector of selectors) {
+        $found = $el.find(selector);
+        if ($found.length > 0) {
+            return $found;
+        }
+    }
+    return $found;
+}

package/lib/fetch.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="cheerio" />
+export declare function fetch(url: string): Promise<cheerio.Root>;
+export declare function fetchText(url: string): Promise<string>;
+export declare function getReferences(): string[];

package/lib/fetch.js

@@ -0,0 +1,47 @@
+import cheerio from 'cheerio';
+import { Bar, Presets } from 'cli-progress';
+const cache = new Map();
+const domCache = new Map();
+let total = 1;
+let current = 0;
+const bar = new Bar({
+    format: '🔎 Fetch references... {bar} {percentage}% | ETA: {eta}s | {value}/{total} {process}',
+}, Presets.shades_grey);
+bar.start(total, current, { process: '🚀 Started.' });
+export async function fetch(url) {
+    if (domCache.has(url)) {
+        return domCache.get(url);
+    }
+    const html = await fetchText(url);
+    const $ = cheerio.load(html);
+    domCache.set(url, $);
+    return $;
+}
+export async function fetchText(url) {
+    total += 1;
+    bar.setTotal(total);
+    let text = '';
+    if (cache.has(url)) {
+        text = cache.get(url);
+    }
+    else {
+        try {
+            const res = await global.fetch(url);
+            text = await res.text();
+            cache.set(url, text);
+        }
+        catch {
+            cache.set(url, '');
+            text = '';
+        }
+    }
+    current += 1;
+    bar.update(current, { process: `🔗 ${url.length > 30 ? `${url.slice(0, 15)}...${url.slice(-15)}` : url}` });
+    return text;
+}
+export function getReferences() {
+    current += 1;
+    bar.update(current, { process: '🎉 Finished.' });
+    bar.stop();
+    return [...cache.keys()].sort();
+}

package/lib/global-attrs.d.ts

@@ -0,0 +1,3 @@
+export declare function getGlobalAttrs(filePath: string): {
+    readonly [category: string]: Readonly<Record<string, Partial<import("@markuplint/ml-spec").Attribute>>>;
+};

package/lib/global-attrs.js

@@ -0,0 +1,5 @@
+import { readJson } from './read-json.js';
+export function getGlobalAttrs(filePath) {
+    const gAttrs = readJson(filePath);
+    return gAttrs;
+}

package/lib/html-elements.d.ts

@@ -0,0 +1,2 @@
+import type { ExtendedElementSpec } from '@markuplint/ml-spec';
+export declare function getElements(filePattern: string): Promise<ExtendedElementSpec[]>;

package/lib/html-elements.js

@@ -0,0 +1,107 @@
+import { readJsons } from './read-json.js';
+import { fetchHTMLElement, fetchObsoleteElements } from './scraping.js';
+import { getSVGElementList } from './svg.js';
+import { getName, nameCompare, sortObjectByKey } from './utils.js';
+/**
+ * @see https://html.spec.whatwg.org/multipage/obsolete.html#non-conforming-features
+ */
+const obsoleteList = [
+    'applet',
+    'acronym',
+    'bgsound',
+    'dir',
+    'frame',
+    'frameset',
+    'noframes',
+    'isindex',
+    'keygen',
+    'listing',
+    'menuitem',
+    'nextid',
+    'noembed',
+    'param',
+    'plaintext',
+    'rb',
+    'rtc',
+    'strike',
+    'xmp',
+    'basefont',
+    'big',
+    'blink',
+    'center',
+    'font',
+    'marquee',
+    'multicol',
+    'nobr',
+    'spacer',
+    'tt',
+];
+export async function getElements(filePattern) {
+    let specs = await readJsons(filePattern, (file, body) => {
+        const name = file.replace(/^.+spec\.([\w-]+)\.json$/i, '$1');
+        return {
+            // @ts-ignore
+            name,
+            ...body,
+        };
+    });
+    const deprecatedList = await getSVGElementList();
+    const obsoleteElements = fetchObsoleteElements([...obsoleteList, ...deprecatedList], specs);
+    specs.push(...obsoleteElements);
+    specs = await Promise.all(specs.map(async (el) => {
+        const { localName, namespace, ml } = getName(el.name);
+        const cite = `https://developer.mozilla.org/en-US/docs/Web/${ml}/Element/${localName}`;
+        const mdnData = await fetchHTMLElement(cite);
+        // @ts-ignore
+        delete el.name;
+        // @ts-ignore
+        delete el.namespace;
+        return {
+            // @ts-ignore
+            name: namespace === 'http://www.w3.org/2000/svg' ? `svg:${localName}` : localName,
+            namespace,
+            cite: el.cite ?? mdnData.cite,
+            description: mdnData.description,
+            categories: mdnData.categories,
+            contentModel: el.contentModel,
+            aria: el.aria,
+            omission: mdnData.omission,
+            ...el,
+            globalAttrs: sortObjectByKey(el.globalAttrs ?? {}),
+            attributes: sortObjectByKey((() => {
+                const attrs = { ...el.attributes };
+                for (const mdnAttr of Object.values(mdnData.attributes ?? {})) {
+                    if (!mdnAttr.name) {
+                        continue;
+                    }
+                    const current = attrs[mdnAttr.name];
+                    if (!current) {
+                        attrs[mdnAttr.name] = {
+                            description: mdnAttr.description,
+                            experimental: mdnAttr.experimental,
+                            obsolete: mdnAttr.obsolete,
+                            deprecated: mdnAttr.deprecated,
+                            nonStandard: mdnAttr.nonStandard,
+                        };
+                        continue;
+                    }
+                    if (typeof current === 'object' && 'name' in current) {
+                        attrs[mdnAttr.name] = {
+                            // @ts-ignore for key order that "name" is first
+                            name: mdnAttr.name,
+                            // @ts-ignore for key order that "description" is second
+                            ...mdnData.attributes,
+                            // @ts-ignore
+                            ...current,
+                        };
+                    }
+                }
+                return attrs;
+            })()),
+        };
+    }));
+    return specs
+        .sort(nameCompare)
+        .sort((a, b) => (a.namespace == b.namespace ? 0 : a.namespace === 'http://www.w3.org/2000/svg' ? 1 : -1))
+        .filter(spec => spec.name !== 'h1-h6');
+}

package/lib/index.d.ts

@@ -0,0 +1,7 @@
+export type Options = {
+    readonly outputFilePath: string;
+    readonly htmlFilePattern: string;
+    readonly commonAttrsFilePath: string;
+    readonly commonContentsFilePath: string;
+};
+export declare function main({ outputFilePath, htmlFilePattern, commonAttrsFilePath, commonContentsFilePath }: Options): Promise<void>;

package/lib/index.js

@@ -0,0 +1,27 @@
+import { writeFile } from 'node:fs/promises';
+import { getAria } from './aria.js';
+import { getReferences } from './fetch.js';
+import { getGlobalAttrs } from './global-attrs.js';
+import { getElements } from './html-elements.js';
+import { readJson } from './read-json.js';
+export async function main({ outputFilePath, htmlFilePattern, commonAttrsFilePath, commonContentsFilePath }) {
+    const [specs, globalAttrs, aria] = await Promise.all([
+        getElements(htmlFilePattern),
+        getGlobalAttrs(commonAttrsFilePath),
+        getAria(),
+    ]);
+    const cites = getReferences();
+    const json = {
+        cites,
+        def: {
+            '#globalAttrs': globalAttrs,
+            '#aria': aria,
+            '#contentModels': readJson(commonContentsFilePath).models,
+        },
+        specs: [...specs],
+    };
+    const jsonString = JSON.stringify(json, null, 2);
+    await writeFile(outputFilePath, jsonString);
+    // eslint-disable-next-line no-console
+    console.log(`🎁 Output: ${outputFilePath}`);
+}

package/lib/read-json.d.ts

@@ -0,0 +1,2 @@
+export declare function readJson<T = Record<string, any>>(filePath: string): T;
+export declare function readJsons<T = Record<string, any>>(pattern: string, hook?: (fileName: string, body: T) => T | Promise<T>): Promise<T[]>;

package/lib/read-json.js

@@ -0,0 +1,22 @@
+import fs from 'node:fs';
+import path from 'node:path';
+import { glob } from 'glob';
+import strip from 'strip-json-comments';
+export function readJson(filePath) {
+    if (!path.isAbsolute(filePath)) {
+        throw new Error(`The path must be absolute path: ${filePath}`);
+    }
+    let json = fs.readFileSync(filePath, { encoding: 'utf8' });
+    json = strip(json);
+    return JSON.parse(json);
+}
+export async function readJsons(pattern, hook = (_, body) => body) {
+    if (!path.isAbsolute(pattern)) {
+        throw new Error(`The pattern must be absolute path: ${pattern}`);
+    }
+    const files = await glob(pattern);
+    return Promise.all(files.map(file => {
+        const json = readJson(file);
+        return hook(file, json);
+    }));
+}

package/lib/scraping.d.ts

@@ -0,0 +1,4 @@
+import type { ExtendedElementSpec } from '@markuplint/ml-spec';
+export declare function fetchHTMLElementLinks(): Promise<string[]>;
+export declare function fetchObsoleteElements(obsoleteList: readonly string[], specs: readonly ExtendedElementSpec[]): ExtendedElementSpec[];
+export declare function fetchHTMLElement(link: string): Promise<ExtendedElementSpec>;

package/lib/scraping.js

@@ -0,0 +1,232 @@
+/* global cheerio */
+import { fetch } from './fetch.js';
+import { getThisOutline, sortObjectByKey } from './utils.js';
+const MAIN_ARTICLE_SELECTOR = 'article.main-page-content, article.article';
+export async function fetchHTMLElementLinks() {
+    const $ = await fetch('https://developer.mozilla.org/en-US/docs/Web/HTML/Element');
+    const $listHeading = $($('#sidebar-quicklinks summary')
+        .toArray()
+        .find(el => /html elements/i.test($(el).text())));
+    const $list = $listHeading.siblings('ol,ul');
+    const lists = $list
+        .find('li a')
+        .toArray()
+        .map(el => `https://developer.mozilla.org${$(el).attr('href')}`);
+    return lists;
+}
+export function fetchObsoleteElements(obsoleteList, specs) {
+    return obsoleteList
+        .map(name => {
+        const found = specs.find(e => e.name === name);
+        if (found) {
+            return null;
+        }
+        return {
+            name,
+            cite: 'https://html.spec.whatwg.org/multipage/obsolete.html#non-conforming-features',
+            obsolete: true,
+            categories: [],
+            contentModel: {
+                contents: true,
+            },
+            aria: {
+                permittedRoles: true,
+                implicitRole: false,
+            },
+            omission: false,
+            globalAttrs: {},
+            attributes: {},
+        };
+    })
+        .filter((e) => !!e);
+}
+export async function fetchHTMLElement(link) {
+    const $ = await fetch(link);
+    let name = link.replace(/.+\/([\w-]+)$/, '$1').toLowerCase();
+    if (name === 'heading_elements') {
+        name = 'h1-h6';
+    }
+    const $article = $(MAIN_ARTICLE_SELECTOR);
+    $article.find('p:empty').remove();
+    const description = $article.find('h2#summary').next('div').find('> p:first-of-type').text().trim().replaceAll(/\s+/g, ' ') ||
+        $article.find('.seoSummary').closest('p').text().trim().replaceAll(/\s+/g, ' ') ||
+        $article.find('h1').next('div').find('> p:first-of-type').text().trim().replaceAll(/\s+/g, ' ') ||
+        $article.find('.section-content:eq(0)').find('> p:eq(0)').text().trim().replaceAll(/\s+/g, ' ');
+    const $bcTable = $article.find('.bc-table');
+    const $bcTableFirstRow = $bcTable.find('tbody tr:first-child th');
+    const isBcTableIsAvailable = $bcTableFirstRow.find('code').text().trim() === name;
+    let experimental;
+    let obsolete;
+    let deprecated;
+    let nonStandard;
+    if (isBcTableIsAvailable) {
+        experimental = $bcTableFirstRow.find('.ic-experimental').length > 0 || undefined;
+        obsolete = $bcTableFirstRow.find('.ic-obsolete').length > 0 || undefined;
+        deprecated = $bcTableFirstRow.find('.ic-deprecated').length > 0 || undefined;
+        nonStandard = $bcTableFirstRow.find('.ic-non-standard').length > 0 || undefined;
+    }
+    else {
+        experimental =
+            $article.find('.blockIndicator.experimental, > div .notecard.experimental').length > 0 || undefined;
+        obsolete =
+            $article.find('.obsoleteHeader').length > 0 ||
+                !!/obsolete/i.test($('h1').text()) ||
+                $article.find('> div:first-child .notecard.obsolete').length > 0 ||
+                undefined;
+        deprecated =
+            $article.find('.deprecatedHeader, > div:first-child .notecard.deprecated').length > 0 ||
+                $article.find('h1').next().find('.notecard.deprecated').length > 0 ||
+                undefined;
+        nonStandard = $article.find('.nonStandardHeader, h4#Non-standard').length > 0 || undefined;
+    }
+    const categories = [];
+    const cat = getProperty($, 'Content categories');
+    if (/metadata content/i.test(cat))
+        categories.push('#metadata');
+    if (/flow content/i.test(cat))
+        categories.push('#flow');
+    if (/sectioning content/i.test(cat))
+        categories.push('#sectioning');
+    if (/heading content/i.test(cat))
+        categories.push('#heading');
+    if (/phrasing content/i.test(cat))
+        categories.push('#phrasing');
+    if (/embedded content/i.test(cat))
+        categories.push('#embedded');
+    if (/interactive content/i.test(cat))
+        categories.push('#interactive');
+    if (/palpable content/i.test(cat))
+        categories.push('#palpable');
+    if (/script-supporting/i.test(cat))
+        categories.push('#script-supporting');
+    let { attributes } = getAttributes($, '#attributes', name);
+    const { attributes: deprecatedAttributes } = getAttributes($, '#deprecated_attributes', name);
+    const { attributes: individualAttributes } = getAttributes($, '#individual_attributes', name);
+    const { attributes: nonStandardAttributes } = getAttributes($, '#non-standard_attributes', name);
+    const { attributes: obsoleteAttributes } = getAttributes($, '#obsolete_attributes', name);
+    attributes = sortObjectByKey({
+        ...attributes,
+        ...deprecatedAttributes,
+        ...individualAttributes,
+        ...nonStandardAttributes,
+        ...obsoleteAttributes,
+    });
+    const spec = {
+        name,
+        cite: link,
+        description,
+        experimental,
+        obsolete,
+        deprecated,
+        nonStandard,
+        categories,
+        contentModel: {
+            contents: false,
+        },
+        aria: {
+            implicitRole: false,
+            permittedRoles: true,
+        },
+        omission: false,
+        attributes,
+    };
+    return spec;
+}
+function getProperty(
+// eslint-disable-next-line @typescript-eslint/prefer-readonly-parameter-types
+$, prop) {
+    const $tr = $(MAIN_ARTICLE_SELECTOR).find('table.properties tr') ?? $('#Technical_summary').next('table tr');
+    const $th = $($tr
+        .find('th')
+        .toArray()
+        .filter(el => new RegExp(prop, 'i').test($(el).text())));
+    return $th.siblings('td').text().trim().replaceAll(/\s+/g, ' ');
+}
+function getAttributes(
+// eslint-disable-next-line @typescript-eslint/prefer-readonly-parameter-types
+$, heading, tagName) {
+    const $heading = $(heading);
+    const $outline = getThisOutline($, $heading);
+    const attributes = {};
+    for (const dt of $outline.find('> div > dl > dt').toArray()) {
+        const $dt = $(dt);
+        const name = $dt.find('code').text().trim();
+        if (!name) {
+            null;
+            continue;
+        }
+        const $myHeading = getItsHeading($dt);
+        const experimental = $dt.find('.icon-beaker, .icon.experimental, .icon.icon-experimental').length > 0 || undefined;
+        const obsolete = $dt.find('.icon-trash, .icon.obsolete, .icon.icon-obsolete').length > 0 ||
+            $dt.find('.obsolete').length > 0 ||
+            $myHeading?.attr('id') === 'obsolete_attributes' ||
+            undefined;
+        const deprecated = $dt.find('.icon-thumbs-down-alt, .icon.deprecated, .icon.icon-deprecated').length > 0 ||
+            $myHeading?.attr('id') === 'deprecated_attributes' ||
+            undefined;
+        const nonStandard = $dt.find('.icon-warning-sign, .icon.non-standard, .icon.icon-nonstandard').length > 0 || undefined;
+        const description = $dt
+            .next('dd')
+            .toArray()
+            .map(el => $(el).text())
+            .join('')
+            .trim()
+            .replaceAll(/\s+/g, ' ');
+        const current = attributes[name];
+        if (!current) {
+            attributes[name] = {
+                name,
+                type: 'Any',
+                // @ts-ignore
+                description,
+                experimental,
+                obsolete,
+                deprecated,
+                nonStandard,
+            };
+            continue;
+        }
+        if (typeof current === 'object' && 'name' in current) {
+            attributes[name] = {
+                // @ts-ignore for key order that "name" is first
+                name,
+                // @ts-ignore for key order that "description" is second
+                description,
+                experimental,
+                obsolete,
+                deprecated,
+                nonStandard,
+                // @ts-ignore
+                ...current,
+            };
+        }
+    }
+    return { attributes };
+}
+function getItsHeading(
+// eslint-disable-next-line @typescript-eslint/prefer-readonly-parameter-types
+$start) {
+    let $needle = upToPrevOrParent($start);
+    while ($needle.length > 0) {
+        if (isHeading($needle)) {
+            return $needle;
+        }
+        $needle = upToPrevOrParent($needle);
+    }
+    return null;
+}
+function upToPrevOrParent(
+// eslint-disable-next-line @typescript-eslint/prefer-readonly-parameter-types
+$start) {
+    let $needle = $start.prev();
+    if ($needle.length === 0) {
+        $needle = $start.parent();
+    }
+    return $needle;
+}
+function isHeading(
+// eslint-disable-next-line @typescript-eslint/prefer-readonly-parameter-types
+$el) {
+    // @ts-ignore
+    return /^h[1-6]$/i.test($el[0].tagName);
+}

package/lib/svg.d.ts

@@ -0,0 +1 @@
+export declare function getSVGElementList(): Promise<string[]>;

package/lib/svg.js

@@ -0,0 +1,18 @@
+import { fetch } from './fetch.js';
+import { getThisOutline } from './utils.js';
+export async function getSVGElementList() {
+    const index = 'https://developer.mozilla.org/en-US/docs/Web/SVG/Element';
+    const $ = await fetch(index);
+    $('section').each((_, sec) => {
+        const $sec = $(sec);
+        const children = $sec.children();
+        $sec.before(children);
+        $sec.remove();
+    });
+    const $deprecatedIndex = getThisOutline($, $('#obsolete_and_deprecated_elements'));
+    const deprecatedList = $deprecatedIndex
+        .find('div > a')
+        .toArray()
+        .map(el => 'svg_' + $(el).text().trim().replaceAll(/<|>/g, ''));
+    return deprecatedList;
+}

package/lib/utils.d.ts

@@ -0,0 +1,16 @@
+/// <reference types="cheerio" />
+type HasName = {
+    readonly name: string;
+};
+export declare function nameCompare(a: HasName | string, b: HasName | string): 1 | 0 | -1;
+export declare function sortObjectByKey<T>(o: T): T;
+export declare function arrayUnique<T extends HasName>(array: readonly T[]): T[];
+export declare function getThisOutline($: cheerio.Root, $start: cheerio.Cheerio): cheerio.Cheerio;
+export declare function mergeAttributes<T>(fromDocs: T, fromJSON: T): T;
+export declare function keys<T, K = keyof T>(object: T): K[];
+export declare function getName(origin: string): {
+    localName: string;
+    namespace: "http://www.w3.org/2000/svg" | undefined;
+    ml: string;
+};
+export {};

package/lib/utils.js

@@ -0,0 +1,73 @@
+/* global cheerio */
+export function nameCompare(a, b) {
+    const nameA = typeof a === 'string' ? a : a.name?.toUpperCase() ?? String(a);
+    const nameB = typeof b === 'string' ? b : b.name?.toUpperCase() ?? String(b);
+    if (nameA < nameB) {
+        return -1;
+    }
+    if (nameA > nameB) {
+        return 1;
+    }
+    return 0;
+}
+export function sortObjectByKey(o) {
+    // @ts-ignore
+    const keys = Object.keys(o);
+    keys.sort(nameCompare);
+    // @ts-ignore
+    const newObj = {};
+    for (const key of keys) {
+        // @ts-ignore
+        newObj[key] = o[key];
+    }
+    return newObj;
+}
+export function arrayUnique(array) {
+    const nameStack = [];
+    const result = [];
+    for (const item of array) {
+        if (nameStack.includes(item.name)) {
+            continue;
+        }
+        result.push(item);
+        nameStack.push(item.name);
+    }
+    return result;
+}
+export function getThisOutline(
+// eslint-disable-next-line @typescript-eslint/prefer-readonly-parameter-types
+$, 
+// eslint-disable-next-line @typescript-eslint/prefer-readonly-parameter-types
+$start) {
+    const $container = $('<div></div>');
+    let $next = $start.next();
+    const els = [$start.clone()];
+    while ($next.length > 0 && $next.filter('h2').length === 0) {
+        els.push($next.clone());
+        $next = $next.next();
+    }
+    for (const el of els)
+        $container.append(el);
+    return $container;
+}
+export function mergeAttributes(fromDocs, fromJSON) {
+    return {
+        ...fromDocs,
+        ...fromJSON,
+    };
+}
+export function keys(object) {
+    // @ts-ignore
+    return Object.keys(object);
+}
+export function getName(origin) {
+    const [, ns, localName] = origin.match(/^(?:(svg)_)?(\w+)/i) ?? [];
+    const name = localName ?? origin;
+    const ml = ns === 'svg' ? 'SVG' : 'HTML';
+    const namespace = ns === 'svg' ? 'http://www.w3.org/2000/svg' : undefined;
+    return {
+        localName: name,
+        namespace,
+        ml,
+    };
+}

package/package.json

@@ -0,0 +1,39 @@
+{
+	"name": "@markuplint/spec-generator",
+	"version": "4.0.0-alpha.10",
+	"description": "Generates @markuplint/html-spec",
+	"repository": "git@github.com:markuplint/markuplint.git",
+	"author": "Yusuke Hirao <yusukehirao@me.com>",
+	"license": "MIT",
+	"private": false,
+	"type": "module",
+	"exports": {
+		".": {
+			"import": "./lib/index.js",
+			"types": "./lib/index.d.ts"
+		}
+	},
+	"publishConfig": {
+		"access": "public"
+	},
+	"scripts": {
+		"build": "tsc",
+		"clean": "tsc --build --clean"
+	},
+	"dependencies": {
+		"@types/cheerio": "^0.22.35",
+		"ajv": "^8.12.0",
+		"cheerio": "^1.0.0-rc.12",
+		"cli-progress": "^3.12.0",
+		"fast-xml-parser": "^4.3.3",
+		"glob": "^10.3.6",
+		"strip-json-comments": "^5.0.1"
+	},
+	"devDependencies": {
+		"@markuplint/ml-spec": "4.0.0-alpha.10",
+		"@markuplint/test-tools": "4.0.0-alpha.10",
+		"@types/cli-progress": "^3.11.5",
+		"type-fest": "^4.10.1"
+	},
+	"gitHead": "b41153ea665aa8f091daf6114a06047f4ccb8350"
+}