mirrors/ladybird
0
0
Fork 0
mirror of https://github.com/LadybirdBrowser/ladybird.git synced 2025-08-26 12:17:52 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 9

LibWeb: Import tests related to CSSTransition

Browse source
This commit is contained in:
Callum Law 2025-08-13 23:38:10 +12:00 • committed by Sam Atkins
commit 589529e081
Notes: github-actions[bot] 2025-08-18 10:19:56 +00:00
20 changed files with 3235 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

11
Tests/LibWeb/Text/expected/wpt-import/css/css-transitions/CSSTransition-currentTime.tentative.txt Normal file
View file

@ -0,0 +1,11 @@
Harness status: OK
Found 5 tests
1 Pass
4 Fail
Pass currentTime can be used to seek a CSS transition
Fail Skipping forwards through transition
Fail Skipping backwards through transition
Fail Setting currentTime to null on a CSS transition throws
Fail Transition reversing behavior respects currentTime and uses the transition's current position.

7
Tests/LibWeb/Text/expected/wpt-import/css/css-transitions/CSSTransition-ready.tentative.txt Normal file
View file

@ -0,0 +1,7 @@
Harness status: OK
Found 2 tests
2 Fail
Fail ready promise is rejected when a transition is canceled by updating transition-property
Fail ready promise is rejected when a transition is canceled by changing the transition property to something not interpolable

11
Tests/LibWeb/Text/expected/wpt-import/css/css-transitions/CSSTransition-startTime.tentative.txt Normal file
View file

@ -0,0 +1,11 @@
Harness status: OK
Found 5 tests
3 Pass
2 Fail
Pass The start time of a newly-created transition is unresolved
Fail The start time of transitions is based on when they are generated
Pass The start time of a transition can be set
Pass The start time can be set to seek a transition
Fail Seeking a transition using start time dispatches transition events

6
Tests/LibWeb/Text/expected/wpt-import/css/css-transitions/animations/transition-timing-function.txt Normal file
View file

@ -0,0 +1,6 @@
Harness status: OK
Found 1 tests
1 Fail
Fail Ensure that transition easing functions are properly applied.

36
Tests/LibWeb/Text/expected/wpt-import/css/css-transitions/event-dispatch.tentative.txt Normal file
View file

@ -0,0 +1,36 @@
Harness status: OK
Found 30 tests
6 Pass
24 Fail
Pass Idle -> Pending or Before
Pass Idle -> Before
Fail Idle or Pending -> Active
Pass Idle or Pending -> After
Fail Before -> Idle (display: none)
Fail Before -> Idle (Animation.timeline = null)
Fail Before -> Active
Fail Before -> After
Fail Active -> Idle, no delay (display: none)
Fail Active -> Idle, no delay (Animation.timeline = null)
Fail Active -> Idle, with positive delay (display: none)
Fail Active -> Idle, with positive delay (Animation.timeline = null)
Fail Active -> Idle, with negative delay (display: none)
Fail Active -> Idle, with negative delay (Animation.timeline = null)
Fail Active -> Before
Fail Active -> After
Pass After -> Before
Pass After -> Active
Fail Calculating the interval start and end time with negative start delay.
Fail Calculating the interval start and end time with negative end delay.
Fail Call Animation.cancel after canceling transition.
Fail Restart transition after canceling transition immediately
Fail Call Animation.cancel after restarting transition immediately
Fail Set timeline and play transition after clear the timeline
Fail Set null target effect after canceling the transition
Fail Cancel the transition after clearing the target effect
Pass Cancel the transition after it finishes
Fail Replacing a running transition should get transitioncancel earlier than transitionrun and transitionstart
Fail Replacing two running transitions on the same target should get two transitioncancel events earlier than two transitionrun events, per transition generation
Fail Replacing a running transition and forcing to flush the style together should get the correct event order

6
Tests/LibWeb/Text/expected/wpt-import/css/css-transitions/inherit-height-transition.txt Normal file
View file

@ -0,0 +1,6 @@
Harness status: OK
Found 1 tests
1 Fail
Fail Transitioned height, explicitly inherited down two DOM levels, should inherit correctly

566
Tests/LibWeb/Text/expected/wpt-import/css/css-transitions/properties-value-001.txt Normal file
View file

