Merge branch 'main' into experimental-content

.eslintrc.json

@@ -12,11 +12,13 @@
     "ecmaVersion": 6
   },
   "rules": {
+    "jsdoc/check-line-alignment": 0,
     "jsdoc/no-undefined-types": 0,
     "jsdoc/require-jsdoc": 0,
     "jsdoc/require-param-description": 0,
     "jsdoc/require-param-type": 0,
     "jsdoc/require-returns-description": 0,
+    "jsdoc/tag-lines": ["warn", "any", { "startLines": 1 }],
     "strict": [2, "global"],
     "no-console": "error"
   },

.github/workflows/coverage-report.yml

@@ -16,12 +16,12 @@ jobs:
     runs-on: ubuntu-latest
 
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
         with:
           ref: refs/pull/${{ github.event.pull_request.number }}/head
 
       - name: Set up Node.js
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
           cache: npm
 
@@ -33,7 +33,7 @@ jobs:
           node test/util/report.js >> coverage.log || true
 
       - name: Comment on PR
-        uses: actions/github-script@v6
+        uses: actions/github-script@v7
         with:
           github-token: ${{secrets.GITHUB_TOKEN}}
           script: |

.github/workflows/examples.yml

@@ -25,10 +25,10 @@ jobs:
     runs-on: ubuntu-latest
 
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
 
       - name: Set up Node.js
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
           cache: npm
 
@@ -45,10 +45,10 @@ jobs:
     runs-on: ubuntu-latest
 
     steps:
-      - uses: actions/checkout@v2
+      - uses: actions/checkout@v4
 
       - name: Set up Node.js
-        uses: actions/setup-node@v2
+        uses: actions/setup-node@v4
         with:
           cache: npm
 

.github/workflows/link-checker.yml

@@ -8,10 +8,10 @@ jobs:
 
     steps:
       - name: Clone repository
-        uses: actions/checkout@v3
+        uses: actions/checkout@v4
 
       - name: Set up Node.js
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
           cache: npm
 

.github/workflows/lint-css.yml

@@ -26,17 +26,18 @@ jobs:
 
     steps:
       - name: Clone repository
-        uses: actions/checkout@v3
+        uses: actions/checkout@v4
 
       - name: Set up Node.js
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
           cache: npm
 
-      - uses: xt0rted/stylelint-problem-matcher@v1
-
       - name: Install npm dependencies
         run: npm ci
 
       - name: Stylelint
-        run: npm run lint:css
+        run: npx stylelint "**/*.css" -f github
+
+      - name: Prettier
+        run: npx prettier --check "**/*.css"

.github/workflows/lint-html.yml

@@ -32,10 +32,10 @@ jobs:
 
     steps:
       - name: Clone repository
-        uses: actions/checkout@v3
+        uses: actions/checkout@v4
 
       - name: Set up Node.js
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
           cache: npm
 

.github/workflows/lint-js.yml

@@ -26,12 +26,12 @@ jobs:
 
     steps:
       - name: Clone repository
-        uses: actions/checkout@v3
+        uses: actions/checkout@v4
 
       # setup-node task is used without a particular version in order to load
       # the ESLint problem matchers
       - name: Set up Node.js
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
           cache: npm
 

.github/workflows/regression.yml

@@ -28,12 +28,12 @@ jobs:
         CI_NODE_INDEX: [0, 1, 2, 3, 4]
 
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
         with:
           fetch-depth: 0
 
       - name: Set up Node.js
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
           cache: npm
 

.github/workflows/spelling.yml

@@ -29,10 +29,10 @@ jobs:
 
     steps:
       - name: Clone repository
-        uses: actions/checkout@v3
+        uses: actions/checkout@v4
 
       - name: Set up Node.js
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
           cache: npm
 

.github/workflows/wai-trigger-cleanup.yml

@@ -13,10 +13,10 @@ jobs:
     if: ${{ github.event_name == 'delete' && github.event.ref_type == 'branch' }}
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
 
       - name: Set up Node.js
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
           cache: npm
 
@@ -36,10 +36,10 @@ jobs:
     if: ${{ github.event_name == 'pull_request' || github.event_name == 'pull_request_target' }}
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
 
       - name: Set up Node.js
-        uses: actions/setup-node@v3
+        uses: actions/setup-node@v4
         with:
           cache: npm
 

.github/workflows/wai-trigger-deploy.yml

@@ -14,10 +14,10 @@ jobs:
   deploy-wai:
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
 
       - name: Trigger wai-aria-practices update
-        uses: actions/github-script@v6
+        uses: actions/github-script@v7
         with:
           github-token: ${{ secrets.GH_TOKEN }}
           script: |

