feat(lint): add rules for non-deterministic code, missing clip class, overlapping tracks, and rAF detection

[miguel-heygen]

Summary

Adds 4 new lint rules found missing during comprehensive E2E testing:

• non_deterministic_code (error) — detects Math.random(), Date.now(), new Date(), performance.now(), crypto.getRandomValues() in scripts. Confirmed: two renders with Math.random() produced different checksums.
• timed_element_missing_clip_class (warning) — flags elements with data-start/data-duration but no class="clip". Without it, elements are visible forever instead of only during their time window.
• overlapping_clips_same_track (error) — detects clips on the same data-track-index with overlapping time ranges.
• requestanimationframe_in_composition (warning) — warns that rAF-based animations don't sync with frame capture. Discovered when Vivus.js (rAF-based) produced incorrect output.

12 new tests, all passing.

Part 1 of 5 in a stacked PR series fixing E2E test findings.

Test plan

• 12 new tests (3 per rule: positive, negative, edge case)
• Full suite: 56 pass in rule tests
• npx tsx scripts/lint-skills.ts — no issues

[miguel-heygen]

• feat(engine): add experimental canvas renderer using drawElementImage API #198
• fix(templates): resolve all lint errors and warnings in bundled templates #197
• feat(fonts): add Playfair Display, Noto Sans JP, Roboto, and 4 more to deterministic font database #196
• fix(engine): suppress font-loading 404 noise in render console output #195
• fix(cli): read actual composition dimensions in info and fix semver update check #194
• feat(lint): add rules for non-deterministic code, missing clip class, overlapping tracks, and rAF detection #193 👈 (View in Graphite)
• main

This stack of pull requests is managed by Graphite. Learn more about stacking.

[jrusso1020]

@miguel-heygen should we make these warnings?
non_deterministic_code (error) — detects Math.random(), Date.now(), new Date(), performance.now(), crypto.getRandomValues() in scripts. Confirmed: two renders with Math.random() produced different checksums.

I think there are potential use cases for some simulations to use thse but yes they will not produce the exact same output

unless we seed the RNG ?

[jrusso1020]

requestanimationframe_in_composition (warning) — warns that rAF-based animations don't sync with frame capture. Discovered when Vivus.js (rAF-based) produced incorrect output.

what does this mean exactly?

[miguel-heygen]

requestanimationframe_in_composition (warning) — warns that rAF-based animations don't sync with frame capture. Discovered when Vivus.js (rAF-based) produced incorrect output.

what does this mean exactly?

requestAnimationFrame (raf) doesn't work well with the renderer using vivus.js library

[miguel-heygen]

@miguel-heygen should we make these warnings?
non_deterministic_code (error) — detects Math.random(), Date.now(), new Date(), performance.now(), crypto.getRandomValues() in scripts. Confirmed: two renders with Math.random() produced different checksums.

I think there are potential use cases for some simulations to use thse but yes they will not produce the exact same output

unless we seed the RNG ?

with a seed it's fully deterministic, in my opinion we should make these errors because they can produce unexpected outputs that we can't control with the runtime code in certain cases

[vanceingalls]

Review feedback

Important: Non-null assertions
packages/core/src/lint/rules/composition.ts uses clips[i]! and clips[i + 1]! in the overlap rule. Project convention forbids ! assertions — use a guard like if (!current || !next) continue; instead.

Important: Block comment false positives
The comment stripping in non_deterministic_code and requestanimationframe_in_composition only strips // ... single-line comments. Multi-line /* Math.random() */ will still trigger false positives. Fix:

const stripped = script.content
  .replace(/\/\/.*$/gm, "")
  .replace(/\/\*[\s\S]*?\*\//g, "");

Note: Rule overlap
The new timed_element_missing_clip_class (warning) overlaps with the existing timed_element_missing_visibility_hidden (info). A single element could trigger both with slightly contradictory messaging. Consider merging or gating the older rule.

Tests look solid — 3 per rule with positive/negative/edge cases.

[miguel-heygen]

All three review items addressed:

1. Non-null assertions: Replaced clips[i]! and clips[i + 1]! with a guard clause (if (!current || !next) continue;) per project convention.

2. Block comment false positives: Added /\*[\s\S]*?\*\/ stripping alongside the existing single-line comment strip in both non_deterministic_code and requestanimationframe_in_composition rules.

3. Rule overlap with timed_element_missing_visibility_hidden: Noted. The existing rule is info severity and suggests opacity:0 or visibility:hidden as alternatives. The new timed_element_missing_clip_class is warning severity and specifically recommends class="clip" which is the canonical approach. They can coexist since they serve different purposes (general hidden state vs framework-specific visibility control). Happy to gate the older rule if you prefer.

All 56 rule tests still passing.