@ -0,0 +1,566 @@
Harness status: OK
Found 560 tests
557 Pass
3 Fail
Pass background-color color(rgba) / values
Pass background-color color(rgba) / events
Pass background-position-x length(pt) / values
Pass background-position-x length(pt) / events
Pass background-position-x length(pc) / values
Pass background-position-x length(pc) / events
Pass background-position-x length(px) / values
Pass background-position-x length(px) / events
Pass background-position-x length(em) / values
Pass background-position-x length(em) / events
Pass background-position-x length(ex) / values
Pass background-position-x length(ex) / events
Pass background-position-x length(mm) / values
Pass background-position-x length(mm) / events
Pass background-position-x length(cm) / values
Pass background-position-x length(cm) / events
Pass background-position-x length(in) / values
Pass background-position-x length(in) / events
Pass background-position-x percentage(%) / values
Pass background-position-x percentage(%) / events
Pass border-top-width length(pt) / values
Pass border-top-width length(pt) / events
Pass border-top-width length(pc) / values
Pass border-top-width length(pc) / events
Pass border-top-width length(px) / values
Pass border-top-width length(px) / events
Pass border-top-width length(em) / values
Pass border-top-width length(em) / events
Pass border-top-width length(ex) / values
Pass border-top-width length(ex) / events
Pass border-top-width length(mm) / values
Pass border-top-width length(mm) / events
Pass border-top-width length(cm) / values
Pass border-top-width length(cm) / events
Pass border-top-width length(in) / values
Pass border-top-width length(in) / events
Pass border-right-width length(pt) / values
Pass border-right-width length(pt) / events
Pass border-right-width length(pc) / values
Pass border-right-width length(pc) / events
Pass border-right-width length(px) / values
Pass border-right-width length(px) / events
Pass border-right-width length(em) / values
Pass border-right-width length(em) / events
Pass border-right-width length(ex) / values
Pass border-right-width length(ex) / events
Pass border-right-width length(mm) / values
Pass border-right-width length(mm) / events
Pass border-right-width length(cm) / values
Pass border-right-width length(cm) / events
Pass border-right-width length(in) / values
Pass border-right-width length(in) / events
Pass border-bottom-width length(pt) / values
Pass border-bottom-width length(pt) / events
Pass border-bottom-width length(pc) / values
Pass border-bottom-width length(pc) / events
Pass border-bottom-width length(px) / values
Pass border-bottom-width length(px) / events
Pass border-bottom-width length(em) / values
Pass border-bottom-width length(em) / events
Pass border-bottom-width length(ex) / values
Pass border-bottom-width length(ex) / events
Pass border-bottom-width length(mm) / values
Pass border-bottom-width length(mm) / events
Pass border-bottom-width length(cm) / values
Pass border-bottom-width length(cm) / events
Pass border-bottom-width length(in) / values
Pass border-bottom-width length(in) / events
Pass border-left-width length(pt) / values
Pass border-left-width length(pt) / events
Pass border-left-width length(pc) / values
Pass border-left-width length(pc) / events
Pass border-left-width length(px) / values
Pass border-left-width length(px) / events
Pass border-left-width length(em) / values
Pass border-left-width length(em) / events
Pass border-left-width length(ex) / values
Pass border-left-width length(ex) / events
Pass border-left-width length(mm) / values
Pass border-left-width length(mm) / events
Pass border-left-width length(cm) / values
Pass border-left-width length(cm) / events
Pass border-left-width length(in) / values
Pass border-left-width length(in) / events
Pass border-top-color color(rgba) / values
Pass border-top-color color(rgba) / events
Pass border-right-color color(rgba) / values
Pass border-right-color color(rgba) / events
Pass border-bottom-color color(rgba) / values
Pass border-bottom-color color(rgba) / events
Pass border-left-color color(rgba) / values
Pass border-left-color color(rgba) / events
Pass padding-bottom length(pt) / values
Pass padding-bottom length(pt) / events
Pass padding-bottom length(pc) / values
Pass padding-bottom length(pc) / events
Pass padding-bottom length(px) / values
Pass padding-bottom length(px) / events
Pass padding-bottom length(em) / values
Pass padding-bottom length(em) / events
Pass padding-bottom length(ex) / values
Pass padding-bottom length(ex) / events
Pass padding-bottom length(mm) / values
Pass padding-bottom length(mm) / events
Pass padding-bottom length(cm) / values
Pass padding-bottom length(cm) / events
Pass padding-bottom length(in) / values
Pass padding-bottom length(in) / events
Pass padding-left length(pt) / values
Pass padding-left length(pt) / events
Pass padding-left length(pc) / values
Pass padding-left length(pc) / events
Pass padding-left length(px) / values
Pass padding-left length(px) / events
Pass padding-left length(em) / values
Pass padding-left length(em) / events
Pass padding-left length(ex) / values
Pass padding-left length(ex) / events
Pass padding-left length(mm) / values
Pass padding-left length(mm) / events
Pass padding-left length(cm) / values
Pass padding-left length(cm) / events
Pass padding-left length(in) / values
Pass padding-left length(in) / events
Pass padding-right length(pt) / values
Pass padding-right length(pt) / events
Pass padding-right length(pc) / values
Pass padding-right length(pc) / events
Pass padding-right length(px) / values
Pass padding-right length(px) / events
Pass padding-right length(em) / values
Pass padding-right length(em) / events
Pass padding-right length(ex) / values
Pass padding-right length(ex) / events
Pass padding-right length(mm) / values
Pass padding-right length(mm) / events
Pass padding-right length(cm) / values
Pass padding-right length(cm) / events
Pass padding-right length(in) / values
Pass padding-right length(in) / events
Pass padding-top length(pt) / values
Pass padding-top length(pt) / events
Pass padding-top length(pc) / values
Pass padding-top length(pc) / events
Pass padding-top length(px) / values
Pass padding-top length(px) / events
Pass padding-top length(em) / values
Pass padding-top length(em) / events
Pass padding-top length(ex) / values
Pass padding-top length(ex) / events
Pass padding-top length(mm) / values
Pass padding-top length(mm) / events
Pass padding-top length(cm) / values
Pass padding-top length(cm) / events
Pass padding-top length(in) / values
Pass padding-top length(in) / events
Pass margin-bottom length(pt) / values
Pass margin-bottom length(pt) / events
Pass margin-bottom length(pc) / values
Pass margin-bottom length(pc) / events
Pass margin-bottom length(px) / values
Pass margin-bottom length(px) / events
Pass margin-bottom length(em) / values
Pass margin-bottom length(em) / events
Pass margin-bottom length(ex) / values
Pass margin-bottom length(ex) / events
Pass margin-bottom length(mm) / values
Pass margin-bottom length(mm) / events
Pass margin-bottom length(cm) / values
Pass margin-bottom length(cm) / events
Pass margin-bottom length(in) / values
Pass margin-bottom length(in) / events
Pass margin-left length(pt) / values
Pass margin-left length(pt) / events
Pass margin-left length(pc) / values
Pass margin-left length(pc) / events
Pass margin-left length(px) / values
Pass margin-left length(px) / events
Pass margin-left length(em) / values
Pass margin-left length(em) / events
Pass margin-left length(ex) / values
Pass margin-left length(ex) / events
Pass margin-left length(mm) / values
Pass margin-left length(mm) / events
Pass margin-left length(cm) / values
Pass margin-left length(cm) / events
Pass margin-left length(in) / values
Pass margin-left length(in) / events
Pass margin-right length(pt) / values
Pass margin-right length(pt) / events
Pass margin-right length(pc) / values
Pass margin-right length(pc) / events
Pass margin-right length(px) / values
Pass margin-right length(px) / events
Pass margin-right length(em) / values
Pass margin-right length(em) / events
Pass margin-right length(ex) / values
Pass margin-right length(ex) / events
Pass margin-right length(mm) / values
Pass margin-right length(mm) / events
Pass margin-right length(cm) / values
Pass margin-right length(cm) / events
Pass margin-right length(in) / values
Pass margin-right length(in) / events
Pass margin-top length(pt) / values
Pass margin-top length(pt) / events
Pass margin-top length(pc) / values
Pass margin-top length(pc) / events
Pass margin-top length(px) / values
Pass margin-top length(px) / events
Pass margin-top length(em) / values
Pass margin-top length(em) / events
Pass margin-top length(ex) / values
Pass margin-top length(ex) / events
Pass margin-top length(mm) / values
Pass margin-top length(mm) / events
Pass margin-top length(cm) / values
Pass margin-top length(cm) / events
Pass margin-top length(in) / values
Pass margin-top length(in) / events
Pass height length(pt) / values
Pass height length(pt) / events
Pass height length(pc) / values
Pass height length(pc) / events
Pass height length(px) / values
Pass height length(px) / events
Pass height length(em) / values
Pass height length(em) / events
Pass height length(ex) / values
Pass height length(ex) / events
Pass height length(mm) / values
Pass height length(mm) / events
Pass height length(cm) / values
Pass height length(cm) / events
Pass height length(in) / values
Pass height length(in) / events
Pass height percentage(%) / values
Pass height percentage(%) / events
Pass width length(pt) / values
Pass width length(pt) / events
Pass width length(pc) / values
Pass width length(pc) / events
Pass width length(px) / values
Pass width length(px) / events
Pass width length(em) / values
Pass width length(em) / events
Pass width length(ex) / values
Pass width length(ex) / events
Pass width length(mm) / values
Pass width length(mm) / events
Pass width length(cm) / values
Pass width length(cm) / events
Pass width length(in) / values
Pass width length(in) / events
Pass width percentage(%) / values
Pass width percentage(%) / events
Pass min-height length(pt) / values
Pass min-height length(pt) / events
Pass min-height length(pc) / values
Pass min-height length(pc) / events
Pass min-height length(px) / values
Pass min-height length(px) / events
Pass min-height length(em) / values
Pass min-height length(em) / events
Pass min-height length(ex) / values
Pass min-height length(ex) / events
Pass min-height length(mm) / values
Pass min-height length(mm) / events
Pass min-height length(cm) / values
Pass min-height length(cm) / events
Pass min-height length(in) / values
Pass min-height length(in) / events
Pass min-height percentage(%) / values
Pass min-height percentage(%) / events
Pass min-width length(pt) / values
Pass min-width length(pt) / events
Pass min-width length(pc) / values
Pass min-width length(pc) / events
Pass min-width length(px) / values
Pass min-width length(px) / events
Pass min-width length(em) / values
Pass min-width length(em) / events
Pass min-width length(ex) / values
Pass min-width length(ex) / events
Pass min-width length(mm) / values
Pass min-width length(mm) / events
Pass min-width length(cm) / values
Pass min-width length(cm) / events
Pass min-width length(in) / values
Pass min-width length(in) / events
Pass min-width percentage(%) / values
Pass min-width percentage(%) / events
Pass max-height length(pt) / values
Pass max-height length(pt) / events
Pass max-height length(pc) / values
Pass max-height length(pc) / events
Pass max-height length(px) / values
Pass max-height length(px) / events
Pass max-height length(em) / values
Pass max-height length(em) / events
Pass max-height length(ex) / values
Pass max-height length(ex) / events
Pass max-height length(mm) / values
Pass max-height length(mm) / events
Pass max-height length(cm) / values
Pass max-height length(cm) / events
Pass max-height length(in) / values
Pass max-height length(in) / events
Pass max-height percentage(%) / values
Pass max-height percentage(%) / events
Pass max-width length(pt) / values
Pass max-width length(pt) / events
Pass max-width length(pc) / values
Pass max-width length(pc) / events
Pass max-width length(px) / values
Pass max-width length(px) / events
Pass max-width length(em) / values
Pass max-width length(em) / events
Pass max-width length(ex) / values
Pass max-width length(ex) / events
Pass max-width length(mm) / values
Pass max-width length(mm) / events
Pass max-width length(cm) / values
Pass max-width length(cm) / events
Pass max-width length(in) / values
Pass max-width length(in) / events
Pass max-width percentage(%) / values
Pass max-width percentage(%) / events
Pass top length(pt) / values
Pass top length(pt) / events
Pass top length(pc) / values
Pass top length(pc) / events
Pass top length(px) / values
Pass top length(px) / events
Pass top length(em) / values
Pass top length(em) / events
Pass top length(ex) / values
Pass top length(ex) / events
Pass top length(mm) / values
Pass top length(mm) / events
Pass top length(cm) / values
Pass top length(cm) / events
Pass top length(in) / values
Pass top length(in) / events
Pass top percentage(%) / values
Pass top percentage(%) / events
Pass right length(pt) / values
Pass right length(pt) / events
Pass right length(pc) / values
Pass right length(pc) / events
Pass right length(px) / values
Pass right length(px) / events
Pass right length(em) / values
Pass right length(em) / events
Pass right length(ex) / values
Pass right length(ex) / events
Pass right length(mm) / values
Pass right length(mm) / events
Pass right length(cm) / values
Pass right length(cm) / events
Pass right length(in) / values
Pass right length(in) / events
Pass right percentage(%) / values
Pass right percentage(%) / events
Pass bottom length(pt) / values
Pass bottom length(pt) / events
Pass bottom length(pc) / values
Pass bottom length(pc) / events
Pass bottom length(px) / values
Pass bottom length(px) / events
Pass bottom length(em) / values
Pass bottom length(em) / events
Pass bottom length(ex) / values
Pass bottom length(ex) / events
Pass bottom length(mm) / values
Pass bottom length(mm) / events
Pass bottom length(cm) / values
Pass bottom length(cm) / events
Pass bottom length(in) / values
Pass bottom length(in) / events
Pass bottom percentage(%) / values
Pass bottom percentage(%) / events
Pass left length(pt) / values
Pass left length(pt) / events
Pass left length(pc) / values
Pass left length(pc) / events
Pass left length(px) / values
Pass left length(px) / events
Pass left length(em) / values
Pass left length(em) / events
Pass left length(ex) / values
Pass left length(ex) / events
Pass left length(mm) / values
Pass left length(mm) / events
Pass left length(cm) / values
Pass left length(cm) / events
Pass left length(in) / values
Pass left length(in) / events
Pass left percentage(%) / values
Pass left percentage(%) / events
Pass color color(rgba) / values
Pass color color(rgba) / events
Pass font-size length(pt) / values
Pass font-size length(pt) / events
Pass font-size length(pc) / values
Pass font-size length(pc) / events
Pass font-size length(px) / values
Pass font-size length(px) / events
Pass font-size length(em) / values
Pass font-size length(em) / events
Pass font-size length(ex) / values
Pass font-size length(ex) / events
Pass font-size length(mm) / values
Pass font-size length(mm) / events
Pass font-size length(cm) / values
Pass font-size length(cm) / events
Pass font-size length(in) / values
Pass font-size length(in) / events
Pass font-size percentage(%) / values
Pass font-size percentage(%) / events
Pass font-weight font-weight(keyword) / values
Pass font-weight font-weight(keyword) / events
Pass font-weight font-weight(numeric) / values
Pass font-weight font-weight(numeric) / events
Pass line-height number(integer) / values
Pass line-height number(integer) / events
Pass line-height number(decimal) / values
Pass line-height number(decimal) / events
Pass line-height length(pt) / values
Pass line-height length(pt) / events
Pass line-height length(pc) / values
Pass line-height length(pc) / events
Pass line-height length(px) / values
Pass line-height length(px) / events
Pass line-height length(em) / values
Pass line-height length(em) / events
Pass line-height length(ex) / values
Pass line-height length(ex) / events
Pass line-height length(mm) / values
Pass line-height length(mm) / events
Pass line-height length(cm) / values
Pass line-height length(cm) / events
Pass line-height length(in) / values
Pass line-height length(in) / events
Pass line-height percentage(%) / values
Pass line-height percentage(%) / events
Pass letter-spacing length(pt) / values
Pass letter-spacing length(pt) / events
Pass letter-spacing length(pc) / values
Pass letter-spacing length(pc) / events
Pass letter-spacing length(px) / values
Pass letter-spacing length(px) / events
Pass letter-spacing length(em) / values
Pass letter-spacing length(em) / events
Pass letter-spacing length(ex) / values
Pass letter-spacing length(ex) / events
Pass letter-spacing length(mm) / values
Pass letter-spacing length(mm) / events
Pass letter-spacing length(cm) / values
Pass letter-spacing length(cm) / events
Pass letter-spacing length(in) / values
Pass letter-spacing length(in) / events
Pass word-spacing length(pt) / values
Pass word-spacing length(pt) / events
Pass word-spacing length(pc) / values
Pass word-spacing length(pc) / events
Pass word-spacing length(px) / values
Pass word-spacing length(px) / events
Pass word-spacing length(em) / values
Pass word-spacing length(em) / events
Pass word-spacing length(ex) / values
Pass word-spacing length(ex) / events
Pass word-spacing length(mm) / values
Pass word-spacing length(mm) / events
Pass word-spacing length(cm) / values
Pass word-spacing length(cm) / events
Pass word-spacing length(in) / values
Pass word-spacing length(in) / events
Pass word-spacing percentage(%) / values
Pass word-spacing percentage(%) / events
Pass text-indent length(pt) / values
Pass text-indent length(pt) / events
Pass text-indent length(pc) / values
Pass text-indent length(pc) / events
Pass text-indent length(px) / values
Pass text-indent length(px) / events
Pass text-indent length(em) / values
Pass text-indent length(em) / events
Pass text-indent length(ex) / values
Pass text-indent length(ex) / events
Pass text-indent length(mm) / values
Pass text-indent length(mm) / events
Pass text-indent length(cm) / values
Pass text-indent length(cm) / events
Pass text-indent length(in) / values
Pass text-indent length(in) / events
Pass text-indent percentage(%) / values
Pass text-indent percentage(%) / events
Pass text-shadow shadow(shadow) / values
Pass text-shadow shadow(shadow) / events
Pass outline-color color(rgba) / values
Pass outline-color color(rgba) / events
Pass outline-offset length(pt) / values
Pass outline-offset length(pt) / events
Pass outline-offset length(pc) / values
Pass outline-offset length(pc) / events
Pass outline-offset length(px) / values
Pass outline-offset length(px) / events
Pass outline-offset length(em) / values
Pass outline-offset length(em) / events
Pass outline-offset length(ex) / values
Pass outline-offset length(ex) / events
Pass outline-offset length(mm) / values
Pass outline-offset length(mm) / events
Pass outline-offset length(cm) / values
Pass outline-offset length(cm) / events
Pass outline-offset length(in) / values
Pass outline-offset length(in) / events
Pass outline-width length(pt) / values
Pass outline-width length(pt) / events
Pass outline-width length(pc) / values
Pass outline-width length(pc) / events
Pass outline-width length(px) / values
Pass outline-width length(px) / events
Pass outline-width length(em) / values
Pass outline-width length(em) / events
Pass outline-width length(ex) / values
Pass outline-width length(ex) / events
Pass outline-width length(mm) / values
Pass outline-width length(mm) / events
Pass outline-width length(cm) / values
Pass outline-width length(cm) / events
Pass outline-width length(in) / values
Pass outline-width length(in) / events
Pass clip rectangle(rectangle) / values
Pass clip rectangle(rectangle) / events
Pass vertical-align length(pt) / values
Pass vertical-align length(pt) / events
Pass vertical-align length(pc) / values
Pass vertical-align length(pc) / events
Pass vertical-align length(px) / values
Pass vertical-align length(px) / events
Pass vertical-align length(em) / values
Pass vertical-align length(em) / events
Pass vertical-align length(ex) / values
Pass vertical-align length(ex) / events
Pass vertical-align length(mm) / values
Pass vertical-align length(mm) / events
Pass vertical-align length(cm) / values
Pass vertical-align length(cm) / events
Pass vertical-align length(in) / values
Pass vertical-align length(in) / events
Pass vertical-align percentage(%) / values
Pass vertical-align percentage(%) / events
Pass opacity number[0,1](zero-to-one) / values
Pass opacity number[0,1](zero-to-one) / events
Fail visibility visibility(keyword) / values
Pass visibility visibility(keyword) / events
Fail z-index integer(integer) / values
Fail z-index integer(integer) / events

566
Tests/LibWeb/Text/expected/wpt-import/css/css-transitions/properties-value-inherit-001.txt Normal file
View file

