Compare commits

..

2 Commits

Author SHA1 Message Date
xRangerDE
63b04b6469 release: 4.6.107 storage stats table scope=col + aria-label
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-05-11 07:57:44 +02:00
xRangerDE
03b575cd1d a11y: scope=col + aria-label on storage stats table headers
The Storage card's per-streamer stats table was built without scope attributes on its <th> cells and the last column (the "Open" action column) had an empty header — screen readers couldn't tell which column a data cell belonged to once you tabbed into the rows, and the actions column had no announced name at all.

Fixes:
- All 6 column headers get scope="col" — explicit signal to screen readers that each <th> is a column header (the implicit <th>-inside-<thead> semantics work, but explicit scope is best practice for data tables and the de-facto standard for accessibility tooling validation)
- The empty actions header gets aria-label set from a new storageColumnActionsAria locale key (DE: "Aktionen", EN: "Actions") so screen readers announce "Aktionen, Spaltenkopf" for that column instead of skipping over an unnamed header.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-05-11 07:57:33 +02:00
5 changed files with 11 additions and 4 deletions

4
package-lock.json generated
View File

@ -1,12 +1,12 @@
{ {
"name": "twitch-vod-manager", "name": "twitch-vod-manager",
"version": "4.6.106", "version": "4.6.107",
"lockfileVersion": 3, "lockfileVersion": 3,
"requires": true, "requires": true,
"packages": { "packages": {
"": { "": {
"name": "twitch-vod-manager", "name": "twitch-vod-manager",
"version": "4.6.106", "version": "4.6.107",
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"axios": "^1.6.0", "axios": "^1.6.0",

View File

@ -1,6 +1,6 @@
{ {
"name": "twitch-vod-manager", "name": "twitch-vod-manager",
"version": "4.6.106", "version": "4.6.107",
"description": "Twitch VOD Manager - Download Twitch VODs easily", "description": "Twitch VOD Manager - Download Twitch VODs easily",
"main": "dist/main.js", "main": "dist/main.js",
"author": "xRangerDE", "author": "xRangerDE",

View File

@ -65,6 +65,7 @@ const UI_TEXT_DE = {
storageColumnTotal: 'Gesamt', storageColumnTotal: 'Gesamt',
storageColumnLive: 'Live', storageColumnLive: 'Live',
storageColumnChat: 'Chat', storageColumnChat: 'Chat',
storageColumnActionsAria: 'Aktionen',
storageOpen: 'Oeffnen', storageOpen: 'Oeffnen',
storageOtherFolders: 'Andere Ordner im Download-Pfad', storageOtherFolders: 'Andere Ordner im Download-Pfad',
cleanupTitle: 'Auto-Cleanup', cleanupTitle: 'Auto-Cleanup',

View File

@ -65,6 +65,7 @@ const UI_TEXT_EN = {
storageColumnTotal: 'Total', storageColumnTotal: 'Total',
storageColumnLive: 'Live', storageColumnLive: 'Live',
storageColumnChat: 'Chat', storageColumnChat: 'Chat',
storageColumnActionsAria: 'Actions',
storageOpen: 'Open', storageOpen: 'Open',
storageOtherFolders: 'Other folders in download path', storageOtherFolders: 'Other folders in download path',
cleanupTitle: 'Auto-cleanup', cleanupTitle: 'Auto-cleanup',

View File

@ -366,7 +366,12 @@ function renderStorageStats(stats: StorageStatsResult): void {
]; ];
for (const h of headers) { for (const h of headers) {
const th = document.createElement('th'); const th = document.createElement('th');
th.scope = 'col';
if (h) {
th.textContent = h; th.textContent = h;
} else {
th.setAttribute('aria-label', UI_TEXT.static.storageColumnActionsAria);
}
headRow.appendChild(th); headRow.appendChild(th);
} }
thead.appendChild(headRow); thead.appendChild(headRow);