Bug: data-color-grading renders solid white (mp4) / black (prores) frames — any grading, 0.7.109 & 0.8.2 #3329

Activity

1. miguel-heygen commented on Aug 18, 2026

   

   miguel-heygen

   on Aug 18, 2026

   Last edited by miguel-heygen

   Collaborator

   More actions

   Thanks for the detailed matrix. We tried to reproduce this on current HyperFrames 0.8.3 using both GitHub-hosted macos-14 M1/arm64 and Linux. The ungraded control, adjustment-only grading, and Kuwahara grading all remained non-solid through runtime capture, raw frames, H.264 MP4, ProRes MOV, and HEVC. We therefore do not yet have a product RED or a first corrupt boundary to patch safely.

   Could you please attach or link the sanitized minimal tarball mentioned in the report, including the original frame.png, index.html after media-treatment --apply, and one failing output? If the source cannot be public, a newly generated minimal source with the same failure is enough.

   Please also retry once with npx hyperframes@0.8.3 and share:

   1. The exact render command and whether MP4, ProRes, or both still become solid.
   2. npx hyperframes@0.8.3 doctor --json output.
   3. ffmpeg -version output.
   4. Whether frame.png has alpha, an ICC profile, Display-P3/wide-gamut metadata, or unusual bit depth.
   5. One extracted failing frame and its SHA-256.

   We added a test-only macOS arm64 reproduction gate in draft PR #3330 so the issue can be pinned as soon as the missing source condition is identified. We will not invent a color-grading fix without a reproducing boundary.
2. xinzhuzi commented on Aug 19, 2026

   

   xinzhuzi

   on Aug 19, 2026

   Author

   More actions

   Update — narrowed down the trigger: it's not "any grading", it's grading on an element with a CSS entrance animation.

   Further bisection (same env: HY 0.7.109, chrome-headless-shell, macOS arm64):

   case	result
   single <img data-color-grading='{"adjust":{"exposure":0.2}}'>, no CSS animation	✅ renders correctly
   same element + the full default grading payload (tapeNoise/halftone/kuwahara non-zero), no CSS animation	✅ renders correctly
   same element + any grading + animation: hf-in .24s ease-out forwards (keyframes animating opacity: 0 → 1 + transform)	❌ solid white (mp4) / black (prores)
   original repro project (all graded elements carry an entrance-animation class)	❌ still reproduces today

   Minimal repro:

   <style>
   .clip { opacity: 0; animation: hf-in .24s ease-out forwards; }
   @keyframes hf-in { from { opacity: 0; transform: translate(-50%,-50%) scale(.96); } to { opacity: 1; transform: translate(-50%,-50%) scale(1); } }
   </style>
   <img data-color-grading='{"adjust":{"exposure":0.2}}' class="clip" src="frame.png" ...>

   Remove class="clip" (or the animation) and the same grading payload renders fine. Duration (1 frame vs 30) and the grading payload contents make no difference.

   Hypothesis: the grading capture pass reads the element at the animation's initial state (opacity 0 / mid-composite) and produces empty pixels for the graded layer.

   Workaround: don't put data-color-grading on elements that also carry a CSS entrance animation (apply grading to a wrapper, or drop the animation on graded elements).
3. miga-heygen

   added a commit that references this issue on Aug 28, 2026

   fix(core): read CSS animation opacity through color grading's own hide (

   ...

   e5c7dc7
4. miga-heygen

   closed this as completedin #3507on Aug 28, 2026