fix: correct sidebar element IDs, add missing CSS classes, and align test mocks
Three-part consistency defect identified in code review:
1. HTML: Four sidebar elements missing CSS class attributes so all CSS
rules targeting .session-sidebar, .sidebar-toggle-btn,
.sidebar-collapse-btn, and .sidebar-list applied to zero elements.
Added class= attributes to all four.
2. JS: initSidebar(), toggleSidebar(), and bindSidebarClickAway() called
$('sidebar') and $('collapse-btn') — neither ID exists in the DOM.
Corrected to $('session-sidebar') and $('sidebar-collapse-btn').
3. Tests: initSidebar/toggleSidebar mocks matched the wrong IDs, masking
the defect. Updated all six mock conditions to match corrected IDs.
4. Coverage gap: test_html_element_classes did not verify new sidebar
elements carry CSS classes. Added four entries for session-sidebar,
sidebar-toggle-btn, sidebar-collapse-btn, and sidebar-list — these
entries would have caught Defect 1 on Task 1's test run.
All 136 JS + 167 Python tests pass. Zero regressions.
This commit is contained in:
+4
-4
@@ -393,7 +393,7 @@ function initSidebar() {
|
||||
isOpen = window.innerWidth >= SIDEBAR_NARROW_THRESHOLD;
|
||||
}
|
||||
|
||||
const sidebar = $('sidebar');
|
||||
const sidebar = $('session-sidebar');
|
||||
if (sidebar) {
|
||||
if (isOpen) {
|
||||
sidebar.classList.remove('sidebar--collapsed');
|
||||
@@ -432,7 +432,7 @@ function toggleSidebar() {
|
||||
} catch (_) { /* blocked — ok */ }
|
||||
|
||||
// Apply class
|
||||
const sidebar = $('sidebar');
|
||||
const sidebar = $('session-sidebar');
|
||||
if (sidebar) {
|
||||
if (isOpen) {
|
||||
sidebar.classList.remove('sidebar--collapsed');
|
||||
@@ -442,7 +442,7 @@ function toggleSidebar() {
|
||||
}
|
||||
|
||||
// Update collapse button text (‹ when open, › when closed)
|
||||
const collapseBtn = $('collapse-btn');
|
||||
const collapseBtn = $('sidebar-collapse-btn');
|
||||
if (collapseBtn) {
|
||||
collapseBtn.textContent = isOpen ? '\u2039' : '\u203a';
|
||||
}
|
||||
@@ -461,7 +461,7 @@ function bindSidebarClickAway() {
|
||||
if (!container) return;
|
||||
container.addEventListener('click', () => {
|
||||
if (window.innerWidth >= SIDEBAR_NARROW_THRESHOLD) return;
|
||||
const sidebar = $('sidebar');
|
||||
const sidebar = $('session-sidebar');
|
||||
if (!sidebar) return;
|
||||
if (sidebar.classList.contains('sidebar--collapsed')) return;
|
||||
sidebar.classList.add('sidebar--collapsed');
|
||||
|
||||
Reference in New Issue
Block a user