ext/hyperframes
2
0
Fork 0
mirror of https://github.com/heygen-com/hyperframes.git synced 2026-09-03 04:38:33 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(lint): exclude gsap.fromTo() from gsap_from_opacity_noop rule

Browse Source 
gsap.fromTo(target, fromVars, toVars) animates to toVars, not to
the current CSS value — so fromTo({opacity:0}, {opacity:1}) with
CSS opacity:0 is a legitimate 0→1 fade-in, not a noop. The rule
was false-positiving on these calls with error severity, which
would block the render pipeline.

Drop the fromTo branch from the trigger guard and add a test case
that proves fromTo does not fire.
This commit is contained in:
Miguel Ángel
2026-05-21 14:10:57 -04:00
parent 9e51f5cfaa
commit ee8dacab1e
2 changed files with 19 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/core/src/lint/rules/gsap.test.ts
+18
View File
@@ -806,6 +806,24 @@ describe("GSAP rules", () => {
expect(finding).toBeUndefined();
});
it("does NOT error when gsap.fromTo({opacity:0}, {opacity:1}) — destination overrides CSS", () => {
const html = `
<html><body>
<div data-composition-id="c1" data-width="1920" data-height="1080">
<div id="title" style="opacity: 0; font-size: 120px;">Hello</div>
</div>
<script>
window.__timelines = window.__timelines || {};
const tl = gsap.timeline({ paused: true });
tl.fromTo("#title", { opacity: 0, y: 30 }, { opacity: 1, y: 0, duration: 0.5 }, 0.2);
window.__timelines["c1"] = tl;
</script>
</body></html>`;
const result = lintHyperframeHtml(html);
const finding = result.findings.find((f) => f.code === "gsap_from_opacity_noop");
expect(finding).toBeUndefined();
});
it("does NOT error when gsap.to() uses opacity:0 (exit animation)", () => {
const html = `
<html><body>
packages/core/src/lint/rules/gsap.ts
+1 -1
View File
@@ -875,7 +875,7 @@ export const gsapRules: Array<(ctx: LintContext) => HyperframeLintFinding[]> = [
const windows = extractGsapWindows(script.content);
for (const win of windows) {
if (win.method !== "from" && win.method !== "fromTo") continue;
if (win.method !== "from") continue;
if (!win.properties.includes("opacity")) continue;
const sel = win.targetSelector;
const cssKey = sel.startsWith("#") || sel.startsWith(".") ? sel : `#${sel}`;