Update ts config (#38)

* Update TS config

* Switch to ESM

* Remove requires, __dirname

* Patch around vue tests

* Clean up

* Fix persister not awaiting its value

* Fix puppeteer test

* Fix knip issues

* Dedupe packages

* Try to re-enable puppeteer tests

* Improve promise handling

* De-activate puppeteer tests again

* Activate scraper 'test'

common/package.json

@@ -2,6 +2,10 @@
   "$schema": "http://json.schemastore.org/package",
   "private": true,
   "name": "common",
+  "type": "module",
+  "engines": {
+    "node": ">=20.0.0"
+  },
   "exports": {
     "./persist": "./persist.js",
     "./persist.js": "./persist.js"

common/persist.ts

@@ -1,27 +1,30 @@
 /// <reference types="node" />
 
 import { Question } from "@siteimprove/alfa-act";
-import { Handler } from "@siteimprove/alfa-assert";
+import type { Handler } from "@siteimprove/alfa-assert";
 import { Formatter } from "@siteimprove/alfa-formatter";
 import earl from "@siteimprove/alfa-formatter-earl";
 import { Future } from "@siteimprove/alfa-future";
 import { Hashable } from "@siteimprove/alfa-hash";
-import { Mapper } from "@siteimprove/alfa-mapper";
+import type { Mapper } from "@siteimprove/alfa-mapper";
 
 import * as fs from "fs";
 import * as path from "path";
 
 export function persist<I, T extends Hashable, Q extends Question.Metadata, S>(
   output: Mapper<I, string>,
-  format: Formatter<I, T, Q, S> = earl()
+  format: Formatter<I, T, Q, S> = earl.default()
 ): Handler<I, T, Q, S> {
   return (input, rules, outcomes, message) =>
     Future.from(async () => {
       const file = path.relative(process.cwd(), output(input));
       const dir = path.dirname(file);
 
       fs.mkdirSync(dir, { recursive: true });
-      fs.writeFileSync(file, format(input, rules, [...outcomes]) + "\n");
+      fs.writeFileSync(
+        file,
+        (await format(input, rules, [...outcomes])) + "\n"
+      );
 
       return `${message}, see the full report at ${file}`;
     });

config/knip.ts

@@ -32,7 +32,10 @@ const config: KnipConfig = {
     "unit-testing/*": { entry, project },
     "unit-testing/angular": { entry: ["components/*.ts", "setup.ts"], project },
     "unit-testing/react": { entry: ["components/*.tsx", "setup.ts"], project },
-    "unit-testing/vue": { entry: ["components/*.ts", "setup.ts"], project },
+    "unit-testing/vue": {
+      entry: ["components/*.ts", "jsdom-environment.ts", "setup.ts"],
+      project,
+    },
   },
 };
 

custom-testing/adding-rules/package.json

@@ -5,6 +5,10 @@
   "scripts": {
     "test": "mocha --timeout 10000"
   },
+  "type": "module",
+  "engines": {
+    "node": ">=20.0.0"
+  },
   "devDependencies": {
     "@siteimprove/alfa-act": "^0.81.0",
     "@siteimprove/alfa-chai": "^0.65.2",

custom-testing/adding-rules/test/page.spec.ts

@@ -11,6 +11,8 @@ import { Future } from "@siteimprove/alfa-future";
 import { Playwright } from "@siteimprove/alfa-playwright";
 
 import * as chai from "chai";
+import * as path from "node:path";
+import * as url from "node:url";
 import * as playwright from "playwright";
 
 import * as alfa from "@siteimprove/alfa-chai";
@@ -60,7 +62,7 @@ const myRule = Rule.Atomic.of<Page, Element>({
 });
 
 // adding myRule to the default ruleset
-const allRules = rules.append(myRule);
+const allRules = rules.default.append(myRule);
 
 // Creating a Chai plugin which runs all rules (default and custom).
 chai.use(
@@ -73,6 +75,10 @@ chai.use(
 
 const { expect } = chai;
 
+// TODO: This should be replaced with import.meta.dirname once we switch to Node 22
+const __filename = url.fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+
 describe("page.html", () => {
   let browser: playwright.Browser;
   let page: playwright.Page;
@@ -82,7 +88,9 @@ describe("page.html", () => {
     browser = await playwright.chromium.launch();
     page = await browser.newPage();
 
-    await page.goto(`file://${require.resolve("./fixtures/page.html")}`);
+    await page.goto(
+      url.pathToFileURL(path.join(__dirname, "fixtures", "page.html")).href
+    );
 
     document = await page.evaluateHandle(() => window.document);
   });

custom-testing/answering/package.json

@@ -5,6 +5,10 @@
   "scripts": {
     "test": "mocha --timeout 10000"
   },
+  "type": "module",
+  "engines": {
+    "node": ">=20.0.0"
+  },
   "devDependencies": {
     "@siteimprove/alfa-act": "^0.81.0",
     "@siteimprove/alfa-chai": "^0.65.2",

custom-testing/answering/test/answering.spec.ts

@@ -12,6 +12,8 @@ import { Refinement } from "@siteimprove/alfa-refinement";
 import rules, { Question } from "@siteimprove/alfa-rules";
 
 import * as chai from "chai";
+import * as path from "node:path";
+import * as url from "node:url";
 import * as playwright from "playwright";
 
 import * as alfa from "@siteimprove/alfa-chai";
@@ -24,7 +26,7 @@ const { and } = Refinement;
 chai.use(
   alfa.Chai.createPlugin(
     (value: Playwright.Type) => Future.from(Playwright.toPage(value)),
-    rules.filter((rule) => !rule.uri.includes("r111")),
+    rules.default.filter((rule) => !rule.uri.includes("r111")),
     [persist(() => "test/outcomes/page.spec.json")]
   )
 );
@@ -35,9 +37,13 @@ const { expect } = chai;
 let browser: playwright.Browser;
 let page: playwright.Page;
 
+// TODO: This should be replaced with import.meta.dirname once we switch to Node 22
+const __filename = url.fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+
 async function load(file: string): Promise<playwright.JSHandle> {
-  const path = `./fixtures/${file}`;
-  await page.goto(`file://${require.resolve(path)}`);
+  const fixture = path.join(__dirname, "fixtures", file);
+  await page.goto(url.pathToFileURL(fixture).href);
 
   return page.evaluateHandle(() => window.document);
 }

custom-testing/crawling/crawling.ts

@@ -1,5 +1,6 @@
-import * as fs from "fs";
-import * as path from "path";
+import * as fs from "node:fs";
+import * as url from "node:url";
+import * as path from "node:path";
 
 import { Audit, Outcome, Question } from "@siteimprove/alfa-act";
 import { Crawler } from "@siteimprove/alfa-crawler";
@@ -15,12 +16,16 @@ if (!scope) {
   process.exit(1);
 }
 
+// TODO: This should be replaced with import.meta.dirname once we switch to Node 22
+const __filename = url.fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+
 const frontier = Frontier.of(scope, [scope, ...seed]);
 
 Crawler.with(async (crawler) => {
   for await (const result of crawler.crawl(frontier)) {
     for (const input of result) {
-      const outcomes = await Audit.of(input, rules)
+      const outcomes = await Audit.of(input, rules.default)
         .evaluate()
         .map((outcomes) => [...outcomes]);
 

custom-testing/crawling/package.json

@@ -5,6 +5,10 @@
   "scripts": {
     "test": "node crawling.js"
   },
+  "type": "module",
+  "engines": {
+    "node": ">=20.0.0"
+  },
   "devDependencies": {
     "@siteimprove/alfa-act": "^0.81.0",
     "@siteimprove/alfa-crawler": "^0.65.2",

custom-testing/filtering/package.json

@@ -5,6 +5,10 @@
   "scripts": {
     "test": "mocha --timeout 10000"
   },
+  "type": "module",
+  "engines": {
+    "node": ">=20.0.0"
+  },
   "devDependencies": {
     "@siteimprove/alfa-act": "^0.81.0",
     "@siteimprove/alfa-chai": "^0.65.2",

custom-testing/filtering/test/filtering.spec.ts

@@ -10,6 +10,8 @@ import { Refinement } from "@siteimprove/alfa-refinement";
 import { Conformance, Criterion, Technique } from "@siteimprove/alfa-wcag";
 
 import * as chai from "chai";
+import * as path from "node:path";
+import * as url from "node:url";
 import * as playwright from "playwright";
 
 import * as alfa from "@siteimprove/alfa-chai";
@@ -24,7 +26,7 @@ const { and } = Refinement;
 chai.use(
   alfa.Chai.createPlugin(
     (value: Playwright.Type) => Future.from(Playwright.toPage(value)),
-    rules.filter((rule) => !rule.uri.includes("r111")),
+    rules.default.filter((rule) => !rule.uri.includes("r111")),
     [persist(() => "test/outcomes/filtering.spec.json")]
   )
 );
@@ -35,9 +37,13 @@ const { expect } = chai;
 let browser: playwright.Browser;
 let page: playwright.Page;
 
+// TODO: This should be replaced with import.meta.dirname once we switch to Node 22
+const __filename = url.fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+
 async function load(file: string): Promise<playwright.JSHandle> {
-  const path = `./fixtures/${file}`;
-  await page.goto(`file://${require.resolve(path)}`);
+  const fixture = path.join(__dirname, "fixtures", file);
+  await page.goto(url.pathToFileURL(fixture).href);
 
   return page.evaluateHandle(() => window.document);
 }

custom-testing/interacting/package.json

@@ -5,6 +5,10 @@
   "scripts": {
     "test": "mocha --timeout 10000"
   },
+  "type": "module",
+  "engines": {
+    "node": ">=20.0.0"
+  },
   "devDependencies": {
     "@siteimprove/alfa-chai": "^0.65.2",
     "@siteimprove/alfa-future": "^0.81.0",

custom-testing/interacting/test/interacting.spec.ts

@@ -5,6 +5,8 @@ import { Future } from "@siteimprove/alfa-future";
 import { Playwright } from "@siteimprove/alfa-playwright";
 
 import * as chai from "chai";
+import * as path from "node:path";
+import * as url from "node:url";
 import * as playwright from "playwright";
 
 import * as alfa from "@siteimprove/alfa-chai";
@@ -25,6 +27,10 @@ chai.use(
 
 const { expect } = chai;
 
+// TODO: This should be replaced with import.meta.dirname once we switch to Node 22
+const __filename = url.fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+
 describe("Interacting with a page", () => {
   let browser: playwright.Browser;
   let page: playwright.Page;
@@ -34,7 +40,9 @@ describe("Interacting with a page", () => {
     browser = await playwright.chromium.launch();
     page = await browser.newPage();
 
-    await page.goto(`file://${require.resolve("./fixtures/page.html")}`);
+    await page.goto(
+      url.pathToFileURL(path.join(__dirname, "fixtures", "page.html")).href
+    );
 
     document = await page.evaluateHandle(() => window.document);
   });

custom-testing/measuring-performances/package.json

@@ -5,6 +5,10 @@
   "scripts": {
     "test": "node performance.js"
   },
+  "type": "module",
+  "engines": {
+    "node": ">=20.0.0"
+  },
   "devDependencies": {
     "@siteimprove/alfa-act": "^0.81.0",
     "@siteimprove/alfa-aria": "^0.81.0",

custom-testing/measuring-performances/performance.ts

@@ -1,17 +1,22 @@
-import * as fs from "fs";
-import * as path from "path";
-import * as url from "url";
+import * as fs from "node:fs";
+import * as path from "node:path";
+import * as url from "node:url";
 
 import { Audit, Rule } from "@siteimprove/alfa-act";
 import * as aria from "@siteimprove/alfa-aria";
 import { Cascade } from "@siteimprove/alfa-cascade";
 import { Performance } from "@siteimprove/alfa-performance";
 import { Scraper } from "@siteimprove/alfa-scraper";
 
-import rules, { Flattened } from "@siteimprove/alfa-rules";
+import rules from "@siteimprove/alfa-rules";
+import type { Flattened } from "@siteimprove/alfa-rules";
 
 const { isMeasure } = Performance.Measure;
 
+// TODO: This should be replaced with import.meta.dirname once we switch to Node 22
+const __filename = url.fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+
 // We'll record the rules' performance in a duration object with this shape:
 interface Durations {
   common: { [key: string]: number };
@@ -96,7 +101,7 @@ Scraper.with(async (scraper) => {
 
     // The Performance object with its callback listener is passed to the Audit
     // evaluation.
-    await Audit.of(page, rules).evaluate(rulesPerformance);
+    await Audit.of(page, rules.default).evaluate(rulesPerformance);
 
     // Closing the total duration measurement.
     commonPerformance.measure("total", start);

custom-testing/navigating/package.json

@@ -5,6 +5,10 @@
   "scripts": {
     "test": "mocha --timeout 10000"
   },
+  "type": "module",
+  "engines": {
+    "node": ">=20.0.0"
+  },
   "devDependencies": {
     "@siteimprove/alfa-chai": "^0.65.2",
     "@siteimprove/alfa-future": "^0.81.0",

custom-testing/navigating/test/navigating.spec.ts

@@ -5,6 +5,8 @@ import { Future } from "@siteimprove/alfa-future";
 import { Playwright } from "@siteimprove/alfa-playwright";
 
 import * as chai from "chai";
+import * as path from "node:path";
+import * as url from "node:url";
 import * as playwright from "playwright";
 
 import * as alfa from "@siteimprove/alfa-chai";
@@ -24,6 +26,10 @@ chai.use(
 
 const { expect } = chai;
 
+// TODO: This should be replaced with import.meta.dirname once we switch to Node 22
+const __filename = url.fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+
 describe("Navigating between pages", () => {
   let browser: playwright.Browser;
   let page: playwright.Page;
@@ -33,7 +39,9 @@ describe("Navigating between pages", () => {
     browser = await playwright.chromium.launch();
     page = await browser.newPage();
 
-    await page.goto(`file://${require.resolve("./fixtures/page1.html")}`);
+    await page.goto(
+      url.pathToFileURL(path.join(__dirname, "fixtures", "page1.html")).href
+    );
 
     document = await page.evaluateHandle(() => window.document);
   });

custom-testing/scraping/package.json

@@ -2,6 +2,10 @@
   "$schema": "http://json.schemastore.org/package",
   "private": true,
   "name": "custom-testing-scraping",
+  "type": "module",
+  "engines": {
+    "node": ">=20.0.0"
+  },
   "scripts": {
     "test": "node scraping.js"
   },