shadow heading check

shadow-walk-ax.js

// start scriptwriter (see https://scriptwriter.dev)
function* walkAxTree(node, filter) {
	if (filter(node)) {
		yield node;
	}
	const children = node.children || [];
	for (const child of children) {
		yield* walkAxTree(child, filter);
	}
}
function validateHeadings(iterable) {
	const found = {
		h1: false,
		last: null,
	};
	for (const node of iterable) {
		const next = node.level;
		const { last, h1 } = found;
		if (last && next > last + 1) return [false, node];
		if (next === 1) {
			if (h1) return [false, node];
			found.h1 = true;
		}
		found.last = node.level;
	}
	return [true];
}
await page.goto('https://sumptuous-peppered-pocket.glitch.me/');
await page.click('button:nth-of-type(2)'); // 1 is no error, 2 skips, 3 repeats h1
var axTree = await page.accessibility.snapshot();
validateHeadings(walkAxTree(axTree, (n) => n.role === 'heading'));