Remove dead frontend modules; add tests, a11y, and ESLint fixes #321

Closed
opened 2026-06-13 07:34:28 +00:00 by PlasticDigits · 10 comments
PlasticDigits commented 2026-06-13 07:34:28 +00:00 (Migrated from gitlab.com)

Parent

Gap analysis follow-up from #309.

Current codebase

Dead/orphan (zero imports):

  • frontend/src/pages/arena/TimerHeroLiveBuys.tsx
  • frontend/src/pages/arena/ArenaBuyModals.tsx
  • frontend/e2e/arena-live-buys-modals.spec.ts (ignored in playwright.config.ts)

Untested major modules (~1600+ LOC):

  • ArenaSimplePage.tsx, ArenaWarbowHeroPanel.tsx, ArenaCharmCredCard.tsx
  • useArenaSaleSession.ts, WalletProfileModal.tsx (sections tested only)

ESLint: 21 warnings — react-refresh/only-export-components in arena helpers; react-hooks/exhaustive-deps in useArenaSaleSession.ts L1245, L1605.

A11y gaps: WarBow listbox without roving tabindex/arrow keys; buy CTA lacks context aria-label; modal focus-trap untested.

Why needed

Approved: Remove (not archive) dead modules; add tests for major components; fix accessibility and ESLint warnings.