.github/workflows/wai-trigger-pr.yml

@@ -20,12 +20,12 @@ jobs:
     runs-on: ubuntu-latest
 
     steps:
-      - uses: actions/checkout@v3
+      - uses: actions/checkout@v4
         with:
           ref: refs/pull/${{ github.event.pull_request.number }}/head
 
       - name: Trigger wai-aria-practices PR update
-        uses: actions/github-script@v6
+        uses: actions/github-script@v7
         env:
           APG_BRANCH: ${{ github.head_ref }}
           APG_SHA: ${{ github.event.pull_request.head.sha }}

.husky/pre-commit

@@ -1,4 +1 @@
-#!/bin/sh
-. "$(dirname "$0")/_/husky.sh"
-
 npx lint-staged

.prettierrc

@@ -1,5 +1,6 @@
 {
   "singleQuote": true,
+  "trailingComma": "es5",
   "overrides": [
     {
       "files": ["**/*.css"],

common/script/participants.js

@@ -0,0 +1,81 @@
+function getParticipants() {
+    // Define the W3C's group ID
+    const GROUP_ID = "83726";
+
+    // Define the base URL for the API, using the group ID
+    const BASE_URL = `https://api.w3.org/groups/${GROUP_ID}`;
+
+    // Define the ID of the list element where the user information will be inserted
+    const LIST_ID = "ack_group";
+
+    /**
+     * Fetches users and their affiliations from the API and returns an array of user information.
+     * Each element in the array is an object containing the user's title and affiliation.
+     *
+     * @async
+     * @function getUsersInfo
+     * @returns {Promise<Array<{title: string, affiliation: string}>>} - A promise that resolves to an array of user information.
+     */
+    async function getUsersInfo() {
+        // Send a GET request to the users endpoint
+        const response = await fetch(`${BASE_URL}/users`);
+        // Fetch the JSON data from the response
+        const data = await response.json();
+        // Extract the list of users
+        const users = data._links.users;
+
+        // Initialize an empty array to store user information
+        let usersInfo = [];
+        // Iterate over each user
+        for (const user of users) {
+            // Fetch the affiliation of the current user
+            const affiliation = await getAffiliation(user);
+            // Push an object containing the user's title and affiliation to the usersInfo array
+            usersInfo.push({ title: user.title, affiliation: affiliation });
+        }
+        // Return the array containing information of all users
+        return usersInfo;
+    }
+
+    /**
+     * Fetches the affiliation of a given user from the API.
+     *
+     * @async
+     * @function getAffiliation
+     * @param {Object} user - The user object.
+     * @returns {Promise<string>} - A promise that resolves to the title of the user's affiliation.
+     */
+    async function getAffiliation(user) {
+        // Send a GET request to the affiliations endpoint of the user
+        const response = await fetch(user.href + "/affiliations/");
+
+        // Fetch the JSON data from the response
+        const affiliations = await response.json();
+
+        // Extract the title of the first affiliation
+        const affiliation = affiliations._links.affiliations[0].title;
+
+        // Return the title of the affiliation
+        return affiliation;
+    }
+
+    /**
+     * Fetches users and their affiliations, creates a list item for each user with their title and affiliation,
+     * and appends these list items to a specified list in the document.
+     *
+     * @async
+     * @function insertUsersInfoIntoDocument
+     */
+    async function insertUsersInfoIntoDocument() {
+        const usersInfo = await getUsersInfo();
+        const usersList = document.querySelector(`#${LIST_ID} ul`);
+
+        for (const user of usersInfo) {
+            const li = document.createElement("li");
+            li.textContent = `${user.title} (${user.affiliation})`;
+            usersList.appendChild(li);
+        }
+    }
+
+    insertUsersInfoIntoDocument();
+}

content/about/about.html

@@ -58,6 +58,15 @@ <h2><a href="related-specifications/related-specifications.html">Related Specifi
             <a href="related-specifications/related-specifications.html">Related Specifications</a>.
           </p>
         </li>
+        <li>
+          <h2><a href="at-support-tables/at-support-tables.html">Assistive Technology Support Tables</a></h2>
+          <p>
+            Pages that provide example implementations of APG patterns also, when available,  provide a summary of assistive technology support of the ARIA used in those examples.
+            Learn how to interpret and use data in the
+            <a href="at-support-tables/at-support-tables.html">Assistive Technology Support Tables</a>.
+          </p>
+        </li>
+
         <li>
           <h2><a href="coverage-and-quality/coverage-and-quality-report.html">Coverage and Quality Report</a></h2>
           <p>