WPT
wpt / scroll-animations / css / view-timeline-shorthand.html
Spec: Scroll-driven Animations ↗
Runs: Chrome 155.0.8041.0 (wpt@a1690333b, 2026-09-04) | Firefox 157.0a1 (wpt@a1690333b, 2026-09-04) | Safari 251 preview (wpt@a1e944e7a, 2026-09-04) | Ladybird 1.0-a7825 (wpt@9298d21d2, 2026-09-04) | Servo Servo 0.6 (wpt@7e3d005d7, 2026-09-03) | Blitz a50cb8971 (wpt@a95401e4e, 2026-09-03)
View on the Blitz WPT dashboard | Open test on wpt.live | wpt.fyi
| Chrome | Firefox | Safari | Ladybird | Servo | Blitz | |
|---|---|---|---|---|---|---|
| Total | 84/84 | 84/84 | 84/84 | 84/84 | 15/84 | NOT RUN |
| Subtest | Chrome | Firefox | Safari | Ladybird | Servo | Blitz |
|---|---|---|---|---|---|---|
| e.style['view-timeline'] = "--abcd" should set the property value | PASS | PASS | PASS | PASS | FAIL | — |
| e.style['view-timeline'] = "none block" should set the property value | PASS | PASS | PASS | PASS | FAIL | — |
| e.style['view-timeline'] = "none inline" should set the property value | PASS | PASS | PASS | PASS | FAIL | — |
| e.style['view-timeline'] = "--inline block" should set the property value | PASS | PASS | PASS | PASS | FAIL | — |
| e.style['view-timeline'] = "--block block" should set the property value | PASS | PASS | PASS | PASS | FAIL | — |
| e.style['view-timeline'] = "--y block" should set the property value | PASS | PASS | PASS | PASS | FAIL | — |
| e.style['view-timeline'] = "--x block" should set the property value | PASS | PASS | PASS | PASS | FAIL | — |
| e.style['view-timeline'] = "--a, --b, --c" should set the property value | PASS | PASS | PASS | PASS | FAIL | — |
| e.style['view-timeline'] = "--a inline, --b block, --c y" should set the property value | PASS | PASS | PASS | PASS | FAIL | — |
| e.style['view-timeline'] = "--auto" should set the property value | PASS | PASS | PASS | PASS | FAIL | — |
| e.style['view-timeline'] = "--abcd block auto" should set the property value | PASS | PASS | PASS | PASS | FAIL | — |
| e.style['view-timeline'] = "--abcd block auto auto" should set the property value | PASS | PASS | PASS | PASS | FAIL | — |
| e.style['view-timeline'] = "--abcd block 1px 2px" should set the property value | PASS | PASS | PASS | PASS | FAIL | — |
| e.style['view-timeline'] = "--abcd inline 1px 2px" should set the property value | PASS | PASS | PASS | PASS | FAIL | — |
| e.style['view-timeline'] = "--abcd 1px 2px inline" should set the property value | PASS | PASS | PASS | PASS | FAIL | — |
| e.style['view-timeline'] = "--abcd 1px 2px block" should set the property value | PASS | PASS | PASS | PASS | FAIL | — |
| e.style['view-timeline'] = "--abcd auto auto block" should set the property value | PASS | PASS | PASS | PASS | FAIL | — |
| e.style['view-timeline'] = "--abcd auto block" should set the property value | PASS | PASS | PASS | PASS | FAIL | — |
| e.style['view-timeline'] = "--abcd block 1px 1px" should set the property value | PASS | PASS | PASS | PASS | FAIL | — |
| e.style['view-timeline'] = "--abc --abc" should not set the property value | PASS | PASS | PASS | PASS | PASS | — |
| e.style['view-timeline'] = "block none" should not set the property value | PASS | PASS | PASS | PASS | PASS | — |
| e.style['view-timeline'] = "none none" should not set the property value | PASS | PASS | PASS | PASS | PASS | — |
| e.style['view-timeline'] = "default" should not set the property value | PASS | PASS | PASS | PASS | PASS | — |
| e.style['view-timeline'] = "," should not set the property value | PASS | PASS | PASS | PASS | PASS | — |
| e.style['view-timeline'] = ",,--block,," should not set the property value | PASS | PASS | PASS | PASS | PASS | — |
| e.style['view-timeline'] = "auto" should not set the property value | PASS | PASS | PASS | PASS | PASS | — |
| e.style['view-timeline'] = "auto auto" should not set the property value | PASS | PASS | PASS | PASS | PASS | — |
| e.style['view-timeline'] = "--abc 500kg" should not set the property value | PASS | PASS | PASS | PASS | PASS | — |
| e.style['view-timeline'] = "--abc #ff0000" should not set the property value | PASS | PASS | PASS | PASS | PASS | — |
| e.style['view-timeline'] = "--abc red red" should not set the property value | PASS | PASS | PASS | PASS | PASS | — |
| Property view-timeline value '--abcd' | PASS | PASS | PASS | PASS | FAIL | — |
| Property view-timeline value 'none block' | PASS | PASS | PASS | PASS | FAIL | — |
| Property view-timeline value 'none inline' | PASS | PASS | PASS | PASS | FAIL | — |
| Property view-timeline value '--inline block' | PASS | PASS | PASS | PASS | FAIL | — |
| Property view-timeline value '--block block' | PASS | PASS | PASS | PASS | FAIL | — |
| Property view-timeline value '--y block' | PASS | PASS | PASS | PASS | FAIL | — |
| Property view-timeline value '--x block' | PASS | PASS | PASS | PASS | FAIL | — |
| Property view-timeline value '--a, --b, --c' | PASS | PASS | PASS | PASS | FAIL | — |
| Property view-timeline value '--a inline, --b block, --c y' | PASS | PASS | PASS | PASS | FAIL | — |
| Property view-timeline value '--abcd block auto' | PASS | PASS | PASS | PASS | FAIL | — |
| Property view-timeline value '--abcd block auto auto' | PASS | PASS | PASS | PASS | FAIL | — |
| Property view-timeline value '--abcd block 1px 2px' | PASS | PASS | PASS | PASS | FAIL | — |
| Property view-timeline value '--abcd inline 1px 2px' | PASS | PASS | PASS | PASS | FAIL | — |
| Property view-timeline value '--abcd 1px 2px inline' | PASS | PASS | PASS | PASS | FAIL | — |
| Property view-timeline value '--abcd 1px 2px block' | PASS | PASS | PASS | PASS | FAIL | — |
| Property view-timeline value '--abcd auto auto block' | PASS | PASS | PASS | PASS | FAIL | — |
| Property view-timeline value '--abcd auto block' | PASS | PASS | PASS | PASS | FAIL | — |
| Property view-timeline value '--abcd block 1px 1px' | PASS | PASS | PASS | PASS | FAIL | — |
| e.style['view-timeline'] = "--abc y" should set view-timeline-axis | PASS | PASS | PASS | PASS | FAIL | — |
| e.style['view-timeline'] = "--abc y" should set view-timeline-inset | PASS | PASS | PASS | PASS | FAIL | — |
| e.style['view-timeline'] = "--abc y" should set view-timeline-name | PASS | PASS | PASS | PASS | FAIL | — |
| e.style['view-timeline'] = "--abc y" should not set unrelated longhands | PASS | PASS | PASS | PASS | FAIL | — |
| e.style['view-timeline'] = "--abc y, --def" should set view-timeline-axis | PASS | PASS | PASS | PASS | FAIL | — |
| e.style['view-timeline'] = "--abc y, --def" should set view-timeline-inset | PASS | PASS | PASS | PASS | FAIL | — |
| e.style['view-timeline'] = "--abc y, --def" should set view-timeline-name | PASS | PASS | PASS | PASS | FAIL | — |
| e.style['view-timeline'] = "--abc y, --def" should not set unrelated longhands | PASS | PASS | PASS | PASS | FAIL | — |
| e.style['view-timeline'] = "--abc, --def" should set view-timeline-axis | PASS | PASS | PASS | PASS | FAIL | — |
| e.style['view-timeline'] = "--abc, --def" should set view-timeline-inset | PASS | PASS | PASS | PASS | FAIL | — |
| e.style['view-timeline'] = "--abc, --def" should set view-timeline-name | PASS | PASS | PASS | PASS | FAIL | — |
| e.style['view-timeline'] = "--abc, --def" should not set unrelated longhands | PASS | PASS | PASS | PASS | FAIL | — |
| e.style['view-timeline'] = "--inline x" should set view-timeline-axis | PASS | PASS | PASS | PASS | FAIL | — |
| e.style['view-timeline'] = "--inline x" should set view-timeline-inset | PASS | PASS | PASS | PASS | FAIL | — |
| e.style['view-timeline'] = "--inline x" should set view-timeline-name | PASS | PASS | PASS | PASS | FAIL | — |
| e.style['view-timeline'] = "--inline x" should not set unrelated longhands | PASS | PASS | PASS | PASS | FAIL | — |
| e.style['view-timeline'] = "--abc 1px 2px" should set view-timeline-axis | PASS | PASS | PASS | PASS | FAIL | — |
| e.style['view-timeline'] = "--abc 1px 2px" should set view-timeline-inset | PASS | PASS | PASS | PASS | FAIL | — |
| e.style['view-timeline'] = "--abc 1px 2px" should set view-timeline-name | PASS | PASS | PASS | PASS | FAIL | — |
| e.style['view-timeline'] = "--abc 1px 2px" should not set unrelated longhands | PASS | PASS | PASS | PASS | FAIL | — |
| e.style['view-timeline'] = "--abc 1px" should set view-timeline-axis | PASS | PASS | PASS | PASS | FAIL | — |
| e.style['view-timeline'] = "--abc 1px" should set view-timeline-inset | PASS | PASS | PASS | PASS | FAIL | — |
| e.style['view-timeline'] = "--abc 1px" should set view-timeline-name | PASS | PASS | PASS | PASS | FAIL | — |
| e.style['view-timeline'] = "--abc 1px" should not set unrelated longhands | PASS | PASS | PASS | PASS | FAIL | — |
| e.style['view-timeline'] = "--abc 1px inline" should set view-timeline-axis | PASS | PASS | PASS | PASS | FAIL | — |
| e.style['view-timeline'] = "--abc 1px inline" should set view-timeline-inset | PASS | PASS | PASS | PASS | FAIL | — |
| e.style['view-timeline'] = "--abc 1px inline" should set view-timeline-name | PASS | PASS | PASS | PASS | FAIL | — |
| e.style['view-timeline'] = "--abc 1px inline" should not set unrelated longhands | PASS | PASS | PASS | PASS | FAIL | — |
| Shorthand contraction of view-timeline-name:--abc:undefined;view-timeline-axis:inline:undefined;view-timeline-inset:auto:undefined | PASS | PASS | PASS | PASS | FAIL | — |
| Shorthand contraction of view-timeline-name:--a, --b:undefined;view-timeline-axis:inline, block:undefined;view-timeline-inset:auto, auto:undefined | PASS | PASS | PASS | PASS | FAIL | — |
| Shorthand contraction of view-timeline-name:--a, --b:undefined;view-timeline-axis:inline, block:undefined;view-timeline-inset:1px 2px, 3px 3px:undefined | PASS | PASS | PASS | PASS | FAIL | — |
| Shorthand contraction of view-timeline-name:none, none:undefined;view-timeline-axis:block, block:undefined;view-timeline-inset:auto auto, auto:undefined | PASS | PASS | PASS | PASS | FAIL | — |
| Shorthand contraction of view-timeline-name:--a, --b, --c:undefined;view-timeline-axis:inline, inline:undefined;view-timeline-inset:auto, auto:undefined | PASS | PASS | PASS | PASS | PASS | — |
| Shorthand contraction of view-timeline-name:--a, --b, --c, --d, --e, --f:undefined;view-timeline-axis:inline, x:undefined;view-timeline-inset:auto, 1px:undefined | PASS | PASS | PASS | PASS | PASS | — |
| Shorthand contraction of view-timeline-name:--a, --b:undefined;view-timeline-axis:inline, inline, inline:undefined;view-timeline-inset:auto, auto, auto:undefined | PASS | PASS | PASS | PASS | PASS | — |
| Shorthand contraction of view-timeline-name:--a, --b:undefined;view-timeline-axis:inline, inline:undefined;view-timeline-inset:auto, auto, auto:undefined | PASS | PASS | PASS | PASS | PASS | — |