Hacktoberfest 2026:维护者为十月标记出来的 issue,仍然开放、适合新手。 浏览 Hacktoberfest issue

media-treatment: no canonical way to treat a frame that has no <img>/<video>

未关闭
#3,997 0 条评论 0 个 reaction 已指派 0 人 在 GitHub 查看

维护者通常 1 天内回复

还没有人认领这个 Issue。

评估

难度
5/5
预计耗时
一周以上
新手友好度
35/100
Issue 类型
功能
描述清晰度
需要澄清
活跃度
活跃
技术栈
css, html, typescript
领域
frontend, web-dev

调研方向

Start by running media-treatment --capabilities --json and reviewing the --selector behavior described in the issue. Read references/media-treatments.md and the media-use guidance before deciding which proposed target model is supported. Done means a canonical treatment path for code-drawn frames, or a documented recipe guaranteed to match the shader output.

由索引模型根据 Issue 内容生成。

描述

triage/needs-triage
What I'm trying to do

Apply the canonical finishing treatments — details.vignette, details.grain — to a code-drawn
frame
that contains no <img> or <video>.

Why it doesn't work today

media-treatment --capabilities --json on 0.8.41 reports:

"targetTags": ["img", "video"]

and --selector is documented as "Unique CSS selector for one <img> or <video>". The realtime
shader binds a texture from the media element, so there is nothing to attach a treatment to when the
frame is CSS/DOM — typography, an SVG chart, a drawn diagram, a solid colour field.

The media-use skill is explicit that recreating these in CSS is the wrong answer
(references/media-treatments.md): "Use the canonical details/effects fields for vignette,
grain, blur, pixelate, and related primitives. Do not duplicate them with CSS filters, SVG
turbulence, opacity, or decorative DOM overlays."
For a media-bearing frame, agreed and adopted.
For a frame with no media, there is no canonical path, so the only way to give a code-drawn scene
the same film grain and edge falloff as the shot next to it is the thing the skill tells us not to
do.

Concrete case

A composition whose scenes alternate between a full-bleed <video> and a code-drawn chart, both
wanting the same 0.18 grain and 0.3 vignette so the two read as one film. The video scene can have
it; the chart scene cannot, and matching it in CSS drifts from the shader's look (different noise
function, different falloff curve) and is invisible to Studio.

What would help

Any one of these, roughly in order of preference:

  1. media-treatment --selector accepting an ordinary element and treating its rendered subtree
    (html2canvas-style or a compositor pass) for the finishing family at least.
  2. A frame- or scene-level treatment target — a treatment declared once on .clip or on the
    composition, applied over everything inside it.
  3. A documented, blessed CSS recipe for details.vignette / details.grain that is guaranteed to
    match the shader's output, so recreating them in CSS stops being an anti-pattern for the one case
    where the shader cannot reach.
Environment

hyperframes 0.8.41, local render route, Chrome from hyperframes browser.

主要语言
TypeScript
星标
54.1k
派生
4.9k
平均合并
7 小时 18 分钟
30 天内合并 PR
784

环境准备

这个项目没有提供开发容器、Dockerfile 或贡献指南,环境需要你自己搭建:先看它的 README,通用步骤见我们的新手贡献指南。

从这里开始

  1. 先读完整个 Issue,再读项目的贡献指南。
  2. 在 Issue 下留言说明你要接手 —— 这能避免两个人做同样的事。
  3. Fork 仓库,在一个分支上完成修改。
  4. 提交 Pull Request,并在描述里引用这个 Issue 编号。

heygen-com/hyperframes 的其他 Issue

查看 heygen-com/hyperframes 的全部 Issue

相似的 Issue

更多 TypeScript Issue

把新 issue 发到你的邮箱

精选适合新手参与的 GitHub issue 摘要。