Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
7 changes: 5 additions & 2 deletions .github/workflows/roleInfo.yml
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ name: roleInfo update
on:
push:
branches:
- main
- gh-pages
Copy link
Copy Markdown
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't know how to test this without merging. Also, this may help with or may be blocked by #2768.

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Only way would be through setting up a fork

Copy link
Copy Markdown
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I thought this is the cleanest way: when a version is published to github, we update roleinfo.


jobs:
roleInfo:
Expand All @@ -12,15 +12,18 @@ jobs:
- name: Checkout
uses: actions/checkout@v6
with:
ref: main
fetch-depth: 0 # Needed to compare with origin/main
token: ${{ secrets.W3CGRUNTBOT_TOKEN }}
- name: Use Node.js
uses: actions/setup-node@v6
with:
node-version: "latest"
- run: npm i linkedom prettier@3.6.0
- run: node ./common/script/buildRoleInfo.js > ./common/script/roleInfo.js
- run: git checkout gh-pages index.html # checkout (respec'ed) aria spec from gh-pages (WARNING: changes get staged!)
- run: node ./common/script/buildRoleInfo.js # build roleInfo.js
- run: npx prettier --write --print-width 200 ./common/script/roleInfo.js
- run: git reset index.html # reset spec source (to avoid comittting, cf. wanrning above)
- run: git config user.name "github-actions[bot]"
- run: git config user.email "41898282+github-actions[bot]@users.noreply.github.com"
- run: git add ./common/script/roleInfo.js
Expand Down
2 changes: 1 addition & 1 deletion .github/workflows/roleInfoCheck.yml
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,6 @@ jobs:
with:
node-version: "latest"
- run: npm i linkedom prettier@3.6.0
- run: node ./common/script/buildRoleInfo.js > ./common/script/roleInfo.js
- run: node ./common/script/buildRoleInfo.js
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I am not clear how this check would work. In PRs you don't have the respec esported spec, previews are built at run time.

Copy link
Copy Markdown
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Oh! You're right. My brain clearly stopped working at some point.

I'll fix it.