@ -0,0 +1,566 @@
Harness status: OK
Found 560 tests
544 Pass
16 Fail
Pass background-color color(rgba) / values
Pass background-color color(rgba) / events
Fail background-position-x length(pt) / values
Fail background-position-x length(pt) / events
Fail background-position-x length(pc) / values
Fail background-position-x length(pc) / events
Pass background-position-x length(px) / values
Pass background-position-x length(px) / events
Fail background-position-x length(em) / values
Fail background-position-x length(em) / events
Fail background-position-x length(ex) / values
Fail background-position-x length(ex) / events
Fail background-position-x length(mm) / values
Fail background-position-x length(mm) / events
Fail background-position-x length(cm) / values
Fail background-position-x length(cm) / events
Fail background-position-x length(in) / values
Fail background-position-x length(in) / events
Pass background-position-x percentage(%) / values
Pass background-position-x percentage(%) / events
Pass border-top-width length(pt) / values
Pass border-top-width length(pt) / events
Pass border-top-width length(pc) / values
Pass border-top-width length(pc) / events
Pass border-top-width length(px) / values
Pass border-top-width length(px) / events
Pass border-top-width length(em) / values
Pass border-top-width length(em) / events
Pass border-top-width length(ex) / values
Pass border-top-width length(ex) / events
Pass border-top-width length(mm) / values
Pass border-top-width length(mm) / events
Pass border-top-width length(cm) / values
Pass border-top-width length(cm) / events
Pass border-top-width length(in) / values
Pass border-top-width length(in) / events
Pass border-right-width length(pt) / values
Pass border-right-width length(pt) / events
Pass border-right-width length(pc) / values
Pass border-right-width length(pc) / events
Pass border-right-width length(px) / values
Pass border-right-width length(px) / events
Pass border-right-width length(em) / values
Pass border-right-width length(em) / events
Pass border-right-width length(ex) / values
Pass border-right-width length(ex) / events
Pass border-right-width length(mm) / values
Pass border-right-width length(mm) / events
Pass border-right-width length(cm) / values
Pass border-right-width length(cm) / events
Pass border-right-width length(in) / values
Pass border-right-width length(in) / events
Pass border-bottom-width length(pt) / values
Pass border-bottom-width length(pt) / events
Pass border-bottom-width length(pc) / values
Pass border-bottom-width length(pc) / events
Pass border-bottom-width length(px) / values
Pass border-bottom-width length(px) / events
Pass border-bottom-width length(em) / values
Pass border-bottom-width length(em) / events
Pass border-bottom-width length(ex) / values
Pass border-bottom-width length(ex) / events
Pass border-bottom-width length(mm) / values
Pass border-bottom-width length(mm) / events
Pass border-bottom-width length(cm) / values
Pass border-bottom-width length(cm) / events
Pass border-bottom-width length(in) / values
Pass border-bottom-width length(in) / events
Pass border-left-width length(pt) / values
Pass border-left-width length(pt) / events
Pass border-left-width length(pc) / values
Pass border-left-width length(pc) / events
Pass border-left-width length(px) / values
Pass border-left-width length(px) / events
Pass border-left-width length(em) / values
Pass border-left-width length(em) / events
Pass border-left-width length(ex) / values
Pass border-left-width length(ex) / events
Pass border-left-width length(mm) / values
Pass border-left-width length(mm) / events
Pass border-left-width length(cm) / values
Pass border-left-width length(cm) / events
Pass border-left-width length(in) / values
Pass border-left-width length(in) / events
Pass border-top-color color(rgba) / values
Pass border-top-color color(rgba) / events
Pass border-right-color color(rgba) / values
Pass border-right-color color(rgba) / events
Pass border-bottom-color color(rgba) / values
Pass border-bottom-color color(rgba) / events
Pass border-left-color color(rgba) / values
Pass border-left-color color(rgba) / events
Pass padding-bottom length(pt) / values
Pass padding-bottom length(pt) / events
Pass padding-bottom length(pc) / values
Pass padding-bottom length(pc) / events
Pass padding-bottom length(px) / values
Pass padding-bottom length(px) / events
Pass padding-bottom length(em) / values
Pass padding-bottom length(em) / events
Pass padding-bottom length(ex) / values
Pass padding-bottom length(ex) / events
Pass padding-bottom length(mm) / values
Pass padding-bottom length(mm) / events
Pass padding-bottom length(cm) / values
Pass padding-bottom length(cm) / events
Pass padding-bottom length(in) / values
Pass padding-bottom length(in) / events
Pass padding-left length(pt) / values
Pass padding-left length(pt) / events
Pass padding-left length(pc) / values
Pass padding-left length(pc) / events
Pass padding-left length(px) / values
Pass padding-left length(px) / events
Pass padding-left length(em) / values
Pass padding-left length(em) / events
Pass padding-left length(ex) / values
Pass padding-left length(ex) / events
Pass padding-left length(mm) / values
Pass padding-left length(mm) / events
Pass padding-left length(cm) / values
Pass padding-left length(cm) / events
Pass padding-left length(in) / values
Pass padding-left length(in) / events
Pass padding-right length(pt) / values
Pass padding-right length(pt) / events
Pass padding-right length(pc) / values
Pass padding-right length(pc) / events
Pass padding-right length(px) / values
Pass padding-right length(px) / events
Pass padding-right length(em) / values
Pass padding-right length(em) / events
Pass padding-right length(ex) / values
Pass padding-right length(ex) / events
Pass padding-right length(mm) / values
Pass padding-right length(mm) / events
Pass padding-right length(cm) / values
Pass padding-right length(cm) / events
Pass padding-right length(in) / values
Pass padding-right length(in) / events
Pass padding-top length(pt) / values
Pass padding-top length(pt) / events
Pass padding-top length(pc) / values
Pass padding-top length(pc) / events
Pass padding-top length(px) / values
Pass padding-top length(px) / events
Pass padding-top length(em) / values
Pass padding-top length(em) / events
Pass padding-top length(ex) / values
Pass padding-top length(ex) / events
Pass padding-top length(mm) / values
Pass padding-top length(mm) / events
Pass padding-top length(cm) / values
Pass padding-top length(cm) / events
Pass padding-top length(in) / values
Pass padding-top length(in) / events
Pass margin-bottom length(pt) / values
Pass margin-bottom length(pt) / events
Pass margin-bottom length(pc) / values
Pass margin-bottom length(pc) / events
Pass margin-bottom length(px) / values
Pass margin-bottom length(px) / events
Pass margin-bottom length(em) / values
Pass margin-bottom length(em) / events
Pass margin-bottom length(ex) / values
Pass margin-bottom length(ex) / events
Pass margin-bottom length(mm) / values
Pass margin-bottom length(mm) / events
Pass margin-bottom length(cm) / values
Pass margin-bottom length(cm) / events
Pass margin-bottom length(in) / values
Pass margin-bottom length(in) / events
Pass margin-left length(pt) / values
Pass margin-left length(pt) / events
Pass margin-left length(pc) / values
Pass margin-left length(pc) / events
Pass margin-left length(px) / values
Pass margin-left length(px) / events
Pass margin-left length(em) / values
Pass margin-left length(em) / events
Pass margin-left length(ex) / values
Pass margin-left length(ex) / events
Pass margin-left length(mm) / values
Pass margin-left length(mm) / events
Pass margin-left length(cm) / values
Pass margin-left length(cm) / events
Pass margin-left length(in) / values
Pass margin-left length(in) / events
Pass margin-right length(pt) / values
Pass margin-right length(pt) / events
Pass margin-right length(pc) / values
Pass margin-right length(pc) / events
Pass margin-right length(px) / values
Pass margin-right length(px) / events
Pass margin-right length(em) / values
Pass margin-right length(em) / events
Pass margin-right length(ex) / values
Pass margin-right length(ex) / events
Pass margin-right length(mm) / values
Pass margin-right length(mm) / events
Pass margin-right length(cm) / values
Pass margin-right length(cm) / events
Pass margin-right length(in) / values
Pass margin-right length(in) / events
Pass margin-top length(pt) / values
Pass margin-top length(pt) / events
Pass margin-top length(pc) / values
Pass margin-top length(pc) / events
Pass margin-top length(px) / values
Pass margin-top length(px) / events
Pass margin-top length(em) / values
Pass margin-top length(em) / events
Pass margin-top length(ex) / values
Pass margin-top length(ex) / events
Pass margin-top length(mm) / values
Pass margin-top length(mm) / events
Pass margin-top length(cm) / values
Pass margin-top length(cm) / events
Pass margin-top length(in) / values
Pass margin-top length(in) / events
Pass height length(pt) / values
Pass height length(pt) / events
Pass height length(pc) / values
Pass height length(pc) / events
Pass height length(px) / values
Pass height length(px) / events
Pass height length(em) / values
Pass height length(em) / events
Pass height length(ex) / values
Pass height length(ex) / events
Pass height length(mm) / values
Pass height length(mm) / events
Pass height length(cm) / values
Pass height length(cm) / events
Pass height length(in) / values
Pass height length(in) / events
Pass height percentage(%) / values
Pass height percentage(%) / events
Pass width length(pt) / values
Pass width length(pt) / events
Pass width length(pc) / values
Pass width length(pc) / events
Pass width length(px) / values
Pass width length(px) / events
Pass width length(em) / values
Pass width length(em) / events
Pass width length(ex) / values
Pass width length(ex) / events
Pass width length(mm) / values
Pass width length(mm) / events
Pass width length(cm) / values
Pass width length(cm) / events
Pass width length(in) / values
Pass width length(in) / events
Pass width percentage(%) / values
Pass width percentage(%) / events
Pass min-height length(pt) / values
Pass min-height length(pt) / events
Pass min-height length(pc) / values
Pass min-height length(pc) / events
Pass min-height length(px) / values
Pass min-height length(px) / events
Pass min-height length(em) / values
Pass min-height length(em) / events
Pass min-height length(ex) / values
Pass min-height length(ex) / events
Pass min-height length(mm) / values
Pass min-height length(mm) / events
Pass min-height length(cm) / values
Pass min-height length(cm) / events
Pass min-height length(in) / values
Pass min-height length(in) / events
Pass min-height percentage(%) / values
Pass min-height percentage(%) / events
Pass min-width length(pt) / values
Pass min-width length(pt) / events
Pass min-width length(pc) / values
Pass min-width length(pc) / events
Pass min-width length(px) / values
Pass min-width length(px) / events
Pass min-width length(em) / values
Pass min-width length(em) / events
Pass min-width length(ex) / values
Pass min-width length(ex) / events
Pass min-width length(mm) / values
Pass min-width length(mm) / events
Pass min-width length(cm) / values
Pass min-width length(cm) / events
Pass min-width length(in) / values
Pass min-width length(in) / events
Pass min-width percentage(%) / values
Pass min-width percentage(%) / events
Pass max-height length(pt) / values
Pass max-height length(pt) / events
Pass max-height length(pc) / values
Pass max-height length(pc) / events
Pass max-height length(px) / values
Pass max-height length(px) / events
Pass max-height length(em) / values
Pass max-height length(em) / events
Pass max-height length(ex) / values
Pass max-height length(ex) / events
Pass max-height length(mm) / values
Pass max-height length(mm) / events
Pass max-height length(cm) / values
Pass max-height length(cm) / events
Pass max-height length(in) / values
Pass max-height length(in) / events
Pass max-height percentage(%) / values
Pass max-height percentage(%) / events
Pass max-width length(pt) / values
Pass max-width length(pt) / events
Pass max-width length(pc) / values
Pass max-width length(pc) / events
Pass max-width length(px) / values
Pass max-width length(px) / events
Pass max-width length(em) / values
Pass max-width length(em) / events
Pass max-width length(ex) / values
Pass max-width length(ex) / events
Pass max-width length(mm) / values
Pass max-width length(mm) / events
Pass max-width length(cm) / values
Pass max-width length(cm) / events
Pass max-width length(in) / values
Pass max-width length(in) / events
Pass max-width percentage(%) / values
Pass max-width percentage(%) / events
Pass top length(pt) / values
Pass top length(pt) / events
Pass top length(pc) / values
Pass top length(pc) / events
Pass top length(px) / values
Pass top length(px) / events
Pass top length(em) / values
Pass top length(em) / events
Pass top length(ex) / values
Pass top length(ex) / events
Pass top length(mm) / values
Pass top length(mm) / events
Pass top length(cm) / values
Pass top length(cm) / events
Pass top length(in) / values
Pass top length(in) / events
Pass top percentage(%) / values
Pass top percentage(%) / events
Pass right length(pt) / values
Pass right length(pt) / events
Pass right length(pc) / values
Pass right length(pc) / events
Pass right length(px) / values
Pass right length(px) / events
Pass right length(em) / values
Pass right length(em) / events
Pass right length(ex) / values
Pass right length(ex) / events
Pass right length(mm) / values
Pass right length(mm) / events
Pass right length(cm) / values
Pass right length(cm) / events
Pass right length(in) / values
Pass right length(in) / events
Pass right percentage(%) / values
Pass right percentage(%) / events
Pass bottom length(pt) / values
Pass bottom length(pt) / events
Pass bottom length(pc) / values
Pass bottom length(pc) / events
Pass bottom length(px) / values
Pass bottom length(px) / events
Pass bottom length(em) / values
Pass bottom length(em) / events
Pass bottom length(ex) / values
Pass bottom length(ex) / events
Pass bottom length(mm) / values
Pass bottom length(mm) / events
Pass bottom length(cm) / values
Pass bottom length(cm) / events
Pass bottom length(in) / values
Pass bottom length(in) / events
Pass bottom percentage(%) / values
Pass bottom percentage(%) / events
Pass left length(pt) / values
Pass left length(pt) / events
Pass left length(pc) / values
Pass left length(pc) / events
Pass left length(px) / values
Pass left length(px) / events
Pass left length(em) / values
Pass left length(em) / events
Pass left length(ex) / values
Pass left length(ex) / events
Pass left length(mm) / values
Pass left length(mm) / events
Pass left length(cm) / values
Pass left length(cm) / events
Pass left length(in) / values
Pass left length(in) / events
Pass left percentage(%) / values
Pass left percentage(%) / events
Pass color color(rgba) / values
Pass color color(rgba) / events
Pass font-size length(pt) / values
Pass font-size length(pt) / events
Pass font-size length(pc) / values
Pass font-size length(pc) / events
Pass font-size length(px) / values
Pass font-size length(px) / events
Pass font-size length(em) / values
Pass font-size length(em) / events
Pass font-size length(ex) / values
Pass font-size length(ex) / events
Pass font-size length(mm) / values
Pass font-size length(mm) / events
Pass font-size length(cm) / values
Pass font-size length(cm) / events
Pass font-size length(in) / values
Pass font-size length(in) / events
Pass font-size percentage(%) / values
Pass font-size percentage(%) / events
Pass font-weight font-weight(keyword) / values
Pass font-weight font-weight(keyword) / events
Pass font-weight font-weight(numeric) / values
Pass font-weight font-weight(numeric) / events
Pass line-height number(integer) / values
Pass line-height number(integer) / events
Pass line-height number(decimal) / values
Pass line-height number(decimal) / events
Pass line-height length(pt) / values
Pass line-height length(pt) / events
Pass line-height length(pc) / values
Pass line-height length(pc) / events
Pass line-height length(px) / values
Pass line-height length(px) / events
Pass line-height length(em) / values
Pass line-height length(em) / events
Pass line-height length(ex) / values
Pass line-height length(ex) / events
Pass line-height length(mm) / values
Pass line-height length(mm) / events
Pass line-height length(cm) / values
Pass line-height length(cm) / events
Pass line-height length(in) / values
Pass line-height length(in) / events
Pass line-height percentage(%) / values
Pass line-height percentage(%) / events
Pass letter-spacing length(pt) / values
Pass letter-spacing length(pt) / events
Pass letter-spacing length(pc) / values
Pass letter-spacing length(pc) / events
Pass letter-spacing length(px) / values
Pass letter-spacing length(px) / events
Pass letter-spacing length(em) / values
Pass letter-spacing length(em) / events
Pass letter-spacing length(ex) / values
Pass letter-spacing length(ex) / events
Pass letter-spacing length(mm) / values
Pass letter-spacing length(mm) / events
Pass letter-spacing length(cm) / values
Pass letter-spacing length(cm) / events
Pass letter-spacing length(in) / values
Pass letter-spacing length(in) / events
Pass word-spacing length(pt) / values
Pass word-spacing length(pt) / events
Pass word-spacing length(pc) / values
Pass word-spacing length(pc) / events
Pass word-spacing length(px) / values
Pass word-spacing length(px) / events
Pass word-spacing length(em) / values
Pass word-spacing length(em) / events
Pass word-spacing length(ex) / values
Pass word-spacing length(ex) / events
Pass word-spacing length(mm) / values
Pass word-spacing length(mm) / events
Pass word-spacing length(cm) / values
Pass word-spacing length(cm) / events
Pass word-spacing length(in) / values
Pass word-spacing length(in) / events
Pass word-spacing percentage(%) / values
Pass word-spacing percentage(%) / events
Pass text-indent length(pt) / values
Pass text-indent length(pt) / events
Pass text-indent length(pc) / values
Pass text-indent length(pc) / events
Pass text-indent length(px) / values
Pass text-indent length(px) / events
Pass text-indent length(em) / values
Pass text-indent length(em) / events
Pass text-indent length(ex) / values
Pass text-indent length(ex) / events
Pass text-indent length(mm) / values
Pass text-indent length(mm) / events
Pass text-indent length(cm) / values
Pass text-indent length(cm) / events
Pass text-indent length(in) / values
Pass text-indent length(in) / events
Pass text-indent percentage(%) / values
Pass text-indent percentage(%) / events
Pass text-shadow shadow(shadow) / values
Fail text-shadow shadow(shadow) / events
Pass outline-color color(rgba) / values
Pass outline-color color(rgba) / events
Pass outline-offset length(pt) / values
Pass outline-offset length(pt) / events
Pass outline-offset length(pc) / values
Pass outline-offset length(pc) / events
Pass outline-offset length(px) / values
Pass outline-offset length(px) / events
Pass outline-offset length(em) / values
Pass outline-offset length(em) / events
Pass outline-offset length(ex) / values
Pass outline-offset length(ex) / events
Pass outline-offset length(mm) / values
Pass outline-offset length(mm) / events
Pass outline-offset length(cm) / values
Pass outline-offset length(cm) / events
Pass outline-offset length(in) / values
Pass outline-offset length(in) / events
Pass outline-width length(pt) / values
Pass outline-width length(pt) / events
Pass outline-width length(pc) / values
Pass outline-width length(pc) / events
Pass outline-width length(px) / values
Pass outline-width length(px) / events
Pass outline-width length(em) / values
Pass outline-width length(em) / events
Pass outline-width length(ex) / values
Pass outline-width length(ex) / events
Pass outline-width length(mm) / values
Pass outline-width length(mm) / events
Pass outline-width length(cm) / values
Pass outline-width length(cm) / events
Pass outline-width length(in) / values
Pass outline-width length(in) / events
Pass clip rectangle(rectangle) / values
Pass clip rectangle(rectangle) / events
Pass vertical-align length(pt) / values
Pass vertical-align length(pt) / events
Pass vertical-align length(pc) / values
Pass vertical-align length(pc) / events
Pass vertical-align length(px) / values
Pass vertical-align length(px) / events
Pass vertical-align length(em) / values
Pass vertical-align length(em) / events
Pass vertical-align length(ex) / values
Pass vertical-align length(ex) / events
Pass vertical-align length(mm) / values
Pass vertical-align length(mm) / events
Pass vertical-align length(cm) / values
Pass vertical-align length(cm) / events
Pass vertical-align length(in) / values
Pass vertical-align length(in) / events
Pass vertical-align percentage(%) / values
Pass vertical-align percentage(%) / events
Pass opacity number[0,1](zero-to-one) / values
Pass opacity number[0,1](zero-to-one) / events
Fail visibility visibility(keyword) / values
Pass visibility visibility(keyword) / events
Pass z-index integer(integer) / values
Pass z-index integer(integer) / events

