jiapuapp/docs/superpowers/plans/2026-07-21-project-wide-audit-and-expert-optimization.md

Project-Wide Audit And Expert Optimization Implementation Plan

For agentic workers: REQUIRED SUB-SKILL: Use superpowers:executing-plans for the audit phase. After that phase is fully verified, use two explicitly assigned expert subagents for the optimization phase. Steps use checkbox (- [ ]) syntax for tracking.

Goal: Finish MuMu-native responsive, visual, interaction, and functional review for every active page from G10 onward, repair every confirmed issue through a five-option decision process, then run a two-expert project enrichment phase and implement the agreed improvements.

Architecture: styles/adaptive-frame-profiles.scss remains the only owner of nine-slice frame values, while tests/responsive-layout-allowlist.json remains the only owner of justified fixed-size exceptions. Each page is audited from fresh MuMu screenshots, repaired test-first only when evidence proves a defect, and reverified before the next page. After the baseline is complete, two independent experts inspect the whole product from visual/interaction and functional/code perspectives; the primary agent reconciles their proposals into small verified batches.

Tech Stack: uni-app, Vue 3, SCSS, PowerShell contracts, Node.js CDP navigation assistance, HBuilderX Android runtime, MuMu Android, ADB.

Global Constraints

• G01 through G09 are already manually accepted and remain frozen unless a later global change produces a demonstrated regression.
• The continuous audit boundary begins at G10 and includes every later active route in pages.json.
• Do not stop after a single page. Continue through the plan unless genuinely blocked by missing authority, external state, or a business decision that cannot be inferred safely.
• For every confirmed defect, generate five viable solutions, compare contract fit, regression risk, affected scope, maintainability, and MuMu evidence, then implement the strongest option without asking the user to choose.
• If a trade-off remains genuinely ambiguous or three implementation hypotheses fail, dispatch an independent reviewer to argue the opposing technical position until a testable decision is reached.
• Content containers derive height from content. Only viewport-constrained overlays may use max-height, with internal scrolling when required.
• Do not hide layout failures by reducing font sizes or arbitrarily shrinking controls.
• Variable-height decorated surfaces use the shared nine-slice profiles. Pages and components must not define border-image-slice directly.
• Fixed-proportion icons, avatars, seals, thumbnails, and approved decorations may retain fixed dimensions only through tests/responsive-layout-allowlist.json.
• Do not use background-size: 100% 100% or an equivalent full-image stretch for variable content surfaces.
• Do not use a browser as visual acceptance evidence. Browser/CDP automation may only assist navigation or logic checks; accepted visual evidence must come from MuMu screenshots captured in the current run.
• Keep MuMu at its current user-selected 900x1600 / 320dpi configuration unless the user explicitly requests another size.
• Do not start or close MuMu.
• Ignore the system watermark shown by MuMu screenshots.
• Guidance copy must use generic examples such as 某某某堂侄; existing fixture/mock records are outside that copy cleanup rule.
• Do not modify API contracts, state enums, routes, or fixture data merely to solve layout problems.
• Do not run git add, git commit, git push, git restore, git checkout, or other Git mutation commands.
• Do not create compatibility fallbacks when a responsive contract changes. Update the owner, runtime, validators, tests, and documentation together.

Page Inventory

The continuous audit covers these routes in order:

pages/genealogy/g10-application-review
pages/genealogy/g11-genealogy-settings
pages/genealogy/g12-generation-poems
pages/tree/t01-tree-overview
pages/tree/t03-member-profile
pages/tree/t04-add-relative
pages/tree/t05-edit-member
pages/tree/t06-edit-relationship
pages/tree/t07-member-directory
pages/tree/t08-member-states
pages/family/f01-family-feed
pages/family/f02-publish-feed
pages/family/f03-feed-detail
pages/family/f04-article-list
pages/family/f05-article-detail
pages/family/f06-article-editor
pages/family/f07-album-list
pages/family/f08-album-detail
pages/family/f09-media-upload
pages/family/f10-video-list
pages/records/r01-people-list
pages/records/r02-person-detail
pages/records/r03-gift-list
pages/records/r04-gift-editor
pages/records/r05-ritual-list
pages/records/r06-ritual-detail
pages/records/r07-ritual-editor
pages/records/r08-growth-journal
pages/records/r09-life-events
pages/records/r10-memo-list
pages/records/r11-merit-records
pages/notification/n01-message-center
pages/notification/n02-message-detail
pages/profile/m01-profile-home
pages/profile/m02-edit-profile
pages/profile/m03-security-settings
pages/profile/m04-change-password
pages/profile/m05-change-phone
pages/profile/m06-help-center
pages/profile/m07-feedback
pages/profile/m08-promotion
pages/profile/m09-vip-orders
pages/profile/m10-about-settings

