Add top-level index.html for dev only (not GH Pages / W3C site) (#4076)

- Adds extremely simple top-level `index.html` - Updates `.eleventyignore` to allow for top-level HTML files, while still ignoring top-level files that shouldn't be built - Adds condition to `CustomLiquid.ts` to avoid processing pages outside of `techniques` or `understanding` - Adds considerations to the Eleventy config when targeting GH Pages or w3.org, to clear any preexisting output folder and to avoid outputting top-level `index.html`
w3c · Sep 20, 2024 · e4469d7 · e4469d7
1 parent bf4b123
commit e4469d7
Show file tree

Hide file tree

Showing 6 changed files with 86 additions and 42 deletions.
diff --git a/.eleventyignore b/.eleventyignore
@@ -1,5 +1,6 @@
-*.*
+*.md
 11ty/
+acknowledgements.html
 acknowledgements/
 conformance-challenges/
 guidelines/

diff --git a/11ty/CustomLiquid.ts b/11ty/CustomLiquid.ts
@@ -89,6 +89,8 @@ export class CustomLiquid extends Liquid {
       const isIndex = indexPattern.test(filepath);
       const isTechniques = techniquesPattern.test(filepath);
       const isUnderstanding = understandingPattern.test(filepath);
+
+      if (!isTechniques && !isUnderstanding) return super.parse(html);
 
       const $ = flattenDom(html, filepath);
 

diff --git a/eleventy.config.ts b/eleventy.config.ts
@@ -1,4 +1,5 @@
 import compact from "lodash-es/compact";
+import { rimraf } from "rimraf";
 
 import { copyFile } from "fs/promises";
 
@@ -124,6 +125,7 @@ export default function (eleventyConfig: any) {
   eleventyConfig.addGlobalData("eleventyComputed", {
     // permalink determines output structure; see https://www.11ty.dev/docs/permalinks/
     permalink: ({ page, isUnderstanding }: GlobalData) => {
+      if (page.inputPath === "./index.html" && process.env.WCAG_MODE) return false;
       if (isUnderstanding) {
         // understanding-metadata.html exists in 2 places; top-level wins in XSLT process
         if (/\/20\/understanding-metadata/.test(page.inputPath)) return false;
@@ -173,6 +175,12 @@ export default function (eleventyConfig: any) {
 
   eleventyConfig.addPassthroughCopy("working-examples/**");
 
+  eleventyConfig.on("eleventy.before", async ({ runMode }: EleventyEvent) => {
+    // Clear the _site folder before publishes to GH Pages or W3C site,
+    // to avoid inheriting dev-only files from previous runs
+    if (runMode === "build" && process.env.WCAG_MODE) await rimraf("_site");
+  });
+
   eleventyConfig.on("eleventy.after", async ({ dir }: EleventyEvent) => {
     // addPassthroughCopy can only map each file once,
     // but base.css needs to be copied to a 2nd destination

diff --git a/index.html b/index.html
@@ -0,0 +1,14 @@
+<!DOCTYPE html>
+<html lang="en">
+	<head>
+		<meta charset="utf-8"/>
+		<title>Web Content Accessibility Guidelines {{ versionDecimal }}</title>
+	</head>
+	<body>
+		<h1>Web Content Accessibility Guidelines {{ versionDecimal }}</h1>
+		<ul>
+			<li><a href="techniques/">Techniques</a></li>
+			<li><a href="understanding/">Understanding Docs</a></li>
+		</ul>
+	</body>
+</html>
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -21,6 +21,7 @@
     "liquidjs": "^10.14.0",
     "lodash-es": "^4.17.21",
     "mkdirp": "^3.0.1",
+    "rimraf": "^5.0.10",
     "tsx": "^4.11.0"
   },
   "devDependencies": {