566
Tests/LibWeb/Text/expected/wpt-import/css/css-transitions/properties-value-inherit-002.txt Normal file
View file

@ -0,0 +1,566 @@
Harness status: OK
Found 560 tests
559 Pass
1 Fail
Pass background-color color(rgba) / values
Pass background-color color(rgba) / events
Pass background-position-x length(pt) / values
Pass background-position-x length(pt) / events
Pass background-position-x length(pc) / values
Pass background-position-x length(pc) / events
Pass background-position-x length(px) / values
Pass background-position-x length(px) / events
Pass background-position-x length(em) / values
Pass background-position-x length(em) / events
Pass background-position-x length(ex) / values
Pass background-position-x length(ex) / events
Pass background-position-x length(mm) / values
Pass background-position-x length(mm) / events
Pass background-position-x length(cm) / values
Pass background-position-x length(cm) / events
Pass background-position-x length(in) / values
Pass background-position-x length(in) / events
Pass background-position-x percentage(%) / values
Pass background-position-x percentage(%) / events
Pass border-top-width length(pt) / values
Pass border-top-width length(pt) / events
Pass border-top-width length(pc) / values
Pass border-top-width length(pc) / events
Pass border-top-width length(px) / values
Pass border-top-width length(px) / events
Pass border-top-width length(em) / values
Pass border-top-width length(em) / events
Pass border-top-width length(ex) / values
Pass border-top-width length(ex) / events
Pass border-top-width length(mm) / values
Pass border-top-width length(mm) / events
Pass border-top-width length(cm) / values
Pass border-top-width length(cm) / events
Pass border-top-width length(in) / values
Pass border-top-width length(in) / events
Pass border-right-width length(pt) / values
Pass border-right-width length(pt) / events
Pass border-right-width length(pc) / values
Pass border-right-width length(pc) / events
Pass border-right-width length(px) / values
Pass border-right-width length(px) / events
Pass border-right-width length(em) / values
Pass border-right-width length(em) / events
Pass border-right-width length(ex) / values
Pass border-right-width length(ex) / events
Pass border-right-width length(mm) / values
Pass border-right-width length(mm) / events
Pass border-right-width length(cm) / values
Pass border-right-width length(cm) / events
Pass border-right-width length(in) / values
Pass border-right-width length(in) / events
Pass border-bottom-width length(pt) / values
Pass border-bottom-width length(pt) / events
Pass border-bottom-width length(pc) / values
Pass border-bottom-width length(pc) / events
Pass border-bottom-width length(px) / values
Pass border-bottom-width length(px) / events
Pass border-bottom-width length(em) / values
Pass border-bottom-width length(em) / events
Pass border-bottom-width length(ex) / values
Pass border-bottom-width length(ex) / events
Pass border-bottom-width length(mm) / values
Pass border-bottom-width length(mm) / events
Pass border-bottom-width length(cm) / values
Pass border-bottom-width length(cm) / events
Pass border-bottom-width length(in) / values
Pass border-bottom-width length(in) / events
Pass border-left-width length(pt) / values
Pass border-left-width length(pt) / events
Pass border-left-width length(pc) / values
Pass border-left-width length(pc) / events
Pass border-left-width length(px) / values
Pass border-left-width length(px) / events
Pass border-left-width length(em) / values
Pass border-left-width length(em) / events
Pass border-left-width length(ex) / values
Pass border-left-width length(ex) / events
Pass border-left-width length(mm) / values
Pass border-left-width length(mm) / events
Pass border-left-width length(cm) / values
Pass border-left-width length(cm) / events
Pass border-left-width length(in) / values
Pass border-left-width length(in) / events
Pass border-top-color color(rgba) / values
Pass border-top-color color(rgba) / events
Pass border-right-color color(rgba) / values
Pass border-right-color color(rgba) / events
Pass border-bottom-color color(rgba) / values
Pass border-bottom-color color(rgba) / events
Pass border-left-color color(rgba) / values
Pass border-left-color color(rgba) / events
Pass padding-bottom length(pt) / values
Pass padding-bottom length(pt) / events
Pass padding-bottom length(pc) / values
Pass padding-bottom length(pc) / events
Pass padding-bottom length(px) / values
Pass padding-bottom length(px) / events
Pass padding-bottom length(em) / values
Pass padding-bottom length(em) / events
Pass padding-bottom length(ex) / values
Pass padding-bottom length(ex) / events
Pass padding-bottom length(mm) / values
Pass padding-bottom length(mm) / events
Pass padding-bottom length(cm) / values
Pass padding-bottom length(cm) / events
Pass padding-bottom length(in) / values
Pass padding-bottom length(in) / events
Pass padding-left length(pt) / values
Pass padding-left length(pt) / events
Pass padding-left length(pc) / values
Pass padding-left length(pc) / events
Pass padding-left length(px) / values
Pass padding-left length(px) / events
Pass padding-left length(em) / values
Pass padding-left length(em) / events
Pass padding-left length(ex) / values
Pass padding-left length(ex) / events
Pass padding-left length(mm) / values
Pass padding-left length(mm) / events
Pass padding-left length(cm) / values
Pass padding-left length(cm) / events
Pass padding-left length(in) / values
Pass padding-left length(in) / events
Pass padding-right length(pt) / values
Pass padding-right length(pt) / events
Pass padding-right length(pc) / values
Pass padding-right length(pc) / events
Pass padding-right length(px) / values
Pass padding-right length(px) / events
Pass padding-right length(em) / values
Pass padding-right length(em) / events
Pass padding-right length(ex) / values
Pass padding-right length(ex) / events
Pass padding-right length(mm) / values
Pass padding-right length(mm) / events
Pass padding-right length(cm) / values
Pass padding-right length(cm) / events
Pass padding-right length(in) / values
Pass padding-right length(in) / events
Pass padding-top length(pt) / values
Pass padding-top length(pt) / events
Pass padding-top length(pc) / values
Pass padding-top length(pc) / events
Pass padding-top length(px) / values
Pass padding-top length(px) / events
Pass padding-top length(em) / values
Pass padding-top length(em) / events
Pass padding-top length(ex) / values
Pass padding-top length(ex) / events
Pass padding-top length(mm) / values
Pass padding-top length(mm) / events
Pass padding-top length(cm) / values
Pass padding-top length(cm) / events
Pass padding-top length(in) / values
Pass padding-top length(in) / events
Pass margin-bottom length(pt) / values
Pass margin-bottom length(pt) / events
Pass margin-bottom length(pc) / values
Pass margin-bottom length(pc) / events
Pass margin-bottom length(px) / values
Pass margin-bottom length(px) / events
Pass margin-bottom length(em) / values
Pass margin-bottom length(em) / events
Pass margin-bottom length(ex) / values
Pass margin-bottom length(ex) / events
Pass margin-bottom length(mm) / values
Pass margin-bottom length(mm) / events
Pass margin-bottom length(cm) / values
Pass margin-bottom length(cm) / events
Pass margin-bottom length(in) / values
Pass margin-bottom length(in) / events
Pass margin-left length(pt) / values
Pass margin-left length(pt) / events
Pass margin-left length(pc) / values
Pass margin-left length(pc) / events
Pass margin-left length(px) / values
Pass margin-left length(px) / events
Pass margin-left length(em) / values
Pass margin-left length(em) / events
Pass margin-left length(ex) / values
Pass margin-left length(ex) / events
Pass margin-left length(mm) / values
Pass margin-left length(mm) / events
Pass margin-left length(cm) / values
Pass margin-left length(cm) / events
Pass margin-left length(in) / values
Pass margin-left length(in) / events
Pass margin-right length(pt) / values
Pass margin-right length(pt) / events
Pass margin-right length(pc) / values
Pass margin-right length(pc) / events
Pass margin-right length(px) / values
Pass margin-right length(px) / events
Pass margin-right length(em) / values
Pass margin-right length(em) / events
Pass margin-right length(ex) / values
Pass margin-right length(ex) / events
Pass margin-right length(mm) / values
Pass margin-right length(mm) / events
Pass margin-right length(cm) / values
Pass margin-right length(cm) / events
Pass margin-right length(in) / values
Pass margin-right length(in) / events
Pass margin-top length(pt) / values
Pass margin-top length(pt) / events
Pass margin-top length(pc) / values
Pass margin-top length(pc) / events
Pass margin-top length(px) / values
Pass margin-top length(px) / events
Pass margin-top length(em) / values
Pass margin-top length(em) / events
Pass margin-top length(ex) / values
Pass margin-top length(ex) / events
Pass margin-top length(mm) / values
Pass margin-top length(mm) / events
Pass margin-top length(cm) / values
Pass margin-top length(cm) / events
Pass margin-top length(in) / values
Pass margin-top length(in) / events
Pass height length(pt) / values
Pass height length(pt) / events
Pass height length(pc) / values
Pass height length(pc) / events
Pass height length(px) / values
Pass height length(px) / events
Pass height length(em) / values
Pass height length(em) / events
Pass height length(ex) / values
Pass height length(ex) / events
Pass height length(mm) / values
Pass height length(mm) / events
Pass height length(cm) / values
Pass height length(cm) / events
Pass height length(in) / values
Pass height length(in) / events
Pass height percentage(%) / values
Pass height percentage(%) / events
Pass width length(pt) / values
Pass width length(pt) / events
Pass width length(pc) / values
Pass width length(pc) / events
Pass width length(px) / values
Pass width length(px) / events
Pass width length(em) / values
Pass width length(em) / events
Pass width length(ex) / values
Pass width length(ex) / events
Pass width length(mm) / values
Pass width length(mm) / events
Pass width length(cm) / values
Pass width length(cm) / events
Pass width length(in) / values
Pass width length(in) / events
Pass width percentage(%) / values
Pass width percentage(%) / events
Pass min-height length(pt) / values
Pass min-height length(pt) / events
Pass min-height length(pc) / values
Pass min-height length(pc) / events
Pass min-height length(px) / values
Pass min-height length(px) / events
Pass min-height length(em) / values
Pass min-height length(em) / events
Pass min-height length(ex) / values
Pass min-height length(ex) / events
Pass min-height length(mm) / values
Pass min-height length(mm) / events
Pass min-height length(cm) / values
Pass min-height length(cm) / events
Pass min-height length(in) / values
Pass min-height length(in) / events
Pass min-height percentage(%) / values
Pass min-height percentage(%) / events
Pass min-width length(pt) / values
Pass min-width length(pt) / events
Pass min-width length(pc) / values
Pass min-width length(pc) / events
Pass min-width length(px) / values
Pass min-width length(px) / events
Pass min-width length(em) / values
Pass min-width length(em) / events
Pass min-width length(ex) / values
Pass min-width length(ex) / events
Pass min-width length(mm) / values
Pass min-width length(mm) / events
Pass min-width length(cm) / values
Pass min-width length(cm) / events
Pass min-width length(in) / values
Pass min-width length(in) / events
Pass min-width percentage(%) / values
Pass min-width percentage(%) / events
Pass max-height length(pt) / values
Pass max-height length(pt) / events
Pass max-height length(pc) / values
Pass max-height length(pc) / events
Pass max-height length(px) / values
Pass max-height length(px) / events
Pass max-height length(em) / values
Pass max-height length(em) / events
Pass max-height length(ex) / values
Pass max-height length(ex) / events
Pass max-height length(mm) / values
Pass max-height length(mm) / events
Pass max-height length(cm) / values
Pass max-height length(cm) / events
Pass max-height length(in) / values
Pass max-height length(in) / events
Pass max-height percentage(%) / values
Pass max-height percentage(%) / events
Pass max-width length(pt) / values
Pass max-width length(pt) / events
Pass max-width length(pc) / values
Pass max-width length(pc) / events
Pass max-width length(px) / values
Pass max-width length(px) / events
Pass max-width length(em) / values
Pass max-width length(em) / events
Pass max-width length(ex) / values
Pass max-width length(ex) / events
Pass max-width length(mm) / values
Pass max-width length(mm) / events
Pass max-width length(cm) / values
Pass max-width length(cm) / events
Pass max-width length(in) / values
Pass max-width length(in) / events
Pass max-width percentage(%) / values
Pass max-width percentage(%) / events
Pass top length(pt) / values
Pass top length(pt) / events
Pass top length(pc) / values
Pass top length(pc) / events
Pass top length(px) / values
Pass top length(px) / events
Pass top length(em) / values
Pass top length(em) / events
Pass top length(ex) / values
Pass top length(ex) / events
Pass top length(mm) / values
Pass top length(mm) / events
Pass top length(cm) / values
Pass top length(cm) / events
Pass top length(in) / values
Pass top length(in) / events
Pass top percentage(%) / values
Pass top percentage(%) / events
Pass right length(pt) / values
Pass right length(pt) / events
Pass right length(pc) / values
Pass right length(pc) / events
Pass right length(px) / values
Pass right length(px) / events
Pass right length(em) / values
Pass right length(em) / events
Pass right length(ex) / values
Pass right length(ex) / events
Pass right length(mm) / values
Pass right length(mm) / events
Pass right length(cm) / values
Pass right length(cm) / events
Pass right length(in) / values
Pass right length(in) / events
Pass right percentage(%) / values
Pass right percentage(%) / events
Pass bottom length(pt) / values
Pass bottom length(pt) / events
Pass bottom length(pc) / values
Pass bottom length(pc) / events
Pass bottom length(px) / values
Pass bottom length(px) / events
Pass bottom length(em) / values
Pass bottom length(em) / events
Pass bottom length(ex) / values
Pass bottom length(ex) / events
Pass bottom length(mm) / values
Pass bottom length(mm) / events
Pass bottom length(cm) / values
Pass bottom length(cm) / events
Pass bottom length(in) / values
Pass bottom length(in) / events
Pass bottom percentage(%) / values
Pass bottom percentage(%) / events
Pass left length(pt) / values
Pass left length(pt) / events
Pass left length(pc) / values
Pass left length(pc) / events
Pass left length(px) / values
Pass left length(px) / events
Pass left length(em) / values
Pass left length(em) / events
Pass left length(ex) / values
Pass left length(ex) / events
Pass left length(mm) / values
Pass left length(mm) / events
Pass left length(cm) / values
Pass left length(cm) / events
Pass left length(in) / values
Pass left length(in) / events
Pass left percentage(%) / values
Pass left percentage(%) / events
Pass color color(rgba) / values
Pass color color(rgba) / events
Pass font-size length(pt) / values
Pass font-size length(pt) / events
Pass font-size length(pc) / values
Pass font-size length(pc) / events
Pass font-size length(px) / values
Pass font-size length(px) / events
Pass font-size length(em) / values
Pass font-size length(em) / events
Pass font-size length(ex) / values
Pass font-size length(ex) / events
Pass font-size length(mm) / values
Pass font-size length(mm) / events
Pass font-size length(cm) / values
Pass font-size length(cm) / events
Pass font-size length(in) / values
Pass font-size length(in) / events
Pass font-size percentage(%) / values
Pass font-size percentage(%) / events
Pass font-weight font-weight(keyword) / values
Pass font-weight font-weight(keyword) / events
Pass font-weight font-weight(numeric) / values
Pass font-weight font-weight(numeric) / events
Pass line-height number(integer) / values
Pass line-height number(integer) / events
Pass line-height number(decimal) / values
Pass line-height number(decimal) / events
Pass line-height length(pt) / values
Pass line-height length(pt) / events
Pass line-height length(pc) / values
Pass line-height length(pc) / events
Pass line-height length(px) / values
Pass line-height length(px) / events
Pass line-height length(em) / values
Pass line-height length(em) / events
Pass line-height length(ex) / values
Pass line-height length(ex) / events
Pass line-height length(mm) / values
Pass line-height length(mm) / events
Pass line-height length(cm) / values
Pass line-height length(cm) / events
Pass line-height length(in) / values
Pass line-height length(in) / events
Pass line-height percentage(%) / values
Pass line-height percentage(%) / events
Pass letter-spacing length(pt) / values
Pass letter-spacing length(pt) / events
Pass letter-spacing length(pc) / values
Pass letter-spacing length(pc) / events
Pass letter-spacing length(px) / values
Pass letter-spacing length(px) / events
Pass letter-spacing length(em) / values
Pass letter-spacing length(em) / events
Pass letter-spacing length(ex) / values
Pass letter-spacing length(ex) / events
Pass letter-spacing length(mm) / values
Pass letter-spacing length(mm) / events
Pass letter-spacing length(cm) / values
Pass letter-spacing length(cm) / events
Pass letter-spacing length(in) / values
Pass letter-spacing length(in) / events
Pass word-spacing length(pt) / values
Pass word-spacing length(pt) / events
Pass word-spacing length(pc) / values
Pass word-spacing length(pc) / events
Pass word-spacing length(px) / values
Pass word-spacing length(px) / events
Pass word-spacing length(em) / values
Pass word-spacing length(em) / events
Pass word-spacing length(ex) / values
Pass word-spacing length(ex) / events
Pass word-spacing length(mm) / values
Pass word-spacing length(mm) / events
Pass word-spacing length(cm) / values
Pass word-spacing length(cm) / events
Pass word-spacing length(in) / values
Pass word-spacing length(in) / events
Pass word-spacing percentage(%) / values
Pass word-spacing percentage(%) / events
Pass text-indent length(pt) / values
Pass text-indent length(pt) / events
Pass text-indent length(pc) / values
Pass text-indent length(pc) / events
Pass text-indent length(px) / values
Pass text-indent length(px) / events
Pass text-indent length(em) / values
Pass text-indent length(em) / events
Pass text-indent length(ex) / values
Pass text-indent length(ex) / events
Pass text-indent length(mm) / values
Pass text-indent length(mm) / events
Pass text-indent length(cm) / values
Pass text-indent length(cm) / events
Pass text-indent length(in) / values
Pass text-indent length(in) / events
Pass text-indent percentage(%) / values
Pass text-indent percentage(%) / events
Pass text-shadow shadow(shadow) / values
Pass text-shadow shadow(shadow) / events
Pass outline-color color(rgba) / values
Pass outline-color color(rgba) / events
Pass outline-offset length(pt) / values
Pass outline-offset length(pt) / events
Pass outline-offset length(pc) / values
Pass outline-offset length(pc) / events
Pass outline-offset length(px) / values
Pass outline-offset length(px) / events
Pass outline-offset length(em) / values
Pass outline-offset length(em) / events
Pass outline-offset length(ex) / values
Pass outline-offset length(ex) / events
Pass outline-offset length(mm) / values
Pass outline-offset length(mm) / events
Pass outline-offset length(cm) / values
Pass outline-offset length(cm) / events
Pass outline-offset length(in) / values
Pass outline-offset length(in) / events
Pass outline-width length(pt) / values
Pass outline-width length(pt) / events
Pass outline-width length(pc) / values
Pass outline-width length(pc) / events
Pass outline-width length(px) / values
Pass outline-width length(px) / events
Pass outline-width length(em) / values
Pass outline-width length(em) / events
Pass outline-width length(ex) / values
Pass outline-width length(ex) / events
Pass outline-width length(mm) / values
Pass outline-width length(mm) / events
Pass outline-width length(cm) / values
Pass outline-width length(cm) / events
Pass outline-width length(in) / values
Pass outline-width length(in) / events
Pass clip rectangle(rectangle) / values
Pass clip rectangle(rectangle) / events
Pass vertical-align length(pt) / values
Pass vertical-align length(pt) / events
Pass vertical-align length(pc) / values
Pass vertical-align length(pc) / events
Pass vertical-align length(px) / values
Pass vertical-align length(px) / events
Pass vertical-align length(em) / values
Pass vertical-align length(em) / events
Pass vertical-align length(ex) / values
Pass vertical-align length(ex) / events
Pass vertical-align length(mm) / values
Pass vertical-align length(mm) / events
Pass vertical-align length(cm) / values
Pass vertical-align length(cm) / events
Pass vertical-align length(in) / values
Pass vertical-align length(in) / events
Pass vertical-align percentage(%) / values
Pass vertical-align percentage(%) / events
Pass opacity number[0,1](zero-to-one) / values
Pass opacity number[0,1](zero-to-one) / events
Fail visibility visibility(keyword) / values
Pass visibility visibility(keyword) / events
Pass z-index integer(integer) / values
Pass z-index integer(integer) / events

