Files
heros_web/docs/desktop-browser-qa-standard.md

3.2 KiB

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.