Hacktoberfest 2026: los issues que los mantenedores marcaron para octubre, abiertos y aptos para principiantes. Explorar issues de Hacktoberfest

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

Abierto
#3,997 0 comentarios 0 reacciones 0 asignados Ver en GitHub

Los mantenedores suelen responder en 1 día

Nadie ha tomado este issue todavía.

Evaluación

Dificultad
5/5
Tiempo estimado
Más de una semana
Aptitud para principiantes
35/100
Tipo de issue
Nueva funcionalidad
Claridad
Necesita aclaración
Estado de actividad
Activo
Stack tecnológico
css, html, typescript
Área
frontend, web-dev

Línea de trabajo

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.

Escrito por el modelo de indexación a partir del texto del issue.

Descripción

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.

Lenguaje dominante
TypeScript
Estrellas
54.1k
Forks
4.9k
Merge medio
7 h 2 min
PR fusionados (30 d)
782

Preparar el entorno

Este proyecto no incluye contenedor de desarrollo, Dockerfile ni guía de contribución, así que la configuración corre por tu cuenta: empieza por su README y consulta nuestra guía para la primera contribución para los pasos generales.

Primeros pasos

  1. Lee el issue completo y luego la guía de contribución del proyecto.
  2. Comenta en el issue que vas a ocuparte — evita que dos personas hagan lo mismo.
  3. Haz un fork del repositorio y trabaja en una rama.
  4. Abre un pull request que haga referencia al número del issue.

Más de heygen-com/hyperframes

Todos los issues de heygen-com/hyperframes

Issues similares

Más issues de TypeScript

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.