Constraints / guardrails

  • Remove orphan files — do not archive per approval.
  • Live buys live on AUDIT only (ArenaLiveBuysActivitySection on ArenaProtocolPage).
  • Match existing test patterns (ArenaTimerPodiumCarousel.test.tsx, WalletProfileModalSections.test.tsx).
  • Indexer-first display (#301) in new tests.

Relevant files

  • Orphan modules listed above
  • frontend/src/pages/arena/ArenaWarbowHeroPanel.tsx
  • frontend/src/pages/arena/useArenaSaleSession.ts
  • frontend/playwright.config.ts
  • docs/testing/frontend-content-audit.md
  1. Delete TimerHeroLiveBuys.tsx, ArenaBuyModals.tsx, arena-live-buys-modals.spec.ts; remove testIgnore if spec deleted.
  2. Add RTL tests for ArenaWarbowHeroPanel, ArenaCharmCredCard; smoke tests for ArenaSimplePage key regions; hook tests for useArenaSaleSession submit paths.
  3. WarBow listbox: roving tabindex + arrow keys (mirror token dropdown in ArenaSimplePage).
  4. Fix ESLint warnings in touched files.

Acceptance criteria

  • Orphan modules and spec removed from repo.
  • New tests for listed major components (minimum happy-path + one error path each).
  • WarBow target list keyboard-accessible.
  • npm run lint zero warnings in src/pages/arena/ (or repo-wide if scoped).

Test plan

  • cd frontend && npm run typecheck && npm run lint && npm test.
  • Optional: bash scripts/e2e-anvil.sh after Playwright config change.

Attack / abuse test plan

  • Profile modal: Escape/close returns focus; no XSS via address display.

Verification criteria

  • rg TimerHeroLiveBuys / ArenaBuyModals returns no imports.
  • Test count increases for listed files in npm test output.
## Parent Gap analysis follow-up from [#309](https://gitlab.com/PlasticDigits/yieldomega/-/issues/309). ## Current codebase **Dead/orphan (zero imports):** - `frontend/src/pages/arena/TimerHeroLiveBuys.tsx` - `frontend/src/pages/arena/ArenaBuyModals.tsx` - `frontend/e2e/arena-live-buys-modals.spec.ts` (ignored in `playwright.config.ts`) **Untested major modules (~1600+ LOC):** - `ArenaSimplePage.tsx`, `ArenaWarbowHeroPanel.tsx`, `ArenaCharmCredCard.tsx` - `useArenaSaleSession.ts`, `WalletProfileModal.tsx` (sections tested only) **ESLint:** 21 warnings — `react-refresh/only-export-components` in arena helpers; `react-hooks/exhaustive-deps` in `useArenaSaleSession.ts` L1245, L1605. **A11y gaps:** WarBow `listbox` without roving tabindex/arrow keys; buy CTA lacks context `aria-label`; modal focus-trap untested. ## Why needed Approved: Remove (not archive) dead modules; add tests for major components; fix accessibility and ESLint warnings. ## Constraints / guardrails - **Remove** orphan files — do not archive per approval. - Live buys live on AUDIT only (`ArenaLiveBuysActivitySection` on `ArenaProtocolPage`). - Match existing test patterns (`ArenaTimerPodiumCarousel.test.tsx`, `WalletProfileModalSections.test.tsx`). - Indexer-first display (#301) in new tests. ## Relevant files - Orphan modules listed above - `frontend/src/pages/arena/ArenaWarbowHeroPanel.tsx` - `frontend/src/pages/arena/useArenaSaleSession.ts` - `frontend/playwright.config.ts` - `docs/testing/frontend-content-audit.md` ## Recommended direction 1. Delete `TimerHeroLiveBuys.tsx`, `ArenaBuyModals.tsx`, `arena-live-buys-modals.spec.ts`; remove `testIgnore` if spec deleted. 2. Add RTL tests for `ArenaWarbowHeroPanel`, `ArenaCharmCredCard`; smoke tests for `ArenaSimplePage` key regions; hook tests for `useArenaSaleSession` submit paths. 3. WarBow listbox: roving tabindex + arrow keys (mirror token dropdown in `ArenaSimplePage`). 4. Fix ESLint warnings in touched files. ## Acceptance criteria - [ ] Orphan modules and spec removed from repo. - [ ] New tests for listed major components (minimum happy-path + one error path each). - [ ] WarBow target list keyboard-accessible. - [ ] `npm run lint` zero warnings in `src/pages/arena/` (or repo-wide if scoped). ## Test plan - `cd frontend && npm run typecheck && npm run lint && npm test`. - Optional: `bash scripts/e2e-anvil.sh` after Playwright config change. ## Attack / abuse test plan - Profile modal: Escape/close returns focus; no XSS via address display. ## Verification criteria - `rg TimerHeroLiveBuys` / `ArenaBuyModals` returns no imports. - Test count increases for listed files in `npm test` output.
PlasticDigits commented 2026-06-13 07:34:43 +00:00 (Migrated from gitlab.com)

mentioned in issue #309

mentioned in issue #309
PlasticDigits commented 2026-06-13 12:55:54 +00:00 (Migrated from gitlab.com)

mentioned in commit 765cffbaf5

mentioned in commit 765cffbaf5e056e35fe280bcd70727929c5ec3fa
PlasticDigits commented 2026-06-13 12:56:15 +00:00 (Migrated from gitlab.com)

mentioned in merge request !468

mentioned in merge request !468
PlasticDigits commented 2026-06-14 02:33:45 +00:00 (Migrated from gitlab.com)

mentioned in commit 85d54aa36d

mentioned in commit 85d54aa36dfda4c99b3280c1cc4bed97940d69c8
PlasticDigits commented 2026-06-14 02:47:06 +00:00 (Migrated from gitlab.com)

mentioned in commit dfbf2af670

mentioned in commit dfbf2af67046b356cc5f19ae130410f026809ac1
PlasticDigits commented 2026-06-14 02:47:15 +00:00 (Migrated from gitlab.com)

mentioned in merge request !477

mentioned in merge request !477
PlasticDigits commented 2026-06-14 03:00:02 +00:00 (Migrated from gitlab.com)

mentioned in commit 0cf96cad88

mentioned in commit 0cf96cad8875bf120b8f199cd6071dd46e921891
PlasticDigits commented 2026-06-14 05:06:56 +00:00 (Migrated from gitlab.com)

mentioned in commit 551cdb0681

mentioned in commit 551cdb06816cdd0e247d6bf8060cb611527e8187
PlasticDigits commented 2026-06-14 05:36:08 +00:00 (Migrated from gitlab.com)

Verification — issue #321 (FAIL — not ready to close)

Verified on main (2026-06-14). No implementation branch or commits referencing #321 were found.

Acceptance criteria

Criterion Result How verified
Orphan modules and spec removed FAIL frontend/src/pages/arena/TimerHeroLiveBuys.tsx, ArenaBuyModals.tsx, and frontend/e2e/arena-live-buys-modals.spec.ts still present. playwright.config.ts still has testIgnore: /arena-live-buys-modals\.spec\.ts/. Zero imports in frontend/src (rg finds only the module definitions), but files were not deleted per approval.
New tests for major components (happy + error path) FAIL No ArenaWarbowHeroPanel.test.*, ArenaCharmCredCard.test.*, ArenaSimplePage.test.*, or useArenaSaleSession.test.*. npm test: 116 files / 632 tests — none target the listed untested modules.
WarBow target list keyboard-accessible FAIL ArenaWarbowHeroPanel.tsx L205–241: role="listbox" / role="option" buttons with click only — no roving tabIndex, no ArrowUp/ArrowDown handlers. Contrast: token dropdown in ArenaSimplePage.tsx L218–255 has listbox keyboard nav. Buy CTA (arena-simple-buy-charm) has no context aria-label (only visible text "Buy").
npm run lint zero warnings in src/pages/arena/ FAIL npx eslint src/pages/arena/: 19 warnings (18× react-refresh/only-export-components, 2× react-hooks/exhaustive-deps in useArenaSaleSession.ts). Repo-wide npm run lint: 21 warnings.
npm run typecheck PASS cd frontend && npm run typecheck — exit 0.
npm test PASS cd frontend && npm test — 116 files, 632 tests, all passed.
rg TimerHeroLiveBuys / ArenaBuyModals no imports PASS (partial) No import sites under frontend/src; files themselves still exist (see first row).
Test count increased for listed files FAIL Baseline unchanged — no new test files for listed modules.

Attack / abuse test plan

Item Result How verified
Profile modal: Escape/close returns focus FAIL WalletProfileModalSections.test.tsx covers section rendering only; no focus-trap or return-focus tests. rg for focus-trap/Escape under WalletProfile* — no matches.
No XSS via address display SKIP No new address-display hardening tests added; existing section tests use static mock addresses only.

Optional test plan

Item Result Notes
bash scripts/e2e-anvil.sh SKIP Not run — Playwright config unchanged (ignored spec still present); scope is frontend unit/lint/a11y per issue body.

Follow-ups

  1. Implement per issue body: delete orphan files + art README reference (frontend/public/art/README.md L49), add RTL/hook tests, WarBow listbox keyboard nav (mirror ArenaSimplePage token dropdown), buy CTA aria-label, ESLint fixes in touched arena files.
  2. Add WalletProfileModal focus-trap / Escape-return-focus tests when modal shell is in scope.
  3. Re-label agent:implement and re-run verify after MR lands.

Issue left open — acceptance criteria not met.

## Verification — issue #321 (FAIL — not ready to close) Verified on `main` (2026-06-14). No implementation branch or commits referencing #321 were found. ### Acceptance criteria | Criterion | Result | How verified | |-----------|--------|--------------| | Orphan modules and spec removed | **FAIL** | `frontend/src/pages/arena/TimerHeroLiveBuys.tsx`, `ArenaBuyModals.tsx`, and `frontend/e2e/arena-live-buys-modals.spec.ts` still present. `playwright.config.ts` still has `testIgnore: /arena-live-buys-modals\.spec\.ts/`. Zero *imports* in `frontend/src` (`rg` finds only the module definitions), but files were not deleted per approval. | | New tests for major components (happy + error path) | **FAIL** | No `ArenaWarbowHeroPanel.test.*`, `ArenaCharmCredCard.test.*`, `ArenaSimplePage.test.*`, or `useArenaSaleSession.test.*`. `npm test`: **116 files / 632 tests** — none target the listed untested modules. | | WarBow target list keyboard-accessible | **FAIL** | `ArenaWarbowHeroPanel.tsx` L205–241: `role="listbox"` / `role="option"` buttons with click only — no roving `tabIndex`, no `ArrowUp`/`ArrowDown` handlers. Contrast: token dropdown in `ArenaSimplePage.tsx` L218–255 has listbox keyboard nav. Buy CTA (`arena-simple-buy-charm`) has no context `aria-label` (only visible text "Buy"). | | `npm run lint` zero warnings in `src/pages/arena/` | **FAIL** | `npx eslint src/pages/arena/`: **19 warnings** (18× `react-refresh/only-export-components`, 2× `react-hooks/exhaustive-deps` in `useArenaSaleSession.ts`). Repo-wide `npm run lint`: **21 warnings**. | | `npm run typecheck` | **PASS** | `cd frontend && npm run typecheck` — exit 0. | | `npm test` | **PASS** | `cd frontend && npm test` — 116 files, 632 tests, all passed. | | `rg TimerHeroLiveBuys` / `ArenaBuyModals` no imports | **PASS** (partial) | No import sites under `frontend/src`; files themselves still exist (see first row). | | Test count increased for listed files | **FAIL** | Baseline unchanged — no new test files for listed modules. | ### Attack / abuse test plan | Item | Result | How verified | |------|--------|--------------| | Profile modal: Escape/close returns focus | **FAIL** | `WalletProfileModalSections.test.tsx` covers section rendering only; no focus-trap or return-focus tests. `rg` for `focus-trap`/`Escape` under `WalletProfile*` — no matches. | | No XSS via address display | **SKIP** | No new address-display hardening tests added; existing section tests use static mock addresses only. | ### Optional test plan | Item | Result | Notes | |------|--------|-------| | `bash scripts/e2e-anvil.sh` | **SKIP** | Not run — Playwright config unchanged (ignored spec still present); scope is frontend unit/lint/a11y per issue body. | ### Follow-ups 1. Implement per issue body: delete orphan files + art README reference (`frontend/public/art/README.md` L49), add RTL/hook tests, WarBow listbox keyboard nav (mirror `ArenaSimplePage` token dropdown), buy CTA `aria-label`, ESLint fixes in touched arena files. 2. Add `WalletProfileModal` focus-trap / Escape-return-focus tests when modal shell is in scope. 3. Re-label `agent:implement` and re-run verify after MR lands. **Issue left open** — acceptance criteria not met.
PlasticDigits commented 2026-06-14 12:01:10 +00:00 (Migrated from gitlab.com)

Implementation verify — issue #321 (PASS — ready to close)

Verified on main at 551cdb06 (merged MR !477). All acceptance criteria are satisfied; no additional code changes required in this session.

Acceptance criteria

Criterion Result How verified
Orphan modules and spec removed PASS TimerHeroLiveBuys.tsx, ArenaBuyModals.tsx, and e2e/arena-live-buys-modals.spec.ts absent. playwright.config.ts has no testIgnore for deleted spec. frontend/public/art/README.md updated.
New tests for major components (happy + error path) PASS ArenaWarbowHeroPanel.test.tsx (3), ArenaCharmCredCard.test.tsx (5), ArenaSimplePage.test.tsx (5), useArenaSaleSession.test.ts (3), warbowTargetListKeyboard.test.ts (4), arenaSaleSessionBuyPreflight.test.ts, WalletProfileModal.test.tsx (4).
WarBow target list keyboard-accessible PASS ArenaWarbowHeroPanel.tsx: role="listbox" / role="option", roving tabIndex, onKeyDown + moveWarbowTargetListIndex (ArrowUp/Down/Home/End wrap). Buy CTA: contextual aria-label on arena-simple-buy-charm (ArenaSimplePage.tsx L798–807).
npm run lint zero warnings in src/pages/arena/ PASS npx eslint src/pages/arena/ — exit 0, zero warnings. Repo-wide npm run lint: 2 warnings outside arena (IndexerConnectivityContext, LatestBlockContext — pre-existing, out of #321 scope).
npm run typecheck PASS cd frontend && npm run typecheck — exit 0.
npm test PASS cd frontend && npm test — 125 files / 672 tests, all passed (up from baseline 116 / 632).
rg TimerHeroLiveBuys / ArenaBuyModals no imports PASS rg under frontend/src — no matches.
Test count increased for listed files PASS New test files listed above run in npm test output.

Attack / abuse test plan

Item Result How verified
Profile modal: Escape/close returns focus PASS WalletProfileModal.tsx stores returnFocusRef and restores on close; WalletProfileModal.test.tsx asserts returnFocusRef.current?.focus?.() wiring.
No XSS via address display PASS WalletProfileModal.test.tsx escapes malicious address in explorer href; AddressInline test rejects <script> injection.

Optional test plan

Item Result Notes
bash scripts/e2e-anvil.sh SKIP Playwright config unchanged in this verify pass; unit/lint/a11y scope satisfied per issue body.

Documentation

  • docs/testing/frontend-content-audit.md cross-links #321 unit tests and WalletProfileModal.test.tsx.
  • frontend/public/art/README.md notes TimerHeroLiveBuys consumer removal.

Third-party verification checklist

cd frontend && npm run typecheck && npm run lint && npm test
npx eslint src/pages/arena/
test ! -f src/pages/arena/TimerHeroLiveBuys.tsx
test ! -f src/pages/arena/ArenaBuyModals.tsx
test ! -f e2e/arena-live-buys-modals.spec.ts
rg "TimerHeroLiveBuys|ArenaBuyModals" src/   # expect no matches

Closing — implementation landed via MR !477; all criteria pass.

## Implementation verify — issue #321 (PASS — ready to close) Verified on `main` at `551cdb06` (merged MR !477). All acceptance criteria are satisfied; no additional code changes required in this session. ### Acceptance criteria | Criterion | Result | How verified | |-----------|--------|--------------| | Orphan modules and spec removed | **PASS** | `TimerHeroLiveBuys.tsx`, `ArenaBuyModals.tsx`, and `e2e/arena-live-buys-modals.spec.ts` absent. `playwright.config.ts` has no `testIgnore` for deleted spec. `frontend/public/art/README.md` updated. | | New tests for major components (happy + error path) | **PASS** | `ArenaWarbowHeroPanel.test.tsx` (3), `ArenaCharmCredCard.test.tsx` (5), `ArenaSimplePage.test.tsx` (5), `useArenaSaleSession.test.ts` (3), `warbowTargetListKeyboard.test.ts` (4), `arenaSaleSessionBuyPreflight.test.ts`, `WalletProfileModal.test.tsx` (4). | | WarBow target list keyboard-accessible | **PASS** | `ArenaWarbowHeroPanel.tsx`: `role="listbox"` / `role="option"`, roving `tabIndex`, `onKeyDown` + `moveWarbowTargetListIndex` (ArrowUp/Down/Home/End wrap). Buy CTA: contextual `aria-label` on `arena-simple-buy-charm` (`ArenaSimplePage.tsx` L798–807). | | `npm run lint` zero warnings in `src/pages/arena/` | **PASS** | `npx eslint src/pages/arena/` — exit 0, zero warnings. Repo-wide `npm run lint`: 2 warnings outside arena (`IndexerConnectivityContext`, `LatestBlockContext` — pre-existing, out of #321 scope). | | `npm run typecheck` | **PASS** | `cd frontend && npm run typecheck` — exit 0. | | `npm test` | **PASS** | `cd frontend && npm test` — **125 files / 672 tests**, all passed (up from baseline 116 / 632). | | `rg TimerHeroLiveBuys` / `ArenaBuyModals` no imports | **PASS** | `rg` under `frontend/src` — no matches. | | Test count increased for listed files | **PASS** | New test files listed above run in `npm test` output. | ### Attack / abuse test plan | Item | Result | How verified | |------|--------|--------------| | Profile modal: Escape/close returns focus | **PASS** | `WalletProfileModal.tsx` stores `returnFocusRef` and restores on close; `WalletProfileModal.test.tsx` asserts `returnFocusRef.current?.focus?.()` wiring. | | No XSS via address display | **PASS** | `WalletProfileModal.test.tsx` escapes malicious address in explorer `href`; `AddressInline` test rejects `<script>` injection. | ### Optional test plan | Item | Result | Notes | |------|--------|-------| | `bash scripts/e2e-anvil.sh` | **SKIP** | Playwright config unchanged in this verify pass; unit/lint/a11y scope satisfied per issue body. | ### Documentation - `docs/testing/frontend-content-audit.md` cross-links #321 unit tests and `WalletProfileModal.test.tsx`. - `frontend/public/art/README.md` notes `TimerHeroLiveBuys` consumer removal. ### Third-party verification checklist ```bash cd frontend && npm run typecheck && npm run lint && npm test npx eslint src/pages/arena/ test ! -f src/pages/arena/TimerHeroLiveBuys.tsx test ! -f src/pages/arena/ArenaBuyModals.tsx test ! -f e2e/arena-live-buys-modals.spec.ts rg "TimerHeroLiveBuys|ArenaBuyModals" src/ # expect no matches ``` Closing — implementation landed via MR !477; all criteria pass.
PlasticDigits (Migrated from gitlab.com) closed this issue 2026-06-14 12:01:16 +00:00
Sign in to join this conversation.
No milestone
No project
No assignees
1 participant
Notifications
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set

Reference
code/yieldomega#321
No description provided.