Standardize browser QA at 1920x1080
This commit is contained in:
@@ -8,7 +8,7 @@ Raise the first battle map from flat placeholder-like terrain to an original han
|
||||
|
||||
- Unit sprites must read before the map.
|
||||
- Terrain contrast stays one step below characters, combat UI, and hover/selection feedback.
|
||||
- Texture detail should add depth without turning into visual noise at PC browser 100% scale.
|
||||
- Texture detail should add depth without turning into visual noise at an explicit 1920x1080 CSS viewport, 100% browser zoom, and DPR 1.
|
||||
- Terrain identity must remain clear: road, forest, hill, river, village, camp, fort.
|
||||
|
||||
## Terrain Palette
|
||||
@@ -35,4 +35,4 @@ Raise the first battle map from flat placeholder-like terrain to an original han
|
||||
- First battle lower-left camp and starting road should guide the eye toward the central route.
|
||||
- Central village and river should be readable without stealing focus.
|
||||
- Enemy fort area in the upper-right must imply an enemy line without becoming a large UI-like block.
|
||||
- At 100% PC browser scale, Liu Bei, Guan Yu, Zhang Fei, and enemy units must remain the strongest silhouettes.
|
||||
- At an explicit 1920x1080 CSS viewport, 100% browser zoom, and DPR 1, Liu Bei, Guan Yu, Zhang Fei, and enemy units must remain the strongest silhouettes. Follow `docs/desktop-browser-qa-standard.md` for capture verification.
|
||||
|
||||
@@ -12,7 +12,7 @@ The first battle uses `src/assets/images/battle/first-battle-map-v2.webp` as the
|
||||
|
||||
## Art Direction
|
||||
|
||||
- Units must read before the terrain at 100% desktop browser scale.
|
||||
- Units must read before the terrain at an explicit 1920x1080 CSS viewport, 100% browser zoom, and DPR 1.
|
||||
- Terrain uses muted greens, ochre roads, dark blue-green water, and compact structure markers.
|
||||
- Roads, forests, rivers, camps, villages, cliffs, and forts should be recognizable by silhouette and texture, not by high saturation.
|
||||
- The grid remains subtle and embedded in the paint grade, so it helps targeting without becoming the main visual layer.
|
||||
@@ -314,4 +314,4 @@ python scripts/generate-handpaint-map-sample.py --map thirtieth --tile-size 192
|
||||
- `docs/sixty-sixth-battle-map-handpaint-before-after.png`
|
||||
- `docs/sixty-sixth-battle-map-handpaint-preview.png`
|
||||
|
||||
Browser screenshots are saved per verification run after build/deploy.
|
||||
Browser screenshots are saved per verification run after build/deploy at an explicit 1920x1080 CSS viewport, 100% browser zoom, and DPR 1, following `docs/desktop-browser-qa-standard.md`. Larger 2560-class checks are supplemental and do not replace the FHD evidence.
|
||||
|
||||
@@ -11,7 +11,8 @@
|
||||
## 로컬 검증
|
||||
|
||||
- 빌드: `pnpm build` 성공
|
||||
- 브라우저: PC 1280x720 인앱 브라우저, `debugBattleSetup=attack-preview`
|
||||
- 기존 캡처: PC 1280x720 인앱 브라우저에서 생성된 PNG는 당시 세션의 증적으로 유지하며 FHD 캡처로 재표기하거나 확대하지 않는다. `debugBattleSetup=attack-preview`
|
||||
- 현재 기준 재검증(2026-07-17): 명시적 1920x1080 CSS viewport, 브라우저 확대 100%, DPR 1에서 공격·책략 예측 화면이 통과했고 콘솔 오류가 없었다.
|
||||
- 공격 예측: `docs/battle-preview-ui-rework-local-combat-preview.png`
|
||||
- 책략 예측: `docs/battle-preview-ui-rework-local-strategy-preview.png`
|
||||
- 콘솔 에러: 없음
|
||||
|
||||
@@ -52,8 +52,9 @@ The atlas remains a 128px-frame spritesheet with the existing 5x6 layout. New al
|
||||
|
||||
- Build: `pnpm build` passed.
|
||||
- Local browser: `http://127.0.0.1:4190/heros_web/?debug&debugBattleSetup=attack-preview&v=hq-icons-batch1-local`
|
||||
- Checked unit detail, strategy menu, command menu, and combat preview at desktop 1280x720.
|
||||
- Console errors: none observed during local browser check.
|
||||
- Historical capture note: the linked local and deployed PNGs preserve the original desktop 1280x720 session and have not been relabeled or upscaled.
|
||||
- Current-standard revalidation (2026-07-17): unit detail, strategy menu, command menu, and combat preview passed at an explicit 1920x1080 CSS viewport, 100% browser zoom, and DPR 1.
|
||||
- Console errors: none observed during the historical capture or current-standard revalidation.
|
||||
- Deploy: `pnpm deploy:nas` passed and deployed to `/volume1/web/heros_web`.
|
||||
- Deployed browser: `https://comtropy.synology.me/heros_web/?debug&debugBattleSetup=attack-preview&v=hq-icons-batch1-prod`
|
||||
- Deployed console errors: none observed during combat preview check.
|
||||
|
||||
@@ -54,6 +54,6 @@ The existing 5x6 atlas contract is preserved. Pixel comparison against the previ
|
||||
- `pnpm run verify:static-data` passed.
|
||||
- `pnpm run build` passed.
|
||||
- `pnpm run verify:release` passed, including new-game, reload/continue, defeat retry, victory, and camp-return flows.
|
||||
- Desktop browser checks passed at 1280x720 for the command menu, battle item menu, target selection, combat preview, sortie supply assignment, camp supply rows, and merchant rows.
|
||||
- Desktop browser checks passed on 2026-07-17 at an explicit 1920x1080 CSS viewport, 100% browser zoom, and DPR 1 for the command menu, battle item menu, target selection, combat preview, sortie supply assignment, camp supply rows, and merchant rows.
|
||||
- Both atlases loaded successfully and no browser console errors were observed.
|
||||
- Independent read-only review found no remaining blockers.
|
||||
|
||||
52
docs/desktop-browser-qa-standard.md
Normal file
52
docs/desktop-browser-qa-standard.md
Normal file
@@ -0,0 +1,52 @@
|
||||
# Desktop Browser QA Standard
|
||||
|
||||
## Primary Baseline
|
||||
|
||||
All routine desktop browser QA, visual review, screenshots, and release evidence use these explicit settings:
|
||||
|
||||
- CSS viewport: `1920x1080`.
|
||||
- Browser zoom: `100%`.
|
||||
- Device pixel ratio: `1`.
|
||||
- Desktop layout only; a different viewport is permitted only for a separately identified responsive or compatibility test.
|
||||
|
||||
Do not rely on the browser window's default size. Set the CSS viewport before opening the target flow, then confirm the values below before accepting a screenshot or pass result.
|
||||
|
||||
## Required Runtime Checks
|
||||
|
||||
Record or assert the following values for the primary pass:
|
||||
|
||||
- `window.innerWidth === 1920`.
|
||||
- `window.innerHeight === 1080`.
|
||||
- `window.devicePixelRatio === 1`.
|
||||
- The game canvas backing surface is `canvas.width === 1920` and `canvas.height === 1080`.
|
||||
- At the primary viewport, `canvas.getBoundingClientRect()` is approximately `1920x1080` and the canvas is centered without clipping.
|
||||
- The active Phaser game size and scene bounds remain `1920x1080`.
|
||||
- Browser console warning/error count is recorded, with unexpected errors treated as a failed check.
|
||||
|
||||
Capture the URL, renderer mode, checked flow, and date in the report. A report should state `1920x1080 CSS viewport, 100% browser zoom, DPR 1` rather than only saying `desktop` or `PC browser`.
|
||||
|
||||
## Supplemental 2560 Checks
|
||||
|
||||
Use `2560x1440` or `2560x1600` only as supplemental fit, centering, and large-monitor coverage checks. These checks verify that the fixed FHD game surface remains correctly contained and centered; they do not replace the primary `1920x1080` evidence.
|
||||
|
||||
## Legacy Authored Coordinates
|
||||
|
||||
Battle and camp UI still contain an authored legacy `1280x720` coordinate system that is scaled by `1.5` onto the FHD game surface. Constants and comments such as `battleReferenceWidth`, `battleReferenceHeight`, `campLegacyCanvasWidth`, `campLegacyCanvasHeight`, and legacy click-coordinate scaling describe this internal layout basis.
|
||||
|
||||
Do not change those values to `1920x1080` as part of viewport QA standardization. Doing so would double-scale or displace existing UI. Browser viewport settings and authored scene coordinates are separate concerns.
|
||||
|
||||
## Historical Evidence
|
||||
|
||||
Existing `1280x720` screenshots remain valid evidence of the session in which they were captured. Do not relabel, resize, or present them as FHD captures. When a historical report needs current validation:
|
||||
|
||||
1. Keep the original screenshot and identify it as historical evidence.
|
||||
2. Run a separate current-standard pass at `1920x1080` CSS viewport, `100%` browser zoom, and DPR `1`.
|
||||
3. Record the new date, checked surfaces, and console result without rewriting what the old image represents.
|
||||
|
||||
This policy applies to local, deployed, Canvas, and WebGL browser checks.
|
||||
|
||||
## Automation Contract
|
||||
|
||||
The shared automation source is `scripts/desktop-browser-viewport.mjs`. Browser-based QA scripts must use its context options rather than embedding another primary viewport.
|
||||
|
||||
Run `pnpm run verify:desktop-viewport` to confirm the FHD viewport, DPR 1 context, Phaser game size, project policy, and browser-check imports. This gate is also included in `pnpm run verify:static-data` so an omitted or changed baseline fails routine verification.
|
||||
@@ -29,6 +29,7 @@ Generated after the accessory icon rework in `src/game/scenes/BootScene.ts`.
|
||||