6
Tests/LibWeb/Text/expected/wpt-import/css/css-transitions/transitioncancel-003.txt Normal file
View file

@ -0,0 +1,6 @@
Harness status: OK
Found 1 tests
1 Fail
Fail Mid-transition transition changes affect subsequent transitions

145
Tests/LibWeb/Text/input/wpt-import/css/css-transitions/CSSTransition-currentTime.tentative.html Normal file
View file

@ -0,0 +1,145 @@
<!doctype html>
<meta charset=utf-8>
<title>CSSTransition.currentTime</title>
<!-- TODO: Add a more specific link for this once it is specified. -->
<link rel="help" href="https://drafts.csswg.org/css-transitions-2/#csstransition">
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<script src="support/helper.js"></script>
<div id="log"></div>
<script>
'use strict';
const marginLeft = div => parseFloat(getComputedStyle(div).marginLeft);
promise_test(async t => {
const div = addDiv(t, {
style: 'margin-left: 100px; transition: margin-left 100s linear 100s',
});
getComputedStyle(div).marginLeft;
div.style.marginLeft = '200px';
const animation = div.getAnimations()[0];
assert_equals(
animation.currentTime,
0,
'currentTime should initially be zero'
);
await animation.ready;
const seekTime = 150 * MS_PER_SEC;
animation.currentTime = seekTime;
assert_time_equals_literal(
animation.currentTime,
seekTime,
'currentTime is updated'
);
assert_equals(getComputedStyle(div).marginLeft, '150px');
}, 'currentTime can be used to seek a CSS transition');
promise_test(async t => {
const div = addDiv(t, {
style: 'margin-left: 100px; transition: margin-left 100s linear 100s',
});
const eventWatcher = new EventWatcher(t, div, 'transitionend');
getComputedStyle(div).marginLeft;
div.style.marginLeft = '200px';
const animation = div.getAnimations()[0];
await animation.ready;
const marginLeft = () => parseFloat(getComputedStyle(div).marginLeft);
assert_equals(marginLeft(div), 100);
animation.currentTime = 100 * MS_PER_SEC;
assert_equals(marginLeft(div), 100);
animation.currentTime = 150 * MS_PER_SEC;
assert_equals(marginLeft(div), 150);
animation.currentTime = 200 * MS_PER_SEC;
await eventWatcher.wait_for('transitionend');
assert_equals(marginLeft(div), 200);
}, 'Skipping forwards through transition');
promise_test(async t => {
const div = addDiv(t, {
style: 'margin-left: 100px; transition: margin-left 100s linear 100s',
});
const eventWatcher = new EventWatcher(t, div, 'transitionend');
getComputedStyle(div).marginLeft;
div.style.marginLeft = '200px';
const animation = div.getAnimations()[0];
await animation.ready;
// Unlike in the case of CSS animations, we cannot skip to the end and skip
// backwards since when we reach the end the transition effect is removed and
// changes to the Animation object no longer affect the element. For
// this reason we only skip forwards as far as the 50% through point.
animation.currentTime = 150 * MS_PER_SEC;
assert_equals(marginLeft(div), 150);
animation.currentTime = 100 * MS_PER_SEC;
assert_equals(marginLeft(div), 100);
}, 'Skipping backwards through transition');
promise_test(async t => {
const div = addDiv(t, {
style: 'margin-left: 100px; transition: margin-left 100s linear 100s',
});
getComputedStyle(div).marginLeft;
div.style.marginLeft = '200px';
const animation = div.getAnimations()[0];
await animation.ready;
assert_throws_js(
TypeError,
() => {
animation.currentTime = null;
},
'Expect TypeError exception on trying to set Animation.currentTime to null'
);
}, 'Setting currentTime to null on a CSS transition throws');
test(t => {
const div = addDiv(t);
div.style.left = '0px';
getComputedStyle(div).transitionProperty;
div.style.transition = 'left 100s ease-in';
div.style.left = '100px';
const transition = div.getAnimations()[0];
// Seek to the middle. Note, this is not equivalent to 50% progress since the
// timing-function is non-linear.
transition.currentTime = 50 * MS_PER_SEC;
const portion = transition.effect.getComputedTiming().progress;
// Reverse the transition.
div.style.left = '0px';
const reversedTransition = div.getAnimations()[0];
// If the transition reversing behavior does not advance the previous
// transition to the time set by currentTime, start and end values will both
// be 0px and no transition will be produced.
assert_not_equals(reversedTransition, undefined,
"A reversed transition is produced");
const expectedDuration = 100 * MS_PER_SEC * portion;
assert_approx_equals(
reversedTransition.effect.getComputedTiming().activeDuration,
expectedDuration,
1,
"The reversed transition has correctly reduced duration"
);
}, "Transition reversing behavior respects currentTime and uses the " +
"transition's current position.");
</script>