- run: npx prettier --write --print-width 200 ./common/script/roleInfo.js
- run: git diff --exit-code
2 changes: 1 addition & 1 deletion common/script/ariaPreprocessing.js
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ const buildGlobalStatesAndPropertiesLists = (globalStatesPlaceholder, roletypePr
if (!(isDefault || isProhibited || isDeprecated)) return;
const isState = def.tagName === "SDEF";
const refTagName = isState ? "sref" : "pref";
const htmlString = `<li><${refTagName} ${isProhibited ? "data-prohibited " : ""}${isDeprecated ? "data-deprecated " : ""}${
const htmlString = `<li${isProhibited ? ` data-prohibited="${def.innerHTML}"` : ""}${isDeprecated ? ` data-deprecated="${def.innerHTML}"` : ""}><${refTagName} ${isProhibited ? "data-prohibited " : ""}${isDeprecated ? "data-deprecated " : ""}${
isState ? `title="${def.innerHTML}"` : ""
}>${def.innerHTML}${isState ? " (state)" : ""}</${refTagName}>${
// TODO: consider moving "(state)" out of sref/pref tag; then maybe remove title attr for sref (after checking resolveReferences interference)
Expand Down
158 changes: 147 additions & 11 deletions common/script/buildRoleInfo.js
Original file line number Diff line number Diff line change
@@ -1,17 +1,153 @@
import * as fs from "node:fs";
import fs from "node:fs";
import path from "node:path";

import { parseHTML } from "linkedom";
const __dirname = import.meta.dirname;

// NOTE: this script expects compiled respec output (e.g. gh-pages branch).
// If you are working on this file, you will need to run, e.g. get a copy from gh-pages or
// run `$ npx respec --src index.html --out index.html`
const inputFilename = path.resolve('index.html');
Comment thread
daniel-montalvo marked this conversation as resolved.
const outputFilename = path.join(__dirname, "roleInfo.js");

const { document } = parseHTML(fs.readFileSync(inputFilename).toString())
const roleTypeProps = document.querySelector('#roletype .role-properties');
const statesAndProps = {}

document.querySelectorAll('#states_and_properties :is(.state, .property)').forEach(
spSection => {
const key = spSection.id;
const value = {};
statesAndProps[key] = value;
value.is = spSection.classList.contains('state') ? 'state' : 'property';
value.name = key;
value.required = false;
value.disallowed = false;
value.deprecated = roleTypeProps.querySelector(`[data-deprecated="${key}"]`) ? true : false;
// TODO: consider adding value information
}
)

const roleInfo = {};


// TODO: remove this HACK (which reproduces most of the current broken state, cf. its use below)
const currentyBroken = [
"alertdialog",
"application",
"banner",
"blockquote",
"button",
"caption",
"code",
"columnheader",
"combobox",
"comment",
"complementary",
"contentinfo",
"definition",
"deletion",
"directory",
"emphasis",
"feed",
"figure",
"form",
"generic",
"heading",
"image",
"img",
"insertion",
"link",
"listbox",
"log",
"main",
"mark",
"marquee",
"math",
"menubar",
"menuitemcheckbox",
"menuitemradio",
"meter",
"navigation",
"none",
"note",
"paragraph",
"presentation",
"progressbar",
"radio",
"radiogroup",
"region",
"row",
"rowgroup",
"rowheader",
"scrollbar",
"search",
"searchbox",
"sectionfooter",
"sectionheader",
"separator",
"slider",
"spinbutton",
"strong",
"subscript",
"suggestion",
"superscript",
"switch",
"tab",
"tablist",
"tabpanel",
"term",
"time",
"timer",
"toolbar",
"tooltip",
"treegrid",
"treeitem"
]

const generateRoleInfoEntry = (roleSection) => {
const key = roleSection.id;
const value = {};
roleInfo[key] = value;
value.name = key;
value.fragID = key; //TODO: [minor] is this duplication really worth it? Role names should be valid IDREFS, no?
value.parentRoles = [];
roleSection.querySelectorAll('.role-parent .role-reference').forEach(node => value.parentRoles.push(node.textContent));
value.localprops = [];

roleSection.querySelectorAll(':is(.role-required-properties, .role-properties, .role-disallowed) :is(.property-reference, .state-reference)').forEach(
link => {
const name = link.textContent.split(' ')[0]; //TODO: hack because roletype has (state) inside link (as the only role to have that), cf. TODO: in ariaPreprocessing.js
const prop = structuredClone(statesAndProps[name]);
if (key !== 'roletype') prop.deprecated = false; // TODO: should roletype have deprecated=true when the spec lists everything as supported?
if (link.closest('.role-disallowed')) prop["disallowed"] = true;
if (link.closest('.role-required-properties')) prop["required"] = true;
value.localprops.push(prop);
}
)
// TODO: why localprops separately? (localprops are duplicated in allprops; maybe property)

value.localprops.sort((a, b) => a.name < b.name);

const { document } = parseHTML(fs.readFileSync("../aria/index.html").toString());
const localPropNames = value.localprops.map(prop => prop.name);

// mock functions for aria.js
let updateReferences = () => {};
document.URL = "";
if (currentyBroken.indexOf(key) > -1) return; //TODO: remove this HACK (cf. above)

const script = fs.readFileSync("./common/script/aria.js").toString();
const prescript = fs.readFileSync("./common/script/ariaPreprocessing.js").toString();
value.allprops = structuredClone(value.localprops); //TODO: why do we duplicate them? Does ariaChild.js need this duplication? (I understand its "allprops" but just "inherited" seems cleaner.)
roleSection.querySelectorAll('.role-inherited :is(.property-reference, .state-reference)').forEach(
link => {
const name = link.textContent.split(' ')[0]; //TODO: hack because roletype has (state) inside link (as the only role to have that), cf. TODO: in ariaPreprocessing.js
const prop = structuredClone(statesAndProps[name]);
if (localPropNames.indexOf(prop.name) > -1) prop.deprecated = false; // NOTE: ignores the fact that localProps may be disallowed (which is ok at time of writing)
if (link.closest('.role-disallowed')) prop["disallowed"] = true;
value.allprops.push(prop);
}
)
// TODO: sort value.allprops
}

// HACK call ariaPreprocessing(), ariaAttributeReferences(), and log out roleInfo with prefix
const scriptAddition = 'ariaPreprocessing();ariaAttributeReferences();console.log("/* This file is generated - do not modify */ var roleInfo = "+JSON.stringify(roleInfo, null, 2));';
document.querySelectorAll('#role_definitions .role').forEach(generateRoleInfoEntry);

// HACK: eval!
eval(prescript + script + scriptAddition);
// sort keys
const sortKeys = o => Object.keys(o).sort().reduce((r, k) => (r[k] = o[k], r), {});
fs.writeFileSync(outputFilename, "/* This file is generated - do not modify */ var roleInfo = " + JSON.stringify(sortKeys(roleInfo), null, 2));
Loading
Loading