test: add canvas visual diff pipeline

.github/workflows/render-diff.yml

@@ -0,0 +1,124 @@
+name: Render Diff
+
+on:
+  pull_request:
+    branches: [main, devel]
+    paths:
+      - 'Cargo.toml'
+      - 'Cargo.lock'
+      - 'src/paint/**'
+      - 'src/renderer/**'
+      - 'src/document_core/queries/rendering.rs'
+      - 'src/wasm_api.rs'
+      - 'rhwp-studio/**'
+      - '.github/workflows/render-diff.yml'
+  workflow_dispatch:
+    inputs:
+      fixtures:
+        description: 'Comma-separated sample files under rhwp-studio/public/samples'
+        required: false
+        type: string
+      max-pages:
+        description: 'Pages per fixture to compare, or all'
+        required: false
+        default: '1'
+        type: string
+      full-suite:
+        description: 'Run all built-in sample fixtures'
+        required: false
+        default: false
+        type: boolean
+      write-images:
+        description: 'Write PNG artifacts even when cases pass'
+        required: false
+        default: false
+        type: boolean
+
+env:
+  CARGO_TERM_COLOR: always
+
+jobs:
+  canvas-visual-diff:
+    name: Canvas visual diff
+    runs-on: ubuntu-latest
+    permissions:
+      contents: read
+
+    steps:
+      - uses: actions/checkout@v5
+
+      - name: Install Rust toolchain
+        uses: dtolnay/rust-toolchain@stable
+        with:
+          targets: wasm32-unknown-unknown
+
+      - name: Install wasm-pack
+        run: curl https://rustwasm.github.io/wasm-pack/installer/init.sh -sSf | sh
+
+      - name: Cache cargo registry & build
+        uses: actions/cache@v4
+        with:
+          path: |
+            ~/.cargo/registry
+            ~/.cargo/git
+            target
+          key: ${{ runner.os }}-render-diff-cargo-${{ hashFiles('**/Cargo.lock') }}
+          restore-keys: |
+            ${{ runner.os }}-render-diff-cargo-
+
+      - name: Build WASM package
+        run: wasm-pack build --target web --dev
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: '22'
+          cache: npm
+          cache-dependency-path: rhwp-studio/package-lock.json
+
+      - name: Install Studio dependencies
+        working-directory: rhwp-studio
+        run: npm ci
+
+      - name: Install Chromium
+        working-directory: rhwp-studio
+        run: |
+          browser_path=$(npx @puppeteer/browsers install chromium@latest --path .cache/puppeteer --format '{{path}}' | tail -n 1)
+          browser_path=$(realpath "$browser_path")
+          echo "CHROME_PATH=$browser_path" >> "$GITHUB_ENV"
+
+      - name: Check render diff script syntax
+        working-directory: rhwp-studio
+        run: |
+          node --check e2e/canvas-render-diff.test.mjs
+          node --check e2e/run-render-diff.mjs
+
+      - name: Run canvas visual diff
+        working-directory: rhwp-studio
+        env:
+          VITE_PORT: 7700
+          RHWP_RENDER_DIFF_FILES: ${{ inputs.fixtures || '' }}
+          RHWP_RENDER_DIFF_MAX_PAGES: ${{ inputs['max-pages'] || '1' }}
+          RHWP_RENDER_DIFF_ALL: ${{ inputs['full-suite'] == true && '1' || '0' }}
+          RHWP_RENDER_DIFF_WRITE_IMAGES: ${{ inputs['write-images'] == true && '1' || '0' }}
+        run: npm run e2e:render-diff:ci
+
+      - name: Add render diff summary
+        if: always()
+        working-directory: rhwp-studio
+        run: |
+          if [ -f e2e/screenshots/render-diff/summary.md ]; then
+            cat e2e/screenshots/render-diff/summary.md >> "$GITHUB_STEP_SUMMARY"
+          fi
+
+      - name: Upload render diff artifacts
+        if: always()
+        uses: actions/upload-artifact@v4
+        with:
+          name: render-diff-artifacts
+          path: |
+            rhwp-studio/e2e/screenshots/render-diff/
+            output/e2e/
+            target/rhwp-studio-vite.log
+          if-no-files-found: ignore
+          retention-days: 14

README.md

@@ -182,6 +182,8 @@ rhwp는 Rust + WebAssembly 기반의 오픈소스 HWP/HWPX 뷰어/에디터입
 - The layered SVG path is a transition adapter that expands `PageLayerTree` back into the existing SVG renderer.
 - Browser/native Canvas paths render through `PageLayerTree` replay by default.
 - Legacy Canvas remains available through `renderPageCanvasLegacy` / `renderPageToCanvasLegacy` for parity checks.
+- P3 visual regression coverage runs `npm run e2e:render-diff:ci` in `rhwp-studio` to compare legacy Canvas and layer Canvas in Chromium; CI uploads render-diff artifacts and writes a summary.
+- The default render-diff fixtures cover basic text/table output, business-document layout, and treat-as-char object placement; override with `RHWP_RENDER_DIFF_FILES`, `RHWP_RENDER_DIFF_MAX_PAGES`, or `RHWP_RENDER_DIFF_ALL=1`.
 - C ABI export is intentionally left for a later PR.
 - `ResourceArena` is reserved in `PageLayerTree`; binary resource interning is not implemented yet.
 - This phase establishes the frontend/backend boundary for later CanvasKit and native Skia backends.

README_EN.md

@@ -183,6 +183,8 @@ See the [roadmap document](mydocs/eng/report/rhwp-milestone.md) for details.
 - The layered SVG path is a transition adapter that expands `PageLayerTree` back into the existing SVG renderer.
 - Browser/native Canvas paths render through `PageLayerTree` replay by default.
 - Legacy Canvas remains available through `renderPageCanvasLegacy` / `renderPageToCanvasLegacy` for parity checks.
+- P3 visual regression coverage runs `npm run e2e:render-diff:ci` in `rhwp-studio` to compare legacy Canvas and layer Canvas in Chromium; CI uploads render-diff artifacts and writes a summary.
+- The default render-diff fixtures cover basic text/table output, business-document layout, and treat-as-char object placement; override with `RHWP_RENDER_DIFF_FILES`, `RHWP_RENDER_DIFF_MAX_PAGES`, or `RHWP_RENDER_DIFF_ALL=1`.
 - C ABI export is intentionally left for a later PR.
 - `ResourceArena` is reserved in `PageLayerTree`; binary resource interning is not implemented yet.
 - This phase establishes the frontend/backend boundary for later CanvasKit and native Skia backends.