Skip to content

fix(e2e): mobile viewport toolbar and test coverage (Plan 201)#846

Merged
d-oit merged 4 commits into
mainfrom
fix/e2e-mobile-ci-failure-2026-07-24
Jul 24, 2026
Merged

fix(e2e): mobile viewport toolbar and test coverage (Plan 201)#846
d-oit merged 4 commits into
mainfrom
fix/e2e-mobile-ci-failure-2026-07-24

Conversation

@d-oit

@d-oit d-oit commented Jul 24, 2026

Copy link
Copy Markdown
Owner

Summary

  • Fix 20 failing mobile E2E tests by adding clickToolbarButton() helper that handles the container-query responsive toolbar overflow menu on mobile viewports
  • Add suppressWorkboxErrors() helper to filter non-fatal workbox SW registration PAGE ERRORs
  • Add 28 unit tests for zero-coverage modules: NotificationBadge, NotificationPanel, MyLibraryPage, SettingsPage
  • Update LEARNINGS.md with mobile E2E and workbox SW patterns

Changes

E2E Fix (Closes #845)

  • apps/tests/fixtures.ts — Added clickToolbarButton() and suppressWorkboxErrors() helpers
  • Updated 5 E2E test files to use the mobile-aware toolbar helper:
    • edge-cases.spec.ts — Settings button
    • accessibility-audit.spec.ts — Settings button (2 tests)
    • in-book-search.spec.ts — Search button (3 tests)
    • login-and-book-load.spec.ts — Settings button
    • reader-annotations-and-admin.spec.ts — Comment, Bookmarks, Export Notes buttons

Test Coverage (P2)

  • notification-badge.test.tsx — 7 tests (render, fetch, click, error handling)
  • notification-panel.test.tsx — 7 tests (render, loading, empty, notifications, actions)
  • library-page.test.tsx — 6 tests (loading, error, empty, grouped books, links)
  • settings-page.test.tsx — 8 tests (render, themes, fonts, locale, storage, aria-pressed)

Root Cause

The reader toolbar uses container queries (cq-reader-toolbar-actions / cq-reader-toolbar-overflow) to switch between desktop (direct icon buttons) and mobile (overflow "More Options" menu) layouts. E2E tests on mobile viewports (iphone/pixel) were trying to click desktop-style buttons that are hidden on mobile.

Verification

  • pnpm lint — PASS
  • pnpm typecheck — PASS (7/7)
  • 28 new unit tests — PASS
  • All E2E test changes use the mobile-aware helper pattern

Plan

See .mimocode/plans/1784877486740-shiny-moon.md for full GOAP plan.

@cloudflare-workers-and-pages

cloudflare-workers-and-pages Bot commented Jul 24, 2026

Copy link
Copy Markdown

Deploying do-epub-studio with  Cloudflare Pages  Cloudflare Pages

Latest commit: 4ec45c5
Status: ✅  Deploy successful!
Preview URL: https://825deca4.do-epub-studio.pages.dev
Branch Preview URL: https://fix-e2e-mobile-ci-failure-20.do-epub-studio.pages.dev

View logs

@github-actions

github-actions Bot commented Jul 24, 2026

Copy link
Copy Markdown

🚀 Performance Report

⚡ Startup & Interaction

Metric Value (ms) Limit (ms) Trend Status
First Contentful Paint 284.00 1500 -
Chapter Switch Latency 0.00 300 -
Offline Rehydrate Time 212.40 800 -
DOM Interactive 40.40 - - -
Load Event End 200.90 - - -

🛠️ CI & Workflow

Metric Value Limit Status
Total CI Duration 6.40 min 15.00 min
Pnpm Cache Hit Hit -

@github-actions github-actions Bot added documentation Improvements or additions to documentation area:web agents tests labels Jul 24, 2026
@codacy-production

codacy-production Bot commented Jul 24, 2026

Copy link
Copy Markdown
Contributor

Up to standards ✅

🟢 Issues 0 issues

Results:
0 new issues

View in Codacy

🟢 Metrics 105 complexity · 9 duplication

Metric Results
Complexity 105
Duplication 9

View in Codacy

NEW Get contextual insights on your PRs based on Codacy's metrics, along with PR and Jira context, without leaving GitHub. Enable AI reviewer
TIP This summary will be updated as you push new changes.

@d-oit

d-oit commented Jul 24, 2026

Copy link
Copy Markdown
Owner Author

Checking Codacy failure...

Fix 20 failing mobile E2E tests by adding clickToolbarButton() helper
that handles the container-query responsive toolbar overflow menu.

Changes:
- Add clickToolbarButton() and suppressWorkboxErrors() to fixtures.ts
- Update 5 E2E test files for mobile viewport toolbar interaction
- Add unit tests for NotificationBadge, NotificationPanel, LibraryPage, SettingsPage
- Update LEARNINGS.md with mobile E2E and workbox SW patterns

Closes #845
@d-oit
d-oit force-pushed the fix/e2e-mobile-ci-failure-2026-07-24 branch from 1230cba to 8e1b5bd Compare July 24, 2026 10:02
@d-oit
d-oit merged commit feaff82 into main Jul 24, 2026
29 checks passed
@d-oit
d-oit deleted the fix/e2e-mobile-ci-failure-2026-07-24 branch July 24, 2026 11:53
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

agents area:web documentation Improvements or additions to documentation tests

Projects

None yet

Development

Successfully merging this pull request may close these issues.

CI failure on main: 30069345972

1 participant