73
Tests/LibWeb/Text/input/wpt-import/css/css-transitions/CSSTransition-ready.tentative.html Normal file
View file

@ -0,0 +1,73 @@
<!doctype html>
<meta charset=utf-8>
<title>CSSTransition.ready</title>
<!-- TODO: Add a more specific link for this once it is specified. -->
<link rel="help" href="https://drafts.csswg.org/css-transitions-2/#csstransition">
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<script src="support/helper.js"></script>
<div id="log"></div>
<script>
'use strict';
promise_test(async t => {
const div = addDiv(t);
// Set up pending transition
div.style.transform = 'translate(0px)';
getComputedStyle(div).transform;
div.style.transition = 'transform 100s';
div.style.transform = 'translate(10px)';
getComputedStyle(div).transform;
const animation = div.getAnimations()[0];
assert_true(animation.pending, 'Animation is initially pending');
const readyPromise = animation.ready;
// Now remove transform from transition-property and flush styles
div.style.transitionProperty = 'none';
getComputedStyle(div).transitionProperty;
try {
await readyPromise;
assert_unreached('ready promise was fulfilled');
} catch (err) {
assert_equals(err.name, 'AbortError',
'ready promise is rejected with AbortError');
assert_equals(animation.playState, 'idle',
'Animation is idle after transition was canceled');
}
}, 'ready promise is rejected when a transition is canceled by updating'
+ ' transition-property');
promise_test(async t => {
const div = addDiv(t);
// Set up pending transition
div.style.marginLeft = '0px';
getComputedStyle(div).marginLeft;
div.style.transition = 'margin-left 100s';
div.style.marginLeft = '100px';
getComputedStyle(div).marginLeft;
const animation = div.getAnimations()[0];
assert_true(animation.pending, 'Animation is initially pending');
const readyPromise = animation.ready;
// Update the transition to animate to something not-interpolable
div.style.marginLeft = 'auto';
getComputedStyle(div).marginLeft;
try {
await readyPromise;
assert_unreached('ready promise was fulfilled');
} catch (err) {
assert_equals(err.name, 'AbortError',
'ready promise is rejected with AbortError');
assert_equals(animation.playState, 'idle',
'Animation is idle after transition was canceled');
}
}, 'ready promise is rejected when a transition is canceled by changing'
+ ' the transition property to something not interpolable');
</script>

124
Tests/LibWeb/Text/input/wpt-import/css/css-transitions/CSSTransition-startTime.tentative.html Normal file
View file

@ -0,0 +1,124 @@
<!doctype html>
<meta charset=utf-8>
<title>CSSTransition.startTime</title>
<!-- TODO: Add a more specific link for this once it is specified. -->
<link rel="help" href="https://drafts.csswg.org/css-transitions-2/#csstransition">
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<script src="support/helper.js"></script>
<div id="log"></div>
<script>
'use strict';
test(t => {
const div = addDiv(t, {
style: 'margin-left: 100px; transition: margin-left 100s linear 100s',
});
getComputedStyle(div).marginLeft;
div.style.marginLeft = '200px';
const animation = div.getAnimations()[0];
assert_equals(animation.startTime, null, 'startTime is unresolved');
}, 'The start time of a newly-created transition is unresolved');
promise_test(async t => {
const div = addDiv(t);
div.style.left = '0px';
div.style.top = '0px';
getComputedStyle(div).transitionProperty;
div.style.transition = 'all 100s';
div.style.left = '100px';
div.style.top = '100px';
let animations = div.getAnimations();
assert_equals(animations.length, 2);
await waitForAllAnimations(animations);
assert_equals(animations[0].startTime, animations[1].startTime,
'CSS transitions started together have the same start time');
await waitForAnimationFrames(1);
div.style.backgroundColor = 'green';
animations = div.getAnimations();
assert_equals(animations.length, 3);
await waitForAllAnimations(animations);
assert_less_than(animations[1].startTime, animations[2].startTime,
'A CSS transition added in a later frame has a later start time');
}, 'The start time of transitions is based on when they are generated');
test(t => {
const div = addDiv(t, {
style: 'margin-left: 100px; transition: margin-left 100s linear 100s',
});
getComputedStyle(div).marginLeft;
div.style.marginLeft = '200px';
const animation = div.getAnimations()[0];
const timelineTime = animation.timeline.currentTime;
animation.startTime = timelineTime;
assert_times_equal(
animation.startTime,
timelineTime,
'Check setting of startTime actually works'
);
}, 'The start time of a transition can be set');
promise_test(async t => {
const div = addDiv(t, {
style: 'margin-left: 100px; transition: margin-left 100s linear 100s',
});
getComputedStyle(div).marginLeft;
div.style.marginLeft = '200px';
const animation = div.getAnimations()[0];
await animation.ready;
const timelineTime = animation.timeline.currentTime;
const marginLeft = () => parseFloat(getComputedStyle(div).marginLeft);
animation.startTime = timelineTime - 100 * MS_PER_SEC;
assert_equals(marginLeft(), 100);
animation.startTime = timelineTime - 150 * MS_PER_SEC;
assert_equals(marginLeft(), 150);
}, 'The start time can be set to seek a transition');
promise_test(async t => {
const div = addDiv(t, {
style: 'margin-left: 100px; transition: margin-left 100s linear 100s',
});
const eventWatcher = new EventWatcher(t, div, [
'transitionstart',
'transitionend',
]);
getComputedStyle(div).marginLeft;
div.style.marginLeft = '200px';
const animation = div.getAnimations()[0];
await animation.ready;
const timelineTime = animation.timeline.currentTime;
animation.startTime = timelineTime - 100 * MS_PER_SEC;
await frameTimeout(
eventWatcher.wait_for('transitionstart'),
2,
'transitionstart'
);
animation.startTime = timelineTime - 200 * MS_PER_SEC;
await frameTimeout(
eventWatcher.wait_for('transitionend'),
2,
'transitionend'
);
}, 'Seeking a transition using start time dispatches transition events');
</script>

87
Tests/LibWeb/Text/input/wpt-import/css/css-transitions/animations/transition-timing-function.html Normal file
View file

@ -0,0 +1,87 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>transition timing function</title>
<link rel="help" href="https://drafts.csswg.org/css-transitions-1/#transition-timing-function-property">
<style>
.box {
position: relative;
left: 0;
height: 100px;
width: 100px;
margin: 10px;
background-color: blue;
transition: left 1s linear;
}
.animating > .box {
left: 400px;
}
</style>
</head>
<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>
<script src="../../../css/css-transitions/support/helper.js"></script>
<script src="../../../css/css-easing/testcommon.js"></script>
<script>
window.onload = () => {
function verifyPosition(element_id, expected) {
const element = document.getElementById(element_id);
const actual = Math.round(parseFloat(getComputedStyle(element).left));
assert_equals(actual, expected, `verify ${element_id} left`);
}
function easing(x1, y1, x2, y2) {
return Math.round(400 * cubicBezier(x1, y1, x2, y2)(0.5));
}
function ease() {
return easing(0.25, 0.1, 0.25, 1); // 321
}
function easeIn() {
return easing(0.42, 0, 1, 1); // 126
}
function easeOut() {
return easing(0.0, 0.0, 0.58, 1.0); // 274
}
function easeInOut() {
return easing(0.42, 0.0, 0.58, 1.0); // 200
}
promise_test(async t => {
// Make sure we have rendered the page before making the style change
// to ensure we get transitions.
await waitForAnimationFrames(2);
promises = [];
document.getElementById('container').className = 'animating';
document.getAnimations().forEach(anim => {
anim.pause();
anim.currentTime = 500;
promises.push(anim.ready);
});
await Promise.all(promises).then(() => {
assert_equals(promises.length, 6, 'Unexpected animation count');
verifyPosition('box1', 200); // linear easing
verifyPosition('box2', ease());
verifyPosition('box3', easeIn());
verifyPosition('box4', easeOut());
verifyPosition('box5', easeInOut());
verifyPosition('box6', 400);
});
}, 'Ensure that transition easing functions are properly applied.');
};
</script>
<body>
<div id="container">
<div id="box1" class="box" style="transition-timing-function: linear;"></div>
<div id="box2" class="box" style="transition-timing-function: ease;"></div>
<div id="box3" class="box" style="transition-timing-function: ease-in;"></div>
<div id="box4" class="box" style="transition-timing-function: ease-out;"></div>
<div id="box5" class="box" style="transition-timing-function: ease-in-out;"></div>
<div id="box6" class="box" style="transition-timing-function: linear(0, 1, 0);"></div>
</div>
</body>
</html>

512
Tests/LibWeb/Text/input/wpt-import/css/css-transitions/event-dispatch.tentative.html Normal file
View file