Standard Per-Page Audit Loop

Every page task below uses this exact loop:

• Read the whole Vue page and its focused contracts before interaction.
• Enumerate default, loading, empty, error, permission, validation, success, dialog, and long-content states; mark only genuinely unsupported states as not applicable.
• Navigate through the running Android WebView without using browser-rendered screenshots.
• Capture each stable state with ADB, save it under tmp/project-audit/<page-id>/, and inspect the saved PNG before accepting it.
• Reject transition, blank, loading-incomplete, wrong-route, or cropped screenshots and capture them again.
• Check content-driven height, wrapping, horizontal overflow, frame distortion, touch reachability, safe areas, modal scrolling, hierarchy, feedback placement, and state clarity.
• If no defect is visible, run the page's focused contracts and advance.
• If a defect is visible, document five solutions and select the one with the best project-wide contract fit and smallest justified surface area.
• Add or tighten a focused failing contract and run it to observe the expected failure.
• Implement the minimum source change, with no adjacent cleanup.
• Run focused contracts, the global responsive contract, and compile audit.
• Allow HBuilderX hot reload to update MuMu, then recapture every affected state and inspect each PNG.
• Leave the page in its default review state and continue immediately to the next route.

---

Task 1: Complete G10-G12 Genealogy Review

Files:

• Verify/Modify: pages/genealogy/g10-application-review.vue
• Verify/Modify: pages/genealogy/g11-genealogy-settings.vue
• Verify/Modify: pages/genealogy/g12-generation-poems.vue
• Test: tests/g10-*.ps1
• Test: tests/g11-*.ps1
• Test: tests/g12-*.ps1

Interfaces:

• Consumes: shared genealogy background, PageHeader, AppDialog, AppButton, AppLoading, adaptive genealogy frame profiles.

• Produces: verified settings, review, and generation-poem flows with current-run MuMu evidence.

• Apply the Standard Per-Page Audit Loop to G10, including list, help, approve, reject, reject validation, result, empty, error, no-permission, and loading states. All stable MuMu states passed visual inspection and all focused G10 contracts passed without a source change.

• Apply the loop to G11. The content-height regression was reproduced, protected by tests/g11-document-flow-contract.ps1, fixed by removing the panel min-height, and reverified in MuMu.

• Apply the loop to G12, including list, empty, edit, validation, success, error, no-permission, loading, and long poem content. A forced panel min-height was reproduced, protected by tests/g12-document-flow-contract.ps1, removed, and reverified through the 48-character long-list bottom in MuMu.

• Run all G10-G12 focused contracts plus the four project baseline commands. The applicable PowerShell contracts and all four baselines pass; the legacy browser runtime smoke was intentionally excluded from visual acceptance and cannot connect without its separate localhost browser harness.

Task 2: Complete T-Series Review

Files:

• Verify/Modify: pages/tree/t01-tree-overview.vue

• Verify/Modify: pages/tree/t03-member-profile.vue

• Verify/Modify: pages/tree/t04-add-relative.vue

• Verify/Modify: pages/tree/t05-edit-member.vue

• Verify/Modify: pages/tree/t06-edit-relationship.vue

• Verify/Modify: pages/tree/t07-member-directory.vue

• Verify/Modify: pages/tree/t08-member-states.vue

• Verify/Modify: components/tree/TreeMemberForm.vue

• Test: matching tests/t*.ps1 and runtime navigation contracts.

• Apply the Standard Per-Page Audit Loop to T01. Fixed the clipped horizontal-pan cue by layering it over the visible grid viewport, and isolated tree-only scroll/metrics bindings so all non-tree state cards fit the viewport; all stable states plus horizontal panning passed MuMu review.