|
||||
|
||||
- URL checked: `http://127.0.0.1:4200/heros_web/?debug&debugSortiePrep&renderer=canvas`
|
||||
- Result: sortie prep opened on a desktop 1280x720 canvas and rendered the generated accessory textures in roster, slot, and detail surfaces.
|
||||
- Browser console warnings/errors: none observed.
|
||||
- Historical capture result: the PNG above preserves the original desktop 1280x720 session and has not been relabeled or upscaled.
|
||||
- Current-standard revalidation (2026-07-17): sortie prep passed at an explicit 1920x1080 CSS viewport, 100% browser zoom, and DPR 1, with the generated accessory textures visible in the roster, slot, and detail surfaces.
|
||||
- Browser console warnings/errors: none observed during the historical capture or current-standard revalidation.
|
||||
- Follow-up target from the updated audit: remaining low-detail equipment icons.
|
||||
|
||||
@@ -25,6 +25,7 @@ Generated after the armor icon rework in `src/game/scenes/BootScene.ts`.
|
||||

|
||||
|
||||
- URL checked: `http://127.0.0.1:4198/heros_web/?debug&debugSortiePrep&renderer=canvas`
|
||||
- Result: sortie prep opened on a desktop 1280x720 canvas and rendered the generated armor textures in roster, slot, and detail surfaces.
|
||||
- Browser console warnings/errors: none observed.
|
||||
- Historical capture result: the PNG above preserves the original desktop 1280x720 session and has not been relabeled or upscaled.
|
||||
- Current-standard revalidation (2026-07-17): sortie prep passed at an explicit 1920x1080 CSS viewport, 100% browser zoom, and DPR 1, with the generated armor textures visible in the roster, slot, and detail surfaces.
|
||||
- Browser console warnings/errors: none observed during the historical capture or current-standard revalidation.
|
||||
- Follow-up target from the updated audit: accessory charms and tokens.
|
||||
|
||||
@@ -11,8 +11,9 @@ Generated by `scripts/audit-equipment-icon-quality.mjs`.
|
||||
- Texture size: 64px
|
||||
- Drawing grid: 28 units scaled 2.29x into the texture
|
||||
- Runtime item icon scene: `src/game/scenes/CampScene.ts`
|
||||
- Observed runtime display sizes: `14px`, `20px`, `21px`, `22px`, `30px`
|
||||
- Observed runtime display sizes: `14px`
|
||||
- Direct item texture render sites found: 5
|
||||
- Browser visual QA baseline: `1920x1080` CSS viewport at 100% zoom
|
||||
|
||||
## Main Findings
|
||||
|
||||
|
||||
@@ -21,6 +21,7 @@ Generated after the final low-detail weapon icon rework in `src/game/scenes/Boot
|
||||

|
||||
|
||||
- URL checked: `http://127.0.0.1:4201/heros_web/?debug&debugSortiePrep&renderer=canvas`
|
||||
- Result: sortie prep opened on a desktop 1280x720 canvas and rendered the generated weapon textures in roster, slot, and detail surfaces.
|
||||
- Browser console warnings/errors: none observed.
|
||||
- Historical capture result: the PNG above preserves the original desktop 1280x720 session and has not been relabeled or upscaled.
|
||||
- Current-standard revalidation (2026-07-17): sortie prep passed at an explicit 1920x1080 CSS viewport, 100% browser zoom, and DPR 1, with the generated weapon textures visible in the roster, slot, and detail surfaces.
|
||||
- Browser console warnings/errors: none observed during the historical capture or current-standard revalidation.
|
||||
- Follow-up target from the updated audit: no generated equipment icon batch is currently flagged; select the next art pass from runtime screenshots.
|
||||
|
||||
@@ -25,5 +25,6 @@ Generated after the spear/polearm icon rework in `src/game/scenes/BootScene.ts`.
|
||||