@ -0,0 +1,512 @@
<!doctype html>
<meta charset=utf-8>
<title>CSS transition event dispatch</title>
<link rel="help" href="https://drafts.csswg.org/css-transitions-2/#event-dispatch">
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<script src="support/helper.js"></script>
<div id="log"></div>
<script>
'use strict';
// All transition events should be received on the next animation frame. If
// two animation frames pass before receiving the expected events then we
// can immediately fail the current test.
const transitionEventsTimeout = () => {
return waitForAnimationFrames(2);
};
const setupTransition = (t, transitionStyle) => {
const div = addDiv(t, { style: 'transition: ' + transitionStyle });
const watcher = new EventWatcher(t, div, [ 'transitionrun',
'transitionstart',
'transitionend',
'transitioncancel' ],
transitionEventsTimeout);
getComputedStyle(div).marginLeft;
div.style.marginLeft = '100px';
const transition = div.getAnimations()[0];
return { transition, watcher, div };
};
// On the next frame (i.e. when events are queued), whether or not the
// transition is still pending depends on the implementation.
promise_test(async t => {
const { transition, watcher } =
setupTransition(t, 'margin-left 100s 100s');
const evt = await watcher.wait_for('transitionrun');
assert_equals(evt.elapsedTime, 0.0);
}, 'Idle -> Pending or Before');
promise_test(async t => {
const { transition, watcher } =
setupTransition(t, 'margin-left 100s 100s');
// Force the transition to leave the idle phase
transition.startTime = document.timeline.currentTime;
const evt = await watcher.wait_for('transitionrun');
assert_equals(evt.elapsedTime, 0.0);
}, 'Idle -> Before');
promise_test(async t => {
const { transition, watcher } = setupTransition(t, 'margin-left 100s 100s');
// Seek to Active phase.
transition.currentTime = 100 * MS_PER_SEC;
transition.pause();
const events = await watcher.wait_for(['transitionrun', 'transitionstart'], {
record: 'all',
});
assert_equals(events[0].elapsedTime, 0.0);
assert_equals(events[1].elapsedTime, 0.0);
}, 'Idle or Pending -> Active');
promise_test(async t => {
const { transition, watcher } = setupTransition(t, 'margin-left 100s 100s');
// Seek to After phase.
transition.finish();
const events = await watcher.wait_for(
['transitionrun', 'transitionstart', 'transitionend'],
{
record: 'all',
}
);
assert_equals(events[0].elapsedTime, 0.0);
assert_equals(events[1].elapsedTime, 0.0);
assert_equals(events[2].elapsedTime, 100.0);
}, 'Idle or Pending -> After');
promise_test(async t => {
const { transition, watcher, div } =
setupTransition(t, 'margin-left 100s 100s');
await Promise.all([ watcher.wait_for('transitionrun'), transition.ready ]);
// Make idle
div.style.display = 'none';
getComputedStyle(div).marginLeft;
const evt = await watcher.wait_for('transitioncancel');
assert_equals(evt.elapsedTime, 0.0);
}, 'Before -> Idle (display: none)');
promise_test(async t => {
const { transition, watcher } =
setupTransition(t, 'margin-left 100s 100s');
await Promise.all([ watcher.wait_for('transitionrun'), transition.ready ]);
// Make idle
transition.timeline = null;
const evt = await watcher.wait_for('transitioncancel');
assert_equals(evt.elapsedTime, 0.0);
}, 'Before -> Idle (Animation.timeline = null)');
promise_test(async t => {
const { transition, watcher } =
setupTransition(t, 'margin-left 100s 100s');
await Promise.all([ watcher.wait_for('transitionrun'), transition.ready ]);
transition.currentTime = 100 * MS_PER_SEC;
const evt = await watcher.wait_for('transitionstart');
assert_equals(evt.elapsedTime, 0.0);
}, 'Before -> Active');
promise_test(async t => {
const { transition, watcher } = setupTransition(t, 'margin-left 100s 100s');
await Promise.all([ watcher.wait_for('transitionrun'), transition.ready ]);
// Seek to After phase.
transition.currentTime = 200 * MS_PER_SEC;
const events = await watcher.wait_for(['transitionstart', 'transitionend'], {
record: 'all',
});
assert_equals(events[0].elapsedTime, 0.0);
assert_equals(events[1].elapsedTime, 100.0);
}, 'Before -> After');
promise_test(async t => {
const { transition, watcher, div } = setupTransition(t, 'margin-left 100s');
// Seek to Active start position.
transition.pause();
await watcher.wait_for([ 'transitionrun', 'transitionstart' ]);
// Make idle
div.style.display = 'none';
getComputedStyle(div).marginLeft;
const evt = await watcher.wait_for('transitioncancel');
assert_equals(evt.elapsedTime, 0.0);
}, 'Active -> Idle, no delay (display: none)');
promise_test(async t => {
const { transition, watcher } = setupTransition(t, 'margin-left 100s');
await watcher.wait_for([ 'transitionrun', 'transitionstart' ]);
// Make idle
transition.currentTime = 0;
transition.timeline = null;
const evt = await watcher.wait_for('transitioncancel');
assert_equals(evt.elapsedTime, 0.0);
}, 'Active -> Idle, no delay (Animation.timeline = null)');
promise_test(async t => {
const { transition, watcher, div } =
setupTransition(t, 'margin-left 100s 100s');
// Pause so the currentTime is fixed and we can accurately compare the event
// time in transition cancel events.
transition.pause();
// Seek to Active phase.
transition.currentTime = 100 * MS_PER_SEC;
await watcher.wait_for([ 'transitionrun', 'transitionstart' ]);
// Make idle
div.style.display = 'none';
getComputedStyle(div).marginLeft;
const evt = await watcher.wait_for('transitioncancel');
assert_equals(evt.elapsedTime, 0.0);
}, 'Active -> Idle, with positive delay (display: none)');
promise_test(async t => {
const { transition, watcher } = setupTransition(t, 'margin-left 100s 100s');
// Seek to Active phase.
transition.currentTime = 100 * MS_PER_SEC;
await watcher.wait_for([ 'transitionrun', 'transitionstart' ]);
// Make idle
transition.currentTime = 100 * MS_PER_SEC;
transition.timeline = null;
const evt = await watcher.wait_for('transitioncancel');
assert_equals(evt.elapsedTime, 0.0);
}, 'Active -> Idle, with positive delay (Animation.timeline = null)');
promise_test(async t => {
const { transition, watcher, div } =
setupTransition(t, 'margin-left 100s -50s');
// Pause so the currentTime is fixed and we can accurately compare the event
// time in transition cancel events.
transition.pause();
await watcher.wait_for([ 'transitionrun', 'transitionstart' ]);
// Make idle
div.style.display = 'none';
getComputedStyle(div).marginLeft;
const evt = await watcher.wait_for('transitioncancel');
assert_equals(evt.elapsedTime, 50.0);
}, 'Active -> Idle, with negative delay (display: none)');
promise_test(async t => {
const { transition, watcher } = setupTransition(t, 'margin-left 100s -50s');
await watcher.wait_for([ 'transitionrun', 'transitionstart' ]);
// Make idle
transition.currentTime = 50 * MS_PER_SEC;
transition.timeline = null;
const evt = await watcher.wait_for('transitioncancel');
assert_equals(evt.elapsedTime, 0.0);
}, 'Active -> Idle, with negative delay (Animation.timeline = null)');
promise_test(async t => {
const { transition, watcher } = setupTransition(t, 'margin-left 100s 100s');
// Seek to Active phase.
transition.currentTime = 100 * MS_PER_SEC;
await watcher.wait_for([ 'transitionrun', 'transitionstart' ]);
// Seek to Before phase.
transition.currentTime = 0;
const evt = await watcher.wait_for('transitionend');
assert_equals(evt.elapsedTime, 0.0);
}, 'Active -> Before');
promise_test(async t => {
const { transition, watcher } = setupTransition(t, 'margin-left 100s 100s');
// Seek to Active phase.
transition.currentTime = 100 * MS_PER_SEC;
await watcher.wait_for([ 'transitionrun', 'transitionstart' ]);
// Seek to After phase.
transition.currentTime = 200 * MS_PER_SEC;
const evt = await watcher.wait_for('transitionend');
assert_equals(evt.elapsedTime, 100.0);
}, 'Active -> After');
promise_test(async t => {
const { transition, watcher } = setupTransition(t, 'margin-left 100s 100s');
// Seek to After phase.
transition.finish();
await watcher.wait_for([ 'transitionrun',
'transitionstart',
'transitionend' ]);
// Seek to Before phase.
transition.currentTime = 0;
const events = await watcher.wait_for(['transitionstart', 'transitionend'], {
record: 'all',
});
assert_equals(events[0].elapsedTime, 100.0);
assert_equals(events[1].elapsedTime, 0.0);
}, 'After -> Before');
promise_test(async t => {
const { transition, watcher } = setupTransition(t, 'margin-left 100s 100s');
// Seek to After phase.
transition.finish();
await watcher.wait_for([ 'transitionrun',
'transitionstart',
'transitionend' ]);
// Seek to Active phase.
transition.currentTime = 100 * MS_PER_SEC;
const evt = await watcher.wait_for('transitionstart');
assert_equals(evt.elapsedTime, 100.0);
}, 'After -> Active');
promise_test(async t => {
const { transition, watcher } = setupTransition(t, 'margin-left 100s -50s');
const events = await watcher.wait_for(['transitionrun', 'transitionstart'], {
record: 'all',
});
assert_equals(events[0].elapsedTime, 50.0);
assert_equals(events[1].elapsedTime, 50.0);
transition.finish();
const evt = await watcher.wait_for('transitionend');
assert_equals(evt.elapsedTime, 100.0);
}, 'Calculating the interval start and end time with negative start delay.');
promise_test(async t => {
const { transition, watcher, div } = setupTransition(
t,
'margin-left 100s 100s'
);
await watcher.wait_for('transitionrun');
// We can't set the end delay via generated effect timing
// because mutating CSS transitions is not specced yet.
transition.effect = new KeyframeEffect(
div,
{ marginLeft: ['0px', '100px'] },
{
duration: 100 * MS_PER_SEC,
endDelay: -50 * MS_PER_SEC,
}
);
// Seek to Before and play.
transition.cancel();
transition.play();
const events = await watcher.wait_for(
['transitioncancel', 'transitionrun', 'transitionstart'],
{ record: 'all' }
);
assert_equals(events[2].elapsedTime, 0.0);
// Seek to After phase.
transition.finish();
const evt = await watcher.wait_for('transitionend');
assert_equals(evt.elapsedTime, 50.0);
}, 'Calculating the interval start and end time with negative end delay.');
promise_test(async t => {
const { transition, watcher, div } =
setupTransition(t, 'margin-left 100s 100s');
await watcher.wait_for('transitionrun');
// Make idle
div.style.display = 'none';
getComputedStyle(div).marginLeft;
await watcher.wait_for('transitioncancel');
transition.cancel();
// Then wait a couple of frames and check that no event was dispatched
await waitForAnimationFrames(2);
}, 'Call Animation.cancel after canceling transition.');
promise_test(async t => {
const { transition, watcher, div } =
setupTransition(t, 'margin-left 100s 100s');
await watcher.wait_for('transitionrun');
// Make idle
transition.cancel();
transition.play();
await watcher.wait_for([ 'transitioncancel',
'transitionrun' ]);
}, 'Restart transition after canceling transition immediately');
promise_test(async t => {
const { transition, watcher, div } =
setupTransition(t, 'margin-left 100s 100s');
await watcher.wait_for('transitionrun');
// Make idle
div.style.display = 'none';
getComputedStyle(div).marginLeft;
transition.play();
transition.cancel();
await watcher.wait_for('transitioncancel');
// Then wait a couple of frames and check that no event was dispatched
await waitForAnimationFrames(2);
}, 'Call Animation.cancel after restarting transition immediately');
promise_test(async t => {
const { transition, watcher } = setupTransition(t, 'margin-left 100s');
await watcher.wait_for([ 'transitionrun', 'transitionstart' ]);
// Make idle
transition.timeline = null;
await watcher.wait_for('transitioncancel');
transition.timeline = document.timeline;
transition.play();
await watcher.wait_for(['transitionrun', 'transitionstart']);
}, 'Set timeline and play transition after clear the timeline');
promise_test(async t => {
const { transition, watcher, div } =
setupTransition(t, 'margin-left 100s');
await watcher.wait_for([ 'transitionrun', 'transitionstart' ]);
transition.cancel();
await watcher.wait_for('transitioncancel');
// Make After phase
transition.effect = null;
// Then wait a couple of frames and check that no event was dispatched
await waitForAnimationFrames(2);
}, 'Set null target effect after canceling the transition');
promise_test(async t => {
const { transition, watcher, div } = setupTransition(t, 'margin-left 100s');
await watcher.wait_for([ 'transitionrun', 'transitionstart' ]);
transition.effect = null;
await watcher.wait_for('transitionend');
transition.cancel();
// Then wait a couple of frames and check that no event was dispatched
await waitForAnimationFrames(2);
}, 'Cancel the transition after clearing the target effect');
promise_test(async t => {
const { transition, watcher, div } = setupTransition(t, 'margin-left 100s');
// Seek to After phase.
transition.finish();
const events = await watcher.wait_for(
['transitionrun', 'transitionstart', 'transitionend'],
{
record: 'all',
}
);
transition.cancel();
// Then wait a couple of frames and check that no event was dispatched
await waitForAnimationFrames(2);
}, 'Cancel the transition after it finishes');
promise_test(async t => {
const { transition, watcher, div } = setupTransition(t, 'margin-left 100s');
transition.currentTime = 50 * MS_PER_SEC;
await watcher.wait_for(['transitionrun', 'transitionstart']);
// Replace the running transition.
div.style.marginLeft = '200px';
// transitioncancel event should be fired before transitionrun because we
// expect to cancel the running transition first.
await watcher.wait_for(
['transitioncancel', 'transitionrun', 'transitionstart']
);
// Then wait a couple of frames and check that no event was dispatched
await waitForAnimationFrames(2);
}, 'Replacing a running transition should get transitioncancel earlier than ' +
'transitionrun and transitionstart');
promise_test(async t => {
const div =
addDiv(t, { style: 'transition: margin-left 100s, margin-top 100s' });
const watcher = new EventWatcher(t, div, [ 'transitionrun',
'transitioncancel' ],
transitionEventsTimeout);
getComputedStyle(div).marginLeft;
div.style.marginLeft = '100px';
div.style.marginTop = '100px';
const transitions = div.getAnimations();
transitions[0].currentTime = 50 * MS_PER_SEC;
transitions[1].currentTime = 50 * MS_PER_SEC;
await watcher.wait_for(['transitionrun', 'transitionrun']);
// Replace both running transitions.
div.style.marginLeft = '200px';
div.style.marginTop = '200px';
await watcher.wait_for([
// Cancel events show first because their transition generations are
// smaller than the new ones.
'transitioncancel', 'transitioncancel',
'transitionrun', 'transitionrun'
]);
// Then wait a couple of frames and check that no event was dispatched
await waitForAnimationFrames(2);
}, 'Replacing two running transitions on the same target should get two ' +
'transitioncancel events earlier than two transitionrun events, per ' +
'transition generation');
promise_test(async t => {
const { transition, watcher, div } = setupTransition(t, 'margin-left 100s');
transition.currentTime = 50 * MS_PER_SEC;
await watcher.wait_for(['transitionrun', 'transitionstart']);
// We need to wait for a while to reproduce the potential bug in Gecko.
await new Promise(resolve => t.step_timeout(resolve, 100));
// Replace the running transition.
div.style.marginLeft = '200px';
getComputedStyle(div).marginLeft;
// transitioncancel event should be fired before transitionrun because we
// expect to cancel the running transition first.
await watcher.wait_for(
['transitioncancel', 'transitionrun', 'transitionstart']
);
// Then wait a couple of frames and check that no event was dispatched
await waitForAnimationFrames(2);
}, 'Replacing a running transition and forcing to flush the style together ' +
'should get the correct event order');
</script>

26
Tests/LibWeb/Text/input/wpt-import/css/css-transitions/inherit-height-transition.html Normal file
View file

@ -0,0 +1,26 @@
<!DOCTYPE html>
<link rel="help" href="https://drafts.csswg.org/css-transitions/#starting">
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<style>
div { height: inherit; }
#outer { height: 50px; }
#outer.collapsed {
height: 0px;
transition: height 0.01s;
}
</style>
<div id="outer">
<div>
<div id="inner">You should only see a flash of red.</div>
</div>
</div>
<script>
promise_test(t => {
outer.offsetTop;
outer.className = "collapsed";
return (new Promise((resolve) => outer.addEventListener("transitionend", resolve))).then(() => {
assert_equals(getComputedStyle(inner).height, "0px");
});
}, "Transitioned height, explicitly inherited down two DOM levels, should inherit correctly");
</script>

135
Tests/LibWeb/Text/input/wpt-import/css/css-transitions/properties-value-001.html Normal file
View file