• Apply the Standard Per-Page Audit Loop to T03. Audited editable, privacy, forbidden, missing/unknown error, and loading states; removed the forced member-panel min-height, updated its document-flow contract to the shared adaptive owners, and reverified in MuMu.

• Apply the Standard Per-Page Audit Loop to T04. Audited relative/first-member forms, validation, long summary growth, discard dialog, success, and error; removed the forced panel min-height, added the business-contract guard, and reverified in MuMu.

• Apply the Standard Per-Page Audit Loop to T05. Audited form, validation, long biography, discard dialog, success, error, and no-permission; removed the forced panel min-height, added a focused contract guard, and reverified in MuMu.

• Apply the Standard Per-Page Audit Loop to T06. Audited form, validation, success, conflict, conflict-rules dialog, and error; removed the forced panel min-height, added a focused contract guard, and reverified in MuMu.

• Apply the Standard Per-Page Audit Loop to T07. Audited full/filtered lists, search-driven empty, explicit empty, error recovery, and loading; no page-source defect was found. Updated the stale asset contract to assert the shared adaptive owners; all focused contracts pass.

• Apply the Standard Per-Page Audit Loop to T08. Audited privacy, deceased, forbidden, and invalid-member error states with matching member/state contracts; all content, guidance, and actions fit without clipping, so no source change was required.

• Cover tree overflow, selected member, long relationship copy, form validation, directory search, empty/error states, and permission states where supported.

• Run focused T-series contracts, global responsive contract, and compile audit. All T-series PowerShell contracts and the four project baselines pass.

Task 3: Complete F-Series Review

Files:

• Verify/Modify: pages/family/f01-family-feed.vue through pages/family/f10-video-list.vue

• Test: matching tests/f*.ps1 and runtime flow contracts.

• Apply the Standard Per-Page Audit Loop to F01. List, shortcuts, empty, error/retry, loading, tabbar spacing, and content scroll all pass MuMu review without a source change.

• Apply the Standard Per-Page Audit Loop to F02. Audited form, empty validation toast, 276-character growth, success, and error; removed the forced panel min-height, added textarea auto-height, modernized the adaptive ownership contract, and reverified in MuMu.

• Apply the Standard Per-Page Audit Loop to F03. Ready, expired, error, loading, article/comment flow, empty validation, submission failure, successful insertion, and long auto-height comment content all pass MuMu review without a source change.

• Apply the Standard Per-Page Audit Loop to F04. Audited ready, empty, error, loading, search-empty/reset, 50-item growth, and route actions. The long-list audit exposed a shared fixed-header host stacking defect also visible in F03; added a global direct-host stacking contract, verified the fixed header at the list bottom, and regression-checked F03 plus the accepted G10 dialog overlay.

• Apply the Standard Per-Page Audit Loop to F05. Ready article, fixed-header scroll boundary, favorite/unfavorite feedback, edit routing, expired/unknown return flow, privacy, error recovery, and loading all pass MuMu review without a page-source change.

• Apply the Standard Per-Page Audit Loop to F06. Audited create/edit, validation, loading, draft, saving, failure retention/retry, success, return routing, and long content. MuMu reproduced a 524px body clipped into a 150px textarea; selected content-driven auto-height, migrated stale tests to adaptive profile ownership, and reverified equal client/scroll height plus natural page growth.

• Apply the Standard Per-Page Audit Loop to F07. Ready/30-item growth, fixed-header bottom, empty, error, loading, album navigation, create dialog, empty validation, long name, successful insertion, and toast all pass MuMu review without a source change.

• Apply the Standard Per-Page Audit Loop to F08. Normal photo wall/top-bottom scroll, five fixed-ratio media tiles, full-screen preview at the final photo, Android back-to-close behavior, empty/expired states, return routing, and upload navigation all pass MuMu review without a source change.

• Apply the Standard Per-Page Audit Loop to F09. Audited initial, permission, selected, nine-photo maximum, add/remove/active-photo editing, required validation, long batch/photo notes, uploading lock/progress, failure retry, success return, and fixed-header gesture scroll. Added auto-height to both description fields and a shared PageHeader compositor layer after MuMu reproduced native-media scroll paint loss; reverified F08 media scrolling and the accepted G10 dialog overlay.