|
||||
|
||||
- URL checked: `http://127.0.0.1:4197/heros_web/?debug&debugSortiePrep&renderer=canvas`
|
||||
- Result: sortie prep opened on a desktop 1280x720 canvas and rendered the generated equipment textures in the roster, slot, and detail surfaces.
|
||||
- Historical capture result: the PNG above preserves the original desktop 1280x720 session and has not been relabeled or upscaled.
|
||||
- Current-standard revalidation (2026-07-17): sortie prep passed at an explicit 1920x1080 CSS viewport, 100% browser zoom, and DPR 1, with the generated equipment textures visible in the roster, slot, and detail surfaces and no browser console warnings or errors.
|
||||
- Follow-up target from the updated audit: armor silhouettes.
|
||||
|
||||
@@ -14,8 +14,9 @@ Date: 2026-07-03
|
||||
## Browser Checks
|
||||
- Local: `http://127.0.0.1:4195/heros_web/?debug&debugBattleSetup=attack-preview&v=result-feedback-local-card`
|
||||
- Deployed: `https://comtropy.synology.me/heros_web/?debug&debugBattleSetup=attack-preview&v=result-feedback-20260703`
|
||||
- PC viewport: 1280x720
|
||||
- Console errors: 0 local, 0 deployed
|
||||
- Historical capture viewport: 1280x720. The six PNGs below preserve the original local and deployed sessions and have not been relabeled or upscaled.
|
||||
- Current-standard revalidation (2026-07-17): the equivalent current-code target preview, map popup, and post-attack card flows passed locally at an explicit 1920x1080 CSS viewport, 100% browser zoom, and DPR 1. The older deployed PNGs remain historical evidence rather than current FHD captures.
|
||||
- Console errors: 0 during the historical local/deployed captures and current-standard revalidation.
|
||||
|
||||
## Captures
|
||||
- Local target preview: `docs/result-feedback-local-target-preview-card.png`
|
||||
|
||||
@@ -47,4 +47,4 @@ Completed representative pass:
|
||||
- `unit-sima-yi`: strengthened from generic dark strategist to named Wei court conspirator with tall black court crown, black lacquer command tablet, sealed military order, dark decree scroll, bronze tally baton, and narrow command rod.
|
||||
- `unit-huang-quan`: strengthened from generic quartermaster official to Shu logistics quartermaster with supply ledger, ration register, supply-route map board, bamboo tally slips, bronze counting rods, sealed requisition scroll, and wooden document case.
|
||||
|
||||
Every representative fix should include contact sheet, animation GIF, battle preview, before/after, alpha audit, build, and browser check.
|
||||
Every representative fix should include contact sheet, animation GIF, battle preview, before/after, alpha audit, build, and a browser check at an explicit 1920x1080 CSS viewport, 100% browser zoom, and DPR 1, following `docs/desktop-browser-qa-standard.md`.
|
||||
|
||||
@@ -47,7 +47,7 @@ Only Liu Bei may be produced in this sample phase. Do not expand to Guan Yu, Zha
|
||||
Required sample outputs:
|
||||
- 313x313 contact sheet for Liu Bei.
|
||||
- Animated GIF or browser capture for idle/walk/action.
|
||||
- 100% desktop browser screenshot from the battle map.
|
||||
- Battle-map browser screenshot captured at an explicit 1920x1080 CSS viewport, 100% browser zoom, and DPR 1, following `docs/desktop-browser-qa-standard.md`.
|
||||
- Before/after comparison against the current checked-in Liu Bei sprite.
|
||||
|
||||
No deployment, commit, or push is allowed before sample approval.
|
||||
|
||||
@@ -62,8 +62,8 @@ Review state manifest: `unit-sprite-rework-manifest.json`.
|
||||
- `python scripts/check-unit-sprite-workflow-consistency.py`
|
||||
- Review the relevant `docs/unit-sprite-review-<batch>.png` by eye.
|
||||
- `pnpm build`
|
||||
- Local PC browser check.
|
||||
- For pending samples, local PC browser check with `?debug&debugSpritePreview=<unit-key>`.
|
||||
- Local PC browser check at an explicit 1920x1080 CSS viewport, 100% browser zoom, and DPR 1, following `docs/desktop-browser-qa-standard.md`.
|
||||
- For pending samples, run the same 1920x1080 CSS viewport, 100% zoom, DPR 1 check with `?debug&debugSpritePreview=<unit-key>`.
|
||||
- Console errors: `0`.
|
||||
- Approval received for the batch before commit/push/deploy.
|
||||
|
||||
@@ -76,7 +76,7 @@ Do not commit, push, or deploy when:
|
||||
- Any newly edited unit is still marked `pending-approval`.
|
||||
- Any untouched unit is accidentally counted as approved because it is only technically `ok`.
|
||||
- The review board shows the new unit is not visibly better than the old placeholder.
|
||||
- The browser check has not been run.
|
||||
- The browser check has not been run at the required 1920x1080 CSS viewport, 100% browser zoom, and DPR 1.
|
||||
- Console errors are present.
|
||||
|
||||
After approval and successful verification:
|
||||
|
||||
@@ -5,7 +5,8 @@
|
||||
- Map key: `battle-map-sixty-fourth`
|
||||
- Source asset: `src/assets/images/battle/sixty-fourth-battle-map.webp`
|
||||
- Audit trigger: lowest battle-map source density bucket, `128x110` grid at `112.0` source pixels per tile
|
||||
- Browser target: local Vite, `1280x720`, `http://127.0.0.1:4202/heros_web/?debug&debugBattle=sixty-fourth-battle-weishui-camps&v=visual-qa-sixty-fourth`
|
||||
- Historical browser target: local Vite at `1280x720`, `http://127.0.0.1:4202/heros_web/?debug&debugBattle=sixty-fourth-battle-weishui-camps&v=visual-qa-sixty-fourth`. The three linked PNGs preserve that original session and have not been relabeled or upscaled.
|
||||
- Current-standard revalidation target (2026-07-17): the same battle flow at an explicit 1920x1080 CSS viewport, 100% browser zoom, and DPR 1.
|
||||
|
||||
## Captures
|
||||
|
||||
@@ -35,6 +36,7 @@ Recommended repaint constraints:
|
||||
|
||||
## Verification
|
||||
|
||||
- Local runtime: passed at `1280x720`.
|
||||
- Historical local runtime: passed at `1280x720`; the three saved screenshots remain historical evidence.
|
||||
- Current-standard revalidation (2026-07-17): passed at an explicit 1920x1080 CSS viewport, 100% browser zoom, and DPR 1 for deployment, battle start, tactical readability, and minimap rendering.
|
||||
- Screenshots saved: 3.
|
||||
- Browser warning/error logs during runtime pass: none.
|
||||
- Browser warning/error logs during the historical runtime pass or current-standard revalidation: none.
|
||||
|
||||
Reference in New Issue
Block a user