feat: Phase 2+3 frontend coverage — responsive + accessibility tests + CI threshold
- Viewer accessibility: 5 tests (aria-labels, aria-expanded, label association, alert role) - Viewer responsive: 3 tests (chat-collapsed, CSS grid, now-playing aria-live) - Admin accessibility: 3 tests (nav aria-label, aria-current, focusability) - Admin responsive: 2 tests (tab visibility, essential tabs) - Coverage: vitest v8 provider, 40% stmt/lines, 30% branches/funcs - CI: test:coverage step between lint and build - Total: 44 frontend tests (31 + 13 new) - Updated TODO.md (Phase 2+3 done), DONE.md, MEMORY.md
This commit is contained in:
1 parent
9178b7b295
commit
d823763dc3
8 files changed
+168
-6
No files matched your search
@@ -271,3 +271,58 @@ file '/app/media/demo2.mp4'
|
||||
expect(list.innerHTML).toContain("demo1.mp4");
|
||||
});
|
||||
});
|
||||
|
||||
describe("admin accessibility", () => {
|
||||
beforeEach(() => {
|
||||
document.body.innerHTML = `
|
||||
<nav class="admin-nav" aria-label="Admin navigation">
|
||||
<button data-tab="dashboard" aria-current="page">Dashboard</button>
|
||||
<button data-tab="playlist">Playlist</button>
|
||||
<button data-tab="users">Users</button>
|
||||
<button data-tab="moderation">Moderation</button>
|
||||
</nav>
|
||||
<div id="tab-content"></div>
|
||||
`;
|
||||
});
|
||||
|
||||
it("nav has aria-label for screen readers", () => {
|
||||
const nav = document.querySelector(".admin-nav");
|
||||
expect(nav?.getAttribute("aria-label")).toBe("Admin navigation");
|
||||
});
|
||||
|
||||
it("active tab has aria-current attribute", () => {
|
||||
const active = document.querySelector("[aria-current]");
|
||||
expect(active).toBeTruthy();
|
||||
expect(active?.getAttribute("aria-current")).toBe("page");
|
||||
});
|
||||
|
||||
it("all nav buttons are focusable", () => {
|
||||
const buttons = document.querySelectorAll(".admin-nav button");
|
||||
buttons.forEach((btn) => {
|
||||
expect(btn.getAttribute("tabindex")).toBeNull();
|
||||
expect(btn.getAttribute("disabled")).toBeNull();
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
describe("admin responsive layout", () => {
|
||||
beforeEach(() => {
|
||||
document.body.innerHTML = `
|
||||
<nav class="admin-nav"><button data-tab="dashboard">Dashboard</button></nav>
|
||||
<div id="tab-content"><div id="overview-content">Overview data</div></div>
|
||||
`;
|
||||
});
|
||||
|
||||
it("tab content is present and visible", () => {
|
||||
const tabContent = document.getElementById("tab-content");
|
||||
expect(tabContent).toBeTruthy();
|
||||
const style = window.getComputedStyle(tabContent!);
|
||||
expect(style.display).not.toBe("none");
|
||||
});
|
||||
|
||||
it("admin nav contains essential tabs", () => {
|
||||
const buttons = document.querySelectorAll(".admin-nav button");
|
||||
const tabs = Array.from(buttons).map((b) => b.textContent?.trim());
|
||||
expect(tabs).toContain("Dashboard");
|
||||
});
|
||||
});
|
||||
Reference in new issue
Block a user