• Apply the Standard Per-Page Audit Loop to F10. Audited loading, success/empty return flow, fixed-header layout, and status-card rendering. Replaced the stretched scaleToFill decorative image with the shared adaptive family-panel profile, tightened its contract, and reverified the resulting nine-slice frame in MuMu.

• Cover feed cards, publish validation, detail comments, article lists/details/editor, album lists/details, media upload, video lists, empty/loading/error/success states, and long content.

• Run focused F-series contracts, global responsive contract, and compile audit. All 13 focused F-series contracts and the four project baselines pass; two stale F01 tests were migrated from forbidden stretch-image assertions to the shared adaptive-profile owner.

Task 4: Complete R-Series Review

Files:

• Verify/Modify: pages/records/r01-people-list.vue through pages/records/r11-merit-records.vue

• Test: matching tests/r*.ps1 and module-series contracts.

• Apply the Standard Per-Page Audit Loop to R01. Audited ready, search-empty/reset, empty, error/retry, person routing, and long copy in MuMu. Replaced fixed card height plus percentage padding with content-driven height and profile-owned safe padding; replaced the Android-incompatible location.hash state reader with the UniApp onLoad route contract.

• Apply the Standard Per-Page Audit Loop to R02. Detail, edit, create validation, 450-character auto-height biography, privacy, loading, error/retry, expired, and related-route controls pass MuMu review without a page-source change.

• Apply the Standard Per-Page Audit Loop to R03. Ready/50-item growth, fixed-header bottom, empty, error/retry, loading, and create/edit routing pass MuMu review without a source change.

• Apply the Standard Per-Page Audit Loop to R04. Create validation, save success, forced failure/retry, view/edit, delete confirmation/cancel, and return flow pass MuMu review without a source change.

• Apply the Standard Per-Page Audit Loop to R05. Ready/50-item growth, fixed-header bottom, empty, error/retry, loading, create, and detail routing pass MuMu review without a source change.

• Apply the Standard Per-Page Audit Loop to R06. Detail, long description and participant roles, privacy, error/retry, loading/expired contracts, list return, and edit routing pass MuMu review without a source change.

• Apply the Standard Per-Page Audit Loop to R07. Edit/create, required validation, long auto-height description, save success, forced-failure/retry contract, and delete flow pass MuMu review without a source change.

• Apply the Standard Per-Page Audit Loop to R08. Ready timeline, empty/error/retry/loading contracts, required dialog validation, 1,520-character auto-height story, internal dialog scroll to actions, save insertion, and toast pass MuMu review without a source change.

• Apply the Standard Per-Page Audit Loop to R09. Ready timeline, empty/create flow, required validation, successful insertion, toast, long-content and shared-dialog behavior pass MuMu review without a source change.

• Apply the Standard Per-Page Audit Loop to R10. Ready, complete/reopen toggle, toast, long-card growth, create validation/save, empty/error/retry/loading contracts pass MuMu review without a source change.

• Apply the Standard Per-Page Audit Loop to R11. Summary/list, long contribution growth, create validation/save, live total update, toast, empty/error/retry/loading contracts pass MuMu review without a source change.

• Cover lists, details, editors, validation, long biographies, timeline content, empty/loading/error/success states, and feedback overlays.

• Run focused R-series contracts, global responsive contract, and compile audit. All four focused R contracts and the four project baselines pass; the stale R02 stretch-image test was migrated to shared adaptive-profile ownership.

Task 5: Complete N And M Series Review

Files:

• Verify/Modify: pages/notification/n01-message-center.vue

• Verify/Modify: pages/notification/n02-message-detail.vue

• Verify/Modify: pages/profile/m01-profile-home.vue through pages/profile/m10-about-settings.vue

• Test: matching tests/n*.ps1, tests/m*.ps1, and module-series contracts.

• Apply the Standard Per-Page Audit Loop to N01. Ready/unread, mark-all-read, toast, long-card growth, empty/error/retry/loading contracts, and detail/review routing pass MuMu review without a page-source change.

• Apply the Standard Per-Page Audit Loop to N02. Unread/read, mark-read toast, long-body growth, approved-target variant, expired/return flow, and responsive state layout pass MuMu review without a page-source change.

• Apply the Standard Per-Page Audit Loop to M01 through M10 in route order. Reviewed profile ready/error and service navigation; edit/password/phone validation and long inputs; security routes; FAQ expansion/search; feedback validation and long content; promotion copy/poster dialog; VIP empty/ready orders and service dialog; and about agreements plus logout cancel/confirm/disabled states in MuMu.

