Skip to content

Conversation

kfranqueiro
Copy link
Contributor

This removes classes from code elements that appear inline within prose.

These classes have no effect, and based on local testing, it would be unrealistic to expect highlight.js to provide meaningful syntax highlighting in the vast majority of these cases due to insufficient context. See #4611 (comment) for more details.

I have looked over this changeset and also ran screenshot diffs; this causes no visible changes.

I did not use global find/replace to perform these changes, since it would be non-trivial to make that skip <pre ...>...<code class="..."> cases, which this intentionally leaves intact. Instead, I made a script using cheerio (the same library the build system uses for transforms):

import { load } from "cheerio";
import { readFile, writeFile } from "fs/promises";
import { glob } from "glob";

/** Extracts body to avoid causing unrelated formatting changes */
const getBody = (html) => html.replace(/[\s\S]*<body[^>]*>/, "").replace(/<\/body>[\s\S]*/, "");

for (const path of await glob(["techniques/**/*.html", "understanding/**/*.html", "working-examples/**/*.html"])) {
  const content = await readFile(path, "utf8");
  const $ = await load(getBody(content), null, false);
  const inlineCodeWithClass$ = $("code[class]:not(:is(pre code))");
  console.log(path, inlineCodeWithClass$.length);
  inlineCodeWithClass$.each((_, el) => $(el).removeAttr("class"));
  await writeFile(path, content.replace(/(<body[^>]*>)[\s\S]*<\/body>/, `$1${$.html()}</body>`));
}

This script resulted in some unrelated changes due to the underlying parse5 library sanitizing HTML. I went through the changeset and backed out any unrelated changes I could find, so this should only include class="..." removals within inline <code> tags.

Copy link

netlify bot commented Sep 18, 2025

Deploy Preview for wcag2 ready!

Name Link
🔨 Latest commit 6a81160
🔍 Latest deploy log https://app.netlify.com/projects/wcag2/deploys/68d32a2d86478a0008d9429d
😎 Deploy Preview https://deploy-preview-4621--wcag2.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

Copy link
Contributor

@iadawn iadawn left a comment

Choose a reason for hiding this comment

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

I trust that the 231 files are fine! :)

@kfranqueiro kfranqueiro force-pushed the kgf-remove-inline-code-classes branch from 0c2672a to 30939ff Compare September 23, 2025 22:01
@kfranqueiro kfranqueiro force-pushed the kgf-remove-inline-code-classes branch from 30939ff to 6a81160 Compare September 23, 2025 23:15
@kfranqueiro kfranqueiro merged commit bf126a3 into main Sep 24, 2025
7 checks passed
@kfranqueiro kfranqueiro deleted the kgf-remove-inline-code-classes branch September 24, 2025 16:18
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants