fa/breadcrumb-the-shire
1
0
Fork 1
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

fix(error): harden logging, i18n, a11y and handler tests

Browse Source
This commit is contained in:
Felix Schneider
2026-03-24 22:00:14 +01:00
parent 44a357dfc4
commit a0d816caaa
10 changed files with 515 additions and 100 deletions
Download Patch File Download Diff File Expand all files Collapse all files

72
web/js/components/app-error-debug.js
View File

@@ -5,32 +5,74 @@ document.addEventListener('DOMContentLoaded', () => {
const tabs = document.querySelectorAll('.app-error-debug-tab');
const panels = document.querySelectorAll('.app-error-debug-panel');
const activateTab = (tab) => {
const target = tab.dataset.panel;
tabs.forEach(t => t.classList.remove('active'));
tabs.forEach(t => t.setAttribute('aria-selected', 'false'));
tabs.forEach(t => t.setAttribute('tabindex', '-1'));
panels.forEach(p => p.classList.remove('active'));
tab.classList.add('active');
tab.setAttribute('aria-selected', 'true');
tab.setAttribute('tabindex', '0');
const panel = document.getElementById(target);
if (panel) panel.classList.add('active');
};
tabs.forEach(tab => {
tab.addEventListener('click', () => {
const target = tab.dataset.panel;
tabs.forEach(t => t.classList.remove('active'));
panels.forEach(p => p.classList.remove('active'));
tab.classList.add('active');
const panel = document.getElementById(target);
if (panel) panel.classList.add('active');
activateTab(tab);
});
tab.addEventListener('keydown', (event) => {
if (tabs.length === 0) return;
const currentIndex = Array.prototype.indexOf.call(tabs, tab);
if (currentIndex < 0) return;
let nextIndex = currentIndex;
if (event.key === 'ArrowRight') {
nextIndex = (currentIndex + 1) % tabs.length;
} else if (event.key === 'ArrowLeft') {
nextIndex = (currentIndex - 1 + tabs.length) % tabs.length;
} else if (event.key === 'Home') {
nextIndex = 0;
} else if (event.key === 'End') {
nextIndex = tabs.length - 1;
} else {
return;
}
event.preventDefault();
const nextTab = tabs[nextIndex];
if (!nextTab) return;
activateTab(nextTab);
nextTab.focus();
});
});
// ── Frame expand/collapse ──────────────────────────
document.querySelectorAll('.app-error-debug-frame__header').forEach(header => {
header.addEventListener('click', () => {
header.closest('.app-error-debug-frame')?.classList.toggle('open');
document.querySelectorAll('.app-error-debug-frame__toggle').forEach(toggle => {
toggle.addEventListener('click', () => {
const frame = toggle.closest('.app-error-debug-frame');
if (!frame) return;
const isOpen = frame.classList.toggle('open');
toggle.setAttribute('aria-expanded', isOpen ? 'true' : 'false');
});
});
// Open the first frame by default.
const firstFrame = document.querySelector('.app-error-debug-frame');
if (firstFrame) firstFrame.classList.add('open');
// Ensure ARIA reflects initial state.
document.querySelectorAll('.app-error-debug-frame').forEach(frame => {
const toggle = frame.querySelector('.app-error-debug-frame__toggle');
if (!toggle) return;
toggle.setAttribute('aria-expanded', frame.classList.contains('open') ? 'true' : 'false');
});
// ── Query expand/collapse ──────────────────────────
document.querySelectorAll('.app-error-debug-query__header').forEach(header => {
header.addEventListener('click', () => {
header.closest('.app-error-debug-query')?.classList.toggle('open');
document.querySelectorAll('.app-error-debug-query__toggle').forEach(toggle => {
toggle.addEventListener('click', () => {
const query = toggle.closest('.app-error-debug-query');
if (!query) return;
const isOpen = query.classList.toggle('open');
toggle.setAttribute('aria-expanded', isOpen ? 'true' : 'false');
});
});