ApricityUI Motion Regression
Transition + Animation Test Matrix
用途: 单页集中回归 transition / animation。页面本身是滚动列表，覆盖 class 切换、样式重算、布局变更、滤镜、透明度、延迟、方向、填充模式、暂停恢复和滚动中持续动画。
Auto: ON
Animations: RUN
Reset
Tick 0 | auto running
Transition Coverage
opacity
transform
background-color
border-color
width / height
margin / padding
filter
translateZ
delay
multi-property
rapid interrupt
Animation Coverage
name
duration
delay
iteration-count
direction
fill-mode
timing-function
play-state
finite / infinite
transform + opacity
filter pulse
Expected Checks
1. 自动切换时，过渡应平滑，不能残留幽灵帧。
2. Reset 后应回到初始状态，不应卡在中间样式。
3. 暂停动画时，transition 仍应继续工作。
4. 滚动到页面底部后，离屏动画回到视野时应继续正常。
5. delay / fill-mode 场景应能看出等待期和首尾帧差异。
Transition Cases
点击单个案例可手动切换；自动模式下脚本会轮流翻转这些案例。
T1. Basic opacity + scale + color
覆盖最常见的视觉过渡，检查 class 切换和回退。
basic
transition: opacity, transform, background-color, border-color
T2. Width + height + border-radius
覆盖布局型属性变化，观察 relayout 是否平滑且兄弟元素位置同步更新。
size
sibling
transition: width, height, border-radius, background-color
T3. Margin + padding + text indentation
覆盖盒模型变化，观察内容和兄弟项是否都按预期位移。
spacing
A
B
transition: margin-left, margin-right, padding-left, padding-right
T4. Delay and staggered properties
覆盖 delay，不同属性分开开始和结束。
delay
transition includes opacity / transform / background-color with different delays
T5. Filter + opacity
覆盖过滤效果，检查 filter 缓存和透明度联动。
filter
transition: filter, opacity, transform
T6. translateZ + overlay ordering
覆盖层叠上下文和位移深度；激活后金色块应压住底板。
z-lift
base
transition: transform with translateZ
T7. Rapid interrupt / reverse
脚本会快速反复切换，检查中断中的反向过渡是否平滑。
rapid
transition: transform, opacity, background-color | toggled at high frequency
Animation Cases
这些案例持续运行或由工具栏统一暂停/恢复，用于观察 animation 的时间轴行为。
A1. Infinite alternate bounce
覆盖 animation-iteration-count: infinite, direction: alternate。
bounce
name bounce | duration 1200ms | ease-in-out | alternate | infinite
A2. Linear spin
覆盖恒定速率旋转，检查长时间播放稳定性。
spin
name spin | duration 1800ms | linear | infinite
A3. Finite pulse with forwards fill
结束后应停在最终帧，Reset 时重新开始。
finite
iteration-count 3 | fill-mode forwards | transform + opacity
A4. Delayed reveal with backwards fill
延迟期应先显示起始帧样式，然后再进入动画。
delay
delay 900ms | fill-mode backwards | single run
A5. Reverse direction
覆盖 animation-direction: reverse。
reverse
reverse | infinite | transform + hue style change
A6. Alternate-reverse finite
覆盖 alternate-reverse 与有限次数组合。
alt-rev
alternate-reverse | 4 iterations | ease-in-out | both
A7. Filter pulse
覆盖 animation 驱动的 filter / opacity 变化。
glow
brightness / opacity pulse
A8. Scroll persistence band
离屏后再回来应继续运行，不应冻结或重置到错误帧。
1
2
3
4
5
6
7
8
longer list for scroll + repeated animation instances
Manual Notes
建议实际检查: 先观察自动轮播一轮，再关闭 Auto 手动点每个 transition 案例，然后暂停/恢复动画并滚到最底部再回来。