• Cover unread/read, detail, profile summary, edit and security forms, password/phone validation, help, feedback, promotion, orders, about/settings, loading/error/success, and long content.

• Run focused N/M contracts. All eight N/M PowerShell contracts pass; the stale M01 stretch-image assertions were migrated to the shared adaptive-profile owner. Project-wide baselines continue in Task 6.

Task 6: Project-Wide Baseline Closure

Files:

• Verify: tests/responsive-layout-coverage.json

• Verify: tests/responsive-layout-allowlist.json

• Verify: styles/adaptive-frame-profiles.scss

• Verify: all components/**/*.vue, pages/**/*.vue, and App.vue.

• Run powershell -ExecutionPolicy Bypass -File tests/adaptive-frame-profiles-contract.ps1 and require PASS.

• Run powershell -ExecutionPolicy Bypass -File tests/project-responsive-layout-contract.ps1 and require PASS.

• Run powershell -ExecutionPolicy Bypass -File tests/ag-responsive-surfaces-contract.ps1 and require PASS.

• Run powershell -ExecutionPolicy Bypass -File tests/compile-audit.ps1 and require PASS.

• Verify the Vue file set exactly matches tests/responsive-layout-coverage.json, with zero missing and zero stale entries: 66 actual and 66 covered.

• Verify zero Vue matches for 100% 100% no-repeat.

• Verify zero direct border-image-slice declarations in Vue pages/components.

• Confirm MuMu remains online and retains the user-selected resolution and density: emulator-5554, physical 900×1600 at 320 dpi. The accepted G10 checkpoint was rechecked after the final contract migration and remains visually correct.

Task 7: Two-Expert Whole-Product Optimization Review

Files:

• Create: docs/superpowers/specs/2026-07-21-whole-product-enrichment-design.md
• Create: docs/superpowers/plans/2026-07-21-whole-product-enrichment-implementation.md
• Verify: all accepted MuMu screenshot folders from Task 1 through Task 6.

Interfaces:

• Expert A produces: visual-system and interaction recommendations ranked by user impact, consistency, accessibility, and implementation risk.

• Expert B produces: functional-flow and frontend-code recommendations ranked by correctness, maintainability, performance, and regression risk.

• Primary agent produces: one reconciled design and implementation plan with no duplicate contract ownership.

• Dispatch Expert A with the complete project constraints, accepted MuMu evidence, shared components, style profiles, and route inventory. Require concrete file-level recommendations and forbid browser visual evidence.

• Dispatch Expert B independently with the same evidence and constraints. Require concrete flow, state, accessibility, and code-quality recommendations.

• Send each expert the other's proposal and require a written challenge covering conflicts, missing risks, and unnecessary scope.

• Reconcile both reviews. For every disputed improvement, generate five solutions and select one using user impact, global consistency, regression risk, maintenance cost, and MuMu verifiability.

• Write the reconciled design spec and implementation plan. Do not alter accepted business contracts without an explicit migration requirement.

Task 8: Implement And Verify Expert Optimizations

Files:

• Modify: only the files named by the reconciled Task 7 plan.

• Test: focused contracts created before each production change.

• Evidence: tmp/project-optimization/<batch-id>/ MuMu screenshots.

• Divide accepted improvements into small batches that each have one owner and one independently testable outcome.

• For each batch, write the focused failing contract and observe the expected failure.

• Implement the minimum shared or page-level change chosen by the reconciled plan.

• Run focused and project-wide contracts.

• Capture and inspect MuMu screenshots for every affected route and state.

• Recheck previously accepted pages whenever a shared component or shared profile changes.

• Finish only when all accepted optimization batches and the project-wide baseline pass with current-run evidence.

Self-Review

• The plan covers every route from G10 onward and explicitly freezes G01-G09 except for demonstrated shared regressions.
• The single owners for nine-slice profiles, responsive exceptions, and coverage remain unchanged.
• The five-option decision process, autonomous execution, MuMu-only visual evidence, no-Git constraint, current emulator configuration, and two-expert enrichment phase are explicit.
• There are no compatibility fallback steps and no authorization to modify business contracts speculatively.