Make PR filenames headings and label the file contents (#29)

SaschaCowley · web-flow · commit 2b9a3c55871e · 2025-08-09T20:35:43.000+10:00
- Makes the filenames in diff viewers level 2 headings.
- Moves the filename first, rather than after a bunch of controls for that file.
- Makes the file contents a region labelled by the filename. Useful when navigating by table rather than by heading.
diff --git a/GitHubA11yFixes.user.js b/GitHubA11yFixes.user.js
@@ -2,10 +2,10 @@
 // @name           GitHub Accessibility Fixes
 // @namespace      http://axSgrease.nvaccess.org/
 // @description    Improves the accessibility of GitHub.
-// @author         James Teh <jteh@mozilla.com>
-// @copyright 2019-2025 Mozilla Corporation, Derek Riemer
+// @author         James Teh <jteh@mozilla.com>, Sascha Cowley <sascha@nvaccess.org>
+// @copyright 2019-2025 Mozilla Corporation, Derek Riemer, Sascha Cowley
 // @license Mozilla Public License version 2.0
-// @version        2025.1
+// @version        2025.2
 // @include https://github.com/*
 // ==/UserScript==
 
@@ -168,6 +168,27 @@ const DYNAMIC_TWEAKS = [
 	// Remove headings from folder and file lists.
 	{selector: 'table[aria-labelledby=folders-and-files] :is(h2, h3)',
 		tweak: makePresentational},
+	// Make file viewer filenames headings, and the first item in the file viewer.
+	{selector: '.file-header .file-info .Truncate:has(.Link--primary)',
+		tweak: el => {
+			makeHeading(el, 2);
+			const headerRow = el.parentElement;
+			const children = Array.from(headerRow.children);
+			// Filename is the last child of .file-info, make it the first
+			children.unshift(children.pop());
+			if (headerRow) {
+				makeElementOwn(headerRow, children);
+			}
+		}},
+	// Label diffs and the like with their filename.
+	{selector: '.file',
+		tweak: el => {
+			const label = el.querySelector(".Link--primary");
+			const file = el.querySelector(".js-file-content");
+			if (label && file) {
+				makeRegion(file, label.textContent);
+			}
+		}},
 ];
 
 /*** Lights, camera, action! ***/