@ -0,0 +1,135 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Transitions Test: Intermediate Property Values</title>
<meta name="timeout" content="long">
<meta name="assert" content="Test checks that value ranges between start and end while transitioning">
<link rel="help" href="http://www.w3.org/TR/css3-transitions/#transitions">
<link rel="help" href="https://drafts.csswg.org/web-animations-1/#animation-type">
<link rel="author" title="Rodney Rehm" href="http://rodneyrehm.de/en/">
<meta name="flags" content="dom">
<script src="../../resources/testharness.js" type="text/javascript"></script>
<script src="../../resources/testharnessreport.js" type="text/javascript"></script>
<script src="./support/vendorPrefix.js" type="text/javascript"></script>
<script src="./support/helper.js" type="text/javascript"></script>
<script src="./support/runParallelAsyncHarness.js" type="text/javascript"></script>
<script src="./support/generalParallelTest.js" type="text/javascript"></script>
<script src="./support/properties.js" type="text/javascript"></script>
<style type="text/css">
#offscreen {
position: absolute;
top: -100000px;
left: -100000px;
width: 100000px;
height: 100000px;
}
</style>
</head>
<body>
<!-- required by testharnessreport.js -->
<div id="log"></div>
<!-- elements used for testing -->
<div id="fixture" class="fixture">
<div class="container">
<div class="transition">Text sample</div>
</div>
</div>
<div id="offscreen"></div>
<!--
SEE ./support/README.md for an abstract explanation of the test procedure
http://test.csswg.org/source/contributors/rodneyrehm/submitted/css3-transitions/README.md
-->
<script>
// this test takes its time, give it a minute to run
var timeout = 60000;
setup({timeout: timeout});
var tests = getPropertyTests();
// for testing, limit to a couple of iterations
// tests = tests.slice(10, 30);
// or filter using one of:
// tests = filterPropertyTests(tests, "background-color color(rgba)");
// tests = filterPropertyTests(tests, ["background-color color(rgba)", ...]);
// tests = filterPropertyTests(tests, /^background-color/);
// general transition-duration
var duration = '2s';
runParallelAsyncHarness({
// array of test data
tests: tests,
// the number of tests to run in parallel
testsPerSlice: 50,
// milliseconds to wait before calling teardown and ending test
duration: parseFloat(duration) * 1000,
// prepare individual test
setup: function(data, options) {
var styles = {
'.fixture': {},
'.container': data.parentStyle,
'.container.to': {},
'.container.how': {},
'.transition': data.from,
'.transition.to' : data.to,
'.transition.how' : {transition: 'all ' + duration + ' linear 0s'}
};
generalParallelTest.setup(data, options);
generalParallelTest.addStyles(data, options, styles);
},
// cleanup after individual test
teardown: generalParallelTest.teardown,
// invoked prior to running a slice of tests
sliceStart: generalParallelTest.sliceStart,
// invoked after transitions have started
transitionsStarted: generalParallelTest.transitionsStarted,
// invoked after running a slice of tests
sliceDone: generalParallelTest.sliceDone,
// test cases, make them as granular as possible
cases: {
// test property values while transitioning
// values.start kicks off a transition
'values': {
// run actual test, assertions can be used here!
start: function(test, data, options) {
// identify initial and target values
generalParallelTest.getStyle(data);
// make sure values differ, if they don't, the property could most likely not be parsed
assert_not_equals(data.transition.from, data.transition.to, "initial and target values may not match");
// kick off the transition
generalParallelTest.startTransition(data);
// make sure we didn't get the target value immediately.
// If we did, there wouldn't be a transition!
var current = data.transition.computedStyle(data.property);
assert_not_equals(current, data.transition.to, "must not be target value after start");
},
done: function(test, data, options) {
// make sure the property's value were neither initial nor target while transitioning
test.step(generalParallelTest.assertIntermediateValuesFunc(data, 'transition'));
}
},
// test TransitionEnd events
'events': {
done: function(test, data, options) {
// make sure there were no events on parent
test.step(generalParallelTest.assertExpectedEventsFunc(data, 'container', ""));
// make sure we got the event for the tested property only
test.step(generalParallelTest.assertExpectedEventsFunc(data, 'transition', addVendorPrefix(data.property) + ":" + duration));
}
}
},
// called once all tests are done
done: generalParallelTest.done
});
</script>
</body>
</html>

145
Tests/LibWeb/Text/input/wpt-import/css/css-transitions/properties-value-inherit-001.html Normal file
View file

@ -0,0 +1,145 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Transitions Test: transitioning inherited property values</title>
<meta name="timeout" content="long">
<meta name="assert" content="Test checks that inherited property values that are transitioned on a parent element don't start a transition">
<link rel="help" title="3. Starting of transitions" href="http://www.w3.org/TR/css3-transitions/#starting">
<link rel="author" title="Rodney Rehm" href="http://rodneyrehm.de/en/">
<meta name="flags" content="dom ">
<script src="../../resources/testharness.js" type="text/javascript"></script>
<script src="../../resources/testharnessreport.js" type="text/javascript"></script>
<script src="./support/vendorPrefix.js" type="text/javascript"></script>
<script src="./support/helper.js" type="text/javascript"></script>
<script src="./support/runParallelAsyncHarness.js" type="text/javascript"></script>
<script src="./support/generalParallelTest.js" type="text/javascript"></script>
<script src="./support/properties.js" type="text/javascript"></script>
<style type="text/css">
#offscreen {
position: absolute;
top: -100000px;
left: -100000px;
width: 100000px;
height: 100000px;
}
</style>
</head>
<body>
<!-- required by testharnessreport.js -->
<div id="log"></div>
<!-- elements used for testing -->
<div id="fixture" class="fixture">
<div class="container">
<div class="transition">Text sample</div>
</div>
</div>
<div id="offscreen"></div>
<!--
SEE ./support/README.md for an abstract explanation of the test procedure
http://test.csswg.org/source/contributors/rodneyrehm/submitted/css3-transitions/README.md
-->
<script>
// http://www.w3.org/TR/css3-transitions/#starting
// Implementations also must not start a transition when the computed value changes because
// it is inherited (directly or indirectly) from another element that is transitioning the same property.
// this test takes its time, give it a minute to run
var timeout = 60000;
setup({timeout: timeout});
var tests = getPropertyTests();
// for testing, limit to a couple of iterations
// tests = tests.slice(10, 30);
// or filter using one of:
// tests = filterPropertyTests(tests, "background-color color(rgba)");
// tests = filterPropertyTests(tests, ["background-color color(rgba)", ...]);
// tests = filterPropertyTests(tests, /^background-color/);
// general transition-duration
var duration = '2s';
runParallelAsyncHarness({
// array of test data
tests: tests,
// the number of tests to run in parallel
testsPerSlice: 50,
// milliseconds to wait before calling teardown and ending test
duration: parseFloat(duration) * 1000,
// prepare individual test
setup: function(data, options) {
// clone and overwrite initial styles to be
// applied to #transition
var inherited = extend({}, data.from);
inherited[data.property] = 'inherit';
var styles = {
// as we're testing inheritance, #fixture is our new parent
'.fixture': data.parentStyle,
// all styles including transition apply to to #container so they
// can inherit down to #transition
'.container': extend({}, data.parentStyle, data.from),
'.container.to': data.to,
'.container.how': {transition: addVendorPrefix(data.property) + ' ' + duration + ' linear 0s'},
// #transition only inherits and listens for transition events
'.transition': inherited,
'.transition.to' : {},
'.transition.how' : {transition: addVendorPrefix(data.property) + ' ' + duration + ' linear 0s'}
};
generalParallelTest.setup(data, options);
generalParallelTest.addStyles(data, options, styles);
},
// cleanup after individual test
teardown: generalParallelTest.teardown,
// invoked prior to running a slice of tests
sliceStart: generalParallelTest.sliceStart,
// invoked after transitions have started
transitionsStarted: generalParallelTest.transitionsStarted,
// invoked after running a slice of tests
sliceDone: generalParallelTest.sliceDone,
// test cases, make them as granular as possible
cases: {
// test property values while transitioning
// values.start kicks off a transition
'values': {
// run actual test, assertions can be used here!
start: function(test, data, options) {
// identify initial and target values
generalParallelTest.getStyle(data);
// make sure values differ, if they don't, the property could most likely not be parsed
assert_not_equals(data.transition.from, data.transition.to, "initial and target values may not match");
// kick off the transition
generalParallelTest.startTransition(data);
// make sure we didn't get the target value immediately.
// If we did, there wouldn't be a transition!
var current = data.transition.computedStyle(data.property);
assert_not_equals(current, data.transition.to, "must not be target value after start");
},
done: function(test, data, options) {
// make sure the property's value were neither initial nor target while transitioning
test.step(generalParallelTest.assertIntermediateValuesFunc(data, 'transition'));
}
},
// test TransitionEnd events
'events': {
done: function(test, data, options) {
// make sure there were no events on parent
test.step(generalParallelTest.assertExpectedEventsFunc(data, 'container', addVendorPrefix(data.property) + ":" + duration));
// make sure we got the event for the tested property only
test.step(generalParallelTest.assertExpectedEventsFunc(data, 'transition', ""));
}
}
},
// called once all tests are done
done: generalParallelTest.done
});
</script>
</body>
</html>

146
Tests/LibWeb/Text/input/wpt-import/css/css-transitions/properties-value-inherit-002.html Normal file
View file

@ -0,0 +1,146 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CSS Transitions Test: transitioning inherited property values</title>
<meta name="timeout" content="long">
<meta name="assert" content="Test checks that inherited property values that are not transitioned on a parent element start a transition">
<link rel="help" title="3. Starting of transitions" href="http://www.w3.org/TR/css3-transitions/#starting">
<link rel="author" title="Rodney Rehm" href="http://rodneyrehm.de/en/">
<meta name="flags" content="dom ">
<script src="../../resources/testharness.js" type="text/javascript"></script>
<script src="../../resources/testharnessreport.js" type="text/javascript"></script>
<script src="./support/vendorPrefix.js" type="text/javascript"></script>
<script src="./support/helper.js" type="text/javascript"></script>
<script src="./support/runParallelAsyncHarness.js" type="text/javascript"></script>
<script src="./support/generalParallelTest.js" type="text/javascript"></script>
<script src="./support/properties.js" type="text/javascript"></script>
<style type="text/css">
#offscreen {
position: absolute;
top: -100000px;
left: -100000px;
width: 100000px;
height: 100000px;
}
</style>
</head>
<body>
<!-- required by testharnessreport.js -->
<div id="log"></div>
<!-- elements used for testing -->
<div id="fixture" class="fixture">
<div class="container">
<div class="transition">Text sample</div>
</div>
</div>
<div id="offscreen"></div>
<!--
SEE ./support/README.md for an abstract explanation of the test procedure
http://test.csswg.org/source/contributors/rodneyrehm/submitted/css3-transitions/README.md
-->
<script>
// http://www.w3.org/TR/css3-transitions/#starting
// Implementations also must not start a transition when the computed value changes because
// it is inherited (directly or indirectly) from another element that is transitioning the same property.
// Note: Parent element doesn't transition, so above quote doesn't apply!
// this test takes its time, give it a minute to run
var timeout = 60000;
setup({timeout: timeout});
var tests = getPropertyTests();
// for testing, limit to a couple of iterations
// tests = tests.slice(10, 30);
// or filter using one of:
// tests = filterPropertyTests(tests, "background-color color(rgba)");
// tests = filterPropertyTests(tests, ["background-color color(rgba)", ...]);
// tests = filterPropertyTests(tests, /^background-color/);
// general transition-duration
var duration = '2s';
runParallelAsyncHarness({
// array of test data
tests: tests,
// the number of tests to run in parallel
testsPerSlice: 50,
// milliseconds to wait before calling teardown and ending test
duration: parseFloat(duration) * 1000,
// prepare individual test
setup: function(data, options) {
// clone and overwrite initial styles to be
// applied to #transition
var inherited = extend({}, data.from);
inherited[data.property] = 'inherit';
var styles = {
// as we're testing inheritance, #fixture is our new parent
'.fixture': data.parentStyle,
// all styles including transition apply to to #container so they
// can inherit down to #transition
'.container': extend({}, data.parentStyle, data.from),
'.container.to': data.to,
'.container.how': {},
// #transition only inherits and listens for transition events
'.transition': inherited,
'.transition.to' : {},
'.transition.how' : {transition: addVendorPrefix(data.property) + ' ' + duration + ' linear 0s'}
};
generalParallelTest.setup(data, options);
generalParallelTest.addStyles(data, options, styles);
},
// cleanup after individual test
teardown: generalParallelTest.teardown,
// invoked prior to running a slice of tests
sliceStart: generalParallelTest.sliceStart,
// invoked after transitions have started
transitionsStarted: generalParallelTest.transitionsStarted,
// invoked after running a slice of tests
sliceDone: generalParallelTest.sliceDone,
// test cases, make them as granular as possible
cases: {
// test property values while transitioning
// values.start kicks off a transition
'values': {
// run actual test, assertions can be used here!
start: function(test, data, options) {
// identify initial and target values
generalParallelTest.getStyle(data);
// make sure values differ, if they don't, the property could most likely not be parsed
assert_not_equals(data.transition.from, data.transition.to, "initial and target values may not match");
// kick off the transition
generalParallelTest.startTransition(data);
// make sure we didn't get the target value immediately.
// If we did, there wouldn't be a transition!
var current = data.transition.computedStyle(data.property);
assert_not_equals(current, data.transition.to, "must not be target value after start");
},
done: function(test, data, options) {
// make sure the property's value were neither initial nor target while transitioning
test.step(generalParallelTest.assertIntermediateValuesFunc(data, 'transition'));
}
},
// test TransitionEnd events
'events': {
done: function(test, data, options) {
// make sure there were no events on parent
test.step(generalParallelTest.assertExpectedEventsFunc(data, 'container', ""));
// make sure we got the event for the tested property only
test.step(generalParallelTest.assertExpectedEventsFunc(data, 'transition', addVendorPrefix(data.property) + ":" + duration));
}
}
},
// called once all tests are done
done: generalParallelTest.done
});
</script>
</body>
</html>

61
Tests/LibWeb/Text/input/wpt-import/css/css-transitions/transitioncancel-003.html Normal file
View file

@ -0,0 +1,61 @@
<!doctype html>
<html>
<head>
<meta charset=utf-8>
<title>CSS Transitions Test: Changing transition properties mid-transition</title>
<meta name="assert" content="When transition properties are changed mid-transition, the original transition completes and new transition parameters apply to subsequent changes">
<link rel="help" href="https://drafts.csswg.org/css-transitions/#starting">
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<script src="./support/helper.js"></script>
</head>
<body>
<div id="log"></div>
<script>
promise_test(async t => {
const div = addDiv(t, {
style: 'transition: width 100ms; width: 0px;'
});
// Flush initial state
getComputedStyle(div).width;
// Start first transition to 100px
div.style.width = '100px';
// Wait until transition starts running
await new Promise(resolve => {
div.addEventListener('transitionrun', resolve, { once: true });
});
// MID-TRANSITION CHANGE: Switch to 0s duration + 100ms delay
div.style.transition = 'width 0s 100ms';
assert_not_equals(
getComputedStyle(div).width,
'100px',
'Width should not reach 100px yet'
);
// Trigger new width change mid-transition
div.style.width = '0px';
assert_not_equals(
getComputedStyle(div).width,
'0px',
'Width should not changed to 0px immediately'
);
await waitForTransitionEnd(div);
// Final computed style
assert_equals(
getComputedStyle(div).width,
'0px',
'Final width should be 0px'
);
}, 'Mid-transition transition changes affect subsequent transitions');
</script>
</body>
</html>