mirror of
https://github.com/heygen-com/hyperframes.git
synced 2026-09-11 14:50:02 +00:00
Vance Ingalls
d7c1050e44
## Summary Replace the trivial `hdr-pq` and `hdr-image-only` tests with two consolidated, time-windowed regression suites that exercise the full HDR pipeline. These goldens are the safety net for every other PR in this stack. ## Why The pre-existing HDR tests covered only a single full-bleed video or image with a static text label — none of the features that the HDR pipeline has to handle differently from SDR (opacity animation, z-ordered multi-layer compositing, transforms, border-radius clipping, shader transitions, multiple HDR sources, object-fit modes, mixed HDR+SDR layering, HLG transfer). This PR builds the missing safety net first so every subsequent fix can be proven correct. ## What changed - New `packages/producer/tests/hdr-regression/` (PQ, BT.2020, ~20 s, 1080p, 8 windows A–H): - A: static baseline (HDR video + DOM overlay) - B: wrapper-opacity fade - C: direct-on-`<video>` opacity tween (documents the Chunk 1 bug) - D: z-order sandwich (DOM → HDR → DOM) - E: two HDR videos side-by-side (pins PR #289) - F: rotation + scale + border-radius (documents the Chunk 4 bug) - G: `object-fit: contain` - H: shader crossfade between HDR video and HDR image - New `packages/producer/tests/hdr-hlg-regression/` (HLG, ARIB STD-B67, ~5 s, 2 windows A–B) — exercises the separate HLG LUT/OETF code path that previously had **zero** coverage. - New `scripts/generate-hdr-photo-pq.py` synthesizes `hdr-photo-pq.png` with a cICP chunk for BT.2020/PQ/full. - Removed `tests/hdr-pq/` and `tests/hdr-image-only/`. - Updated `.github/workflows/regression.yml` HDR shard to run the new pair sequentially. - All compositions follow the documented timed-element pattern (`data-start`, `data-duration`, `class="clip"` directly on each timed leaf — no wrapper inheritance). ## Test plan - [x] Goldens generated with `bun run test:update --sequential`. - [x] `ffprobe` confirms HEVC/yuv420p10le/bt2020nc/smpte2084 (PQ) and arib-std-b67 (HLG). - [x] Suite green with `maxFrameFailures` budgets that absorb the documented Chunk 1 / Chunk 4 known-fails — tightened in follow-up PRs in this stack. ## Stack Foundational PR for the HDR follow-ups stack (Chunk 0 of `plans/hdr-followups.md`). Every subsequent PR builds on this safety net.
113 lines
2.8 KiB
HTML
113 lines
2.8 KiB
HTML
<!doctype html>
|
||
<html lang="en">
|
||
<head>
|
||
<meta charset="UTF-8" />
|
||
<title>HDR HLG Regression Suite</title>
|
||
<script src="https://cdn.jsdelivr.net/npm/gsap@3.14.2/dist/gsap.min.js"></script>
|
||
<style>
|
||
html,
|
||
body {
|
||
margin: 0;
|
||
padding: 0;
|
||
background: #000;
|
||
}
|
||
|
||
#main {
|
||
position: relative;
|
||
width: 1920px;
|
||
height: 1080px;
|
||
overflow: hidden;
|
||
background: #000;
|
||
}
|
||
|
||
.hdr-video {
|
||
position: absolute;
|
||
inset: 0;
|
||
width: 100%;
|
||
height: 100%;
|
||
object-fit: cover;
|
||
display: block;
|
||
}
|
||
|
||
.label {
|
||
position: absolute;
|
||
padding: 14px 22px;
|
||
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
|
||
font-size: 36px;
|
||
font-weight: 700;
|
||
color: #ffffff;
|
||
background: rgba(0, 0, 0, 0.6);
|
||
border-radius: 8px;
|
||
letter-spacing: 0.04em;
|
||
z-index: 100;
|
||
}
|
||
|
||
.label-tl {
|
||
top: 48px;
|
||
left: 64px;
|
||
}
|
||
|
||
/* Window B: opacity-tweenable wrapper around the HLG video */
|
||
#window-b-wrapper {
|
||
position: absolute;
|
||
inset: 0;
|
||
opacity: 1;
|
||
}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<div
|
||
id="main"
|
||
data-composition-id="hdr-hlg-regression"
|
||
data-start="0"
|
||
data-duration="5"
|
||
data-width="1920"
|
||
data-height="1080"
|
||
>
|
||
<!-- Window A · Static baseline HLG · 0.0–2.5s -->
|
||
<video
|
||
id="wa-video"
|
||
class="clip hdr-video"
|
||
data-start="0"
|
||
data-duration="2.5"
|
||
data-track-index="0"
|
||
src="hdr-hlg-clip.mp4"
|
||
muted
|
||
playsinline
|
||
></video>
|
||
<div class="label label-tl clip" data-start="0" data-duration="2.5">
|
||
A · HLG baseline + DOM overlay
|
||
</div>
|
||
|
||
<!-- Window B · Wrapper opacity fade on HLG · 2.5–5.0s -->
|
||
<div id="window-b-wrapper">
|
||
<video
|
||
id="wb-video"
|
||
class="clip hdr-video"
|
||
data-start="2.5"
|
||
data-duration="2.5"
|
||
data-track-index="0"
|
||
src="hdr-hlg-clip.mp4"
|
||
muted
|
||
playsinline
|
||
></video>
|
||
</div>
|
||
<div class="label label-tl clip" data-start="2.5" data-duration="2.5">
|
||
B · HLG wrapper opacity fade
|
||
</div>
|
||
</div>
|
||
|
||
<script>
|
||
window.__timelines = window.__timelines || {};
|
||
|
||
const tl = gsap.timeline({ paused: true });
|
||
|
||
// Window B · wrapper opacity 1 → 0.15 → 1 inside the 2.5s window
|
||
tl.to("#window-b-wrapper", { opacity: 0.15, duration: 1.0, ease: "power2.inOut" }, 2.75);
|
||
tl.to("#window-b-wrapper", { opacity: 1.0, duration: 1.0, ease: "power2.inOut" }, 3.75);
|
||
|
||
window.__timelines["hdr-hlg-regression"] = tl;
|
||
</script>
|
||
</body>
|
||
</html>
|