humanspeak / svelte-motion / 31634948315

65%

push

github

fix(optimized-appear): emit WAAPI entries for non-transform CSS properties (#466)

* fix(optimized-appear): emit WAAPI entries for non-transform CSS properties

createOptimizedAppearData previously only emitted appear entries for
opacity and the composite transform, so any other animatable CSS
property (filter, clipPath, backgroundColor, ...) declared in
initial/animate was dropped on the SSR appear path. The hidden value
got baked into the inline style and the visible value never reached a
compositor animation, leaving the property stuck at its hidden state
during the appear window (e.g. filter: blur(8px) never animates).

Iterate Object.keys(initial) after the existing opacity/transform
branches and emit one entry per animatable CSS property, skipping
transform channels (which collapse into the composite transform
entry), opacity, transform, and the SVG path-only key family. Extract
the first concrete scalar from each value so keyframe arrays still
work.

Widens the entry name type from 'opacity' | 'transform' to a string
union; the inline SSR bootstrap and the motion runtime's per-value
MotionHandoffAnimation bridge already accept arbitrary CSS property
names, so no downstream changes are required.

* test(optimized-appear): lock in filter appear keyframes, smoothness, and settle

Extends PR #466's coverage of the blur card: asserts the WAAPI payload
carries the exact blur keyframes, that at least one intermediate blur
frame renders (no snap), that blur never returns once sharp (no
post-handoff pop), and that the element settles sharp and fully opaque.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

* style(optimized-appear): wrap filter keyframes assertion per prettier

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

* docs(examples): add blur fade demo to optimized appear page

Second example (FIG-002) showing non-transform CSS properties riding the
SSR appear path: a BlurFade port with staggered filter blur(8px) →
blur(0px) entr... (continued)

898 of 1623 branches covered (55.33%)

Branch coverage included in aggregate %.

15 of 21 new or added lines in 1 file covered. (71.43%)

3311 of 5056 relevant lines covered (65.49%)

30.76 hits per line