Production visual QA: yieldomega.com (pre–smart-contract wiring) #147
Labels
No labels
agent:fix_bugfix
agent:fix_conflicts
agent:fix_security
agent:gap_analysis
agent:implement
agent:open_issues
agents
agent:security_audit
agent:verify
area
timecurve
arena
arena-v2
audit
block:feature_review
block:security
bug
contracts
design
devops
docs
documentation
enhancement
epic
feature
frontend
indexer
low priority
megaeth
operations
ops
performance
QA
qa checklist
referrals
removal
security
smart-contracts
tech-debt
testing
time-arena
timecurve
visual-qa
No milestone
No project
No assignees
1 participant
Notifications
Due date
No due date set.
Dependencies
No dependencies set
Reference
code/yieldomega#147
Loading…
Reference in a new issue
No description provided.
Delete branch "%!s()"
Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?
Scope
Environment: https://yieldomega.com — contracts/indexer may be absent or stubbed; this pass validates layout, hierarchy, chrome, responsive behavior, and obvious UI defects without requiring successful chain reads or txs.
Suggested devices / widths
Browsers: Latest Safari (iOS + macOS), Chrome/Android, Firefox desktop — at least one WebKit and one Chromium.
1. Responsive layout & breakpoints (mobile · tablet · desktop)
2. Visual hierarchy, typography & spacing
3. Navigation, chrome & overlays
4. Page inventory, states & “no chain yet” honesty
/timecurve, Arena, Protocol if routed): loading skeletons vs empty vs error states are visually distinct and copy is human-readable./referrals): forms and tables degrade cleanly without indexer data; no infinite spinners without explanation./vestingif reachable): hidden-from-nav behavior matches expectation when accessed via URL only; no broken shell.5. Motion, accessibility, performance & cross-browser quirks
prefers-reduced-motion: critical UI remains usable with reduced animation; no information conveyed only via motion.:focus-visiblerings visible on interactive elements (manual QA #97).-webkitquirks absent for core flex/grid (no clipped rounded corners, sticky jitter).Handoff
docs/testing/manual-qa-checklists.mdanddocs/qa/YO-TimeCurve-QA-Checklist.md.assigned to @nullvector_ux
marked the checklist item 5.12 — Console: note severity-sorted errors/warnings on cold load and after connect-wallet attempt (file GitLab issues with screenshots + route). as completed
marked the checklist item 5.12 — Console: note severity-sorted errors/warnings on cold load and after connect-wallet attempt (file GitLab issues with screenshots + route). as incomplete
marked the checklist item 1.1 — No horizontal scroll on primary marketing and app shells at each profile unless an intentional wide artifact
e\.g\. tableexists; if scroll appears, note exact route and repro width. as completedmarked the checklist item 1.1 — No horizontal scroll on primary marketing and app shells at each profile unless an intentional wide artifact
e\.g\. tableexists; if scroll appears, note exact route and repro width. as incompletemarked the checklist item 1.1 — No horizontal scroll on primary marketing and app shells at each profile unless an intentional wide artifact
e\.g\. tableexists; if scroll appears, note exact route and repro width. as completedmarked the checklist item 1.2 — Main content stays within safe areas
notch, home indicator, Dynamic Island; no critical CTAs clipped by OS chrome. as completedmarked the checklist item 1.3 — Touch targets on phone feel ≥ ~44×44 px equivalent; no overlapping hit boxes on stacked controls. as completed
marked the checklist item 1.5 — Desktop max-width containers center correctly; wide screens do not stretch body copy to unreadable line lengths. as completed
marked the checklist item 1.7 — Cards, panels, and grids maintain consistent gutters and alignment across breakpoints (edges line up to a clear grid). as completed
marked the checklist item 1.8 — Long URLs, addresses, and monospace strings wrap or truncate per design — no overflow pushing layout sideways. as completed
marked the checklist item 1.9 — Sticky or fixed regions
header, bottom barsdo not obscure the primary reading column when scrolling long pages. as completedmarked the checklist item 1.10 — Orientation change
tablet/phonereflows without requiring a full reload; no stuck half-width columns. as completedmarked the checklist item 1.6 — Images and illustrations scale without awkward cropping; SVGs/icons stay sharp; raster assets not visibly pixelated on retina. as completed
marked the checklist item 1.11 — Zoom to ~200%
browser / accessibility zoom: content remains usable without mandatory horizontal panning for core tasks. as completedmarked the checklist item 2.1 — Page title / hero headline is clearly dominant; supporting subcopy is visibly secondary (size, weight, color contrast). as completed
marked the checklist item 2.1 — Page title / hero headline is clearly dominant; supporting subcopy is visibly secondary (size, weight, color contrast). as incomplete
marked the checklist item 2.3 — Body text line-height and paragraph spacing support comfortable reading; no wall-of-text without breaks. as completed
marked the checklist item 2.2 — Section headings follow a predictable level order
h1 → h2 → h3; no skipped levels that confuse screen reader outline or visual scan. as completedmarked the checklist item 2.4 — Accent color use draws attention to primary actions and key metrics, not decorative noise. as completed
marked the checklist item 2.6 — Numerals and timers
if shownuse tabular or stable widths where digit flicker would otherwise jitter layout. as completedmarked the checklist item 2.8 — Lists, tables, and definition blocks align consistently; bullets and numbers do not collide with text wraps. as completed
marked the checklist item 2.9 — Hover vs default vs active states are distinguishable on desktop without relying on color alone. as completed
marked the checklist item 2.10 — Disabled controls look disabled but remain discoverable; placeholders do not mimic filled values. as completed
marked the checklist item 3.1 — Global nav links resolve correctly
no 404s on advertised routes; active route is visually indicated. as completedmarked the checklist item 3.4 — Footer links
docs, social, legalalign with design; footer does not collide with fixed bottom UI on small screens. as completedmarked the checklist item 3.2 — Mobile nav pattern
hamburger, drawer, bottom tabsopens/closes reliably; focus returns sensibly on close. as completedmarked the checklist item 3.3 — Logo / wordmark tap target adequate; home navigation works from nested routes. as completed
marked the checklist item 3.5 — Wallet connect entry points are visible and consistent across pages; disconnected state copy is honest when contracts are unavailable. as completed
marked the checklist item 3.7 — Dropdowns and popovers stay within viewport
flip upward when needed; submenus do not clip inside overflow:hidden parents incorrectly. as completedmarked the checklist item 3.10 — Scroll locking when overlays open works on iOS (no background scroll bleed-through). as completed
marked the checklist item 3.6 — Modal / drawer stacking: only one primary overlay z-order crisis; backdrop dims content; ESC / outside click behave per product expectation. as completed
marked the checklist item 3.8 — Toast / snack notifications do not cover critical CTAs without dismissal; animation duration feels polite, not distracting. as completed
marked the checklist item 3.9 — Audio / media dock
if present: does not overlap nav or primary CTAs on narrow breakpoints; play/pause affordance obvious (manual QA — mobile album dock #103 when audio ships). as completedmarked the checklist item 3.11 — Skip-to-content or landmark regions make sense for keyboard users landing on long pages. as completed
marked the checklist item 4.1 — Home / landing: hero, primary CTA, and trust signals render; no blank hero due to failed RPC (graceful fallback or static content). as completed
marked the checklist item 4.2 — TimeCurve surfaces
/timecurve, Arena, Protocol if routed: loading skeletons vs empty vs error states are visually distinct and copy is human-readable. as completedmarked the checklist item 4.3 — Referrals
/referrals: forms and tables degrade cleanly without indexer data; no infinite spinners without explanation. as completedmarked the checklist item 4.5 — Launch countdown or pre-sale pages: timer displays consistent formatting; if frozen at zero or placeholder, messaging explains “coming soon” vs bug. as completed
marked the checklist item 4.7 — Indexer / connectivity banners
if wired: readable placement, non-alarming palette, actionable retry where applicable (manual QA #96). as completedmarked the checklist item 4.7 — Indexer / connectivity banners
if wired: readable placement, non-alarming palette, actionable retry where applicable (manual QA #96). as incompletemarked the checklist item 4.6 — Under-construction or feature gates use branded styling, not raw error dumps or stack traces. as completed
marked the checklist item 4.7 — Indexer / connectivity banners
if wired: readable placement, non-alarming palette, actionable retry where applicable (manual QA #96). as completedmarked the checklist item 4.7 — Indexer / connectivity banners
if wired: readable placement, non-alarming palette, actionable retry where applicable (manual QA #96). as incompletemarked the checklist item 4.7 — Indexer / connectivity banners
if wired: readable placement, non-alarming palette, actionable retry where applicable (manual QA #96). as completedmarked the checklist item 4.10 — Charts or stats blocks show explicit “no data” states rather than empty axes that look broken. as completed
marked the checklist item 4.11 — 404 / global error pages match brand; offer recovery paths (home, support). as completed
marked the checklist item 4.11 — 404 / global error pages match brand; offer recovery paths (home, support). as incomplete
marked the checklist item 4.12 — Favicon, title tags, and social preview meta behave sanely on key routes (spot-check with messaging shares). as completed
marked the checklist item 5.1 — prefers-reduced-motion: critical UI remains usable with reduced animation; no information conveyed only via motion. as completed
marked the checklist item 5.2 — Keyboard Tab order follows visual order; :focus-visible rings visible on interactive elements (manual QA #97). as completed
marked the checklist item 5.3 — Focus not trapped in unintentional loops; modals trap focus only while open and restore on close. as completed
marked the checklist item 5.4 — Color is not the sole indicator for errors/links/active states (icons, text, or patterns reinforce meaning). as completed
marked the checklist item 5.6 — Auto-playing media respects mute/unmute expectations and mobile autoplay policies; no surprise loud audio. as completed
marked the checklist item 5.7 — Initial paint: no severe layout shift
CLSon hero/fonts/images — note Largest Contentful Paint offenders if any. as completedmarked the checklist item 5.8 — Repeated navigations do not leak memory visibly
fan spin / tab freeze after several route changes— light subjective pass. as completedmarked the checklist item 5.10 — Firefox: wallet modal and custom scroll areas behave same as Chromium for core flows. as completed
mentioned in issue #164
@nullvector_ux Great - for skips please leave skip & reason as comment here and tag me. For fails, leave fail & issue number here & tag me
@PlasticDigits
1.4 skip, because I don't have tablet
2.11 skip because nothing shown yet
2.12 skip because there is no Dark/light theme
4.9 skip because I can not confirm it yet
5.5 skip because can not confirm yet because there is no text bar at the moment
5.9 skip because I don't have safari to test with
@nullvector_ux Once you have the local stack up from #162 you will be able to verify 2.11, 2.12, 4.9, 5.5.
marked the checklist item 4.9 — Buy / swap panels show coherent disabled reasons when wallet disconnected vs wrong network vs backend unavailable — not identical vague errors. as completed
mentioned in issue #196
walked the 15 unchecked items on production (
yieldomega.com) in fresh incognito Chrome, Acer Predator laptop, DevTools responsive mode for the tablet/mobile profiles. nvlx is out — picking up his queue per dev request to push YO toward close.§1 Responsive layout & breakpoints
/timecurve,/sir,/rabbit-treasury. Header nav stays single-row, split columns (venue art + venue-snapshot card on /sir) reflow without orphaned headings, multi-card sections collapse to 1-col or 2-col as expected, no giant empty gutters./timecurve,/rabbit-treasury,/collection. No focus trap, no clipped CTAs.§2 Visual hierarchy, typography & spacing
Time left + buy CHARM,WarBow PvP, podiums, battle feed,Raw onchain reads + fee routing) is visibly tertiary (smaller, lower contrast). No element competes inappropriately with the intended user journey.aria-label="Background music". Decorative panel cutouts (e.g.bunny-podium-win.png) usealt=""+aria-hidden="true"— correct decorative-image pattern. Icon paired with text everywhere meaning is non-obvious (trophy icons next to placement copy, network chip with MEGAETH label, etc).ui-badge ui-badge--{variant}modifier pattern (e.g.ui-badge--warningfor live-state pills). LOADING, COMING SOON, IN QUEUE, EXTERNAL VENUE, READ-ONLY FRAMING, LIVE TICKER, INDEXER-BACKED SNAPSHOT all share consistent pill shape + placement language. Full error/success/info-state coverage gated behind active-sale + wallet flows (re-walk once those surfaces are reachable).§3 Navigation, chrome & overlays
Not Foundserver text; only in-app navigation works. Same root cause as 4.4 and 4.11 below.§4 Page inventory, states & "no chain yet" honesty
/vestingdirect URL hit returns raw server 404 instead of branded hidden-from-nav behaviour./sir,/kumbaya) showSet VITE_SIR_DEX_URL/Set VITE_KUMBAYA_DEX_URLbuild-time stubs. Fee sinks panel showsSet VITE_FEE_ROUTER_ADDRESSstub. NETWORK MEGAETH chip is a status indicator only (tooltip "Connected network"), not a link. Re-walk once these env vars are populated.Not Foundtext, no branded 404 / recovery paths.§5 Motion, accessibility, performance & cross-browser quirks
/,/timecurve,/rabbit-treasury,/collection,/referrals,/kumbaya,/sir./referrals"Claim a code" section is descriptive text, no input field untilVITE_REFERRAL_REGISTRY_ADDRESSis wired and sale is active. Re-walk once buy / claim / steal forms surface.AudioContext was not allowed to start. It must be resumed (or created) after a user gesture on the page— Chrome autoplay policy on album dock pre-load, not a site bug).window.ethereumrace vs Backpack / OKX / Phantom etc — not site bugs). Site-emitted findings filtered out:GET /favicon.ico 404(missing from production deploy — minor, separate ticket if desired), and a HEAD probe to/referralsreturning 404 (secondary evidence of the #196 SPA-fallback bug).Bonus reconfirms from this walk
/timecurve,/rabbit-treasury,/collection,/referrals,/kumbaya,/sir. All reflow without stuck half-width columns or full reloads./timecurve,/rabbit-treasury,/collection,/referrals,/kumbaya,/sir) resolve via in-app click, active route visually indicated (yellow highlight on the current pill).Status summary
Minor finding worth noting (not blocking):
favicon.icoreturns 404 from production — easy add to the deploy.All 15 previously-unchecked items now resolved. Once #196 ships, 3.12 / 4.4 / 4.11 re-verify together on the same fix. Ready for close on your side once #196 lands and you're good with the N/A calls @PlasticDigits.
marked the checklist item 1.4 — Tablet layout uses width sensibly
no giant empty gutters or tiny centered column unless deliberate; split columns reflow without orphaned headings. as completedmarked the checklist item 1.12 — Keyboard open on mobile
search fields, connect flowsdoes not permanently hide primary CTAs or trap focus off-screen. as completedmarked the checklist item 2.1 — Page title / hero headline is clearly dominant; supporting subcopy is visibly secondary (size, weight, color contrast). as completed
marked the checklist item 2.5 — Muted / secondary text remains legible against backgrounds (WCAG contrast sanity — especially grey-on-grey). as completed
marked the checklist item 2.7 — Icons pair with text labels where meaning is non-obvious; standalone icons have accessible names in devtools. as completed
marked the checklist item 2.11 — Error, warning, success, and info banners share a coherent visual language (color + icon + placement). as completed
marked the checklist item 5.11 — Private / strict mode: site loads without hard dependency on third-party cookies where avoidable. as completed
marked the checklist item 5.12 — Console: note severity-sorted errors/warnings on cold load and after connect-wallet attempt (file GitLab issues with screenshots + route). as completed
marked the checklist item 5.5 — Form inputs expose labels and validation messages programmatically associated with fields. as completed
marked the checklist item 4.8 — Explorer links open correct base URL for the marketed network; truncated addresses remain decipherable on mobile (manual QA #93, #98). as completed
marked the checklist item 4.8 — Explorer links open correct base URL for the marketed network; truncated addresses remain decipherable on mobile (manual QA #93, #98). as incomplete
marked the checklist item 4.11 — 404 / global error pages match brand; offer recovery paths (home, support). as completed
marked the checklist item 3.12 — Deep links
share URLsland with nav context intact — user understands where they are. as completedmarked the checklist item 4.11 — 404 / global error pages match brand; offer recovery paths (home, support). as incomplete
marked the checklist item 2.12 — Dark/light theme
if applicablekeeps hierarchy equivalent in both modes — no invisible borders or vanished dividers. as completedmarked the checklist item 3.12 — Deep links
share URLsland with nav context intact — user understands where they are. as incompletemarked the checklist item 4.11 — 404 / global error pages match brand; offer recovery paths (home, support). as completed
marked the checklist item 3.12 — Deep links
share URLsland with nav context intact — user understands where they are. as completedmarked the checklist item 4.4 — Vesting
/vesting if reachable: hidden-from-nav behavior matches expectation when accessed via URL only; no broken shell. as completedmarked the checklist item 4.8 — Explorer links open correct base URL for the marketed network; truncated addresses remain decipherable on mobile (manual QA #93, #98). as completed
5.9 skip, no macOS device on my side. Tagging for totdking's Mac walk when convenient. @PlasticDigits
marked the checklist item 5.9 — Safari: -webkit quirks absent for core flex/grid (no clipped rounded corners, sticky jitter). as completed
mentioned in issue #197