Mirrors/servo
1
0
Fork 0
mirror of https://github.com/servo/servo.git synced 2025-08-04 21:20:23 +01:00
Code Issues Projects Releases Packages Wiki Activity

Update web-platform-tests to revision 422b440e0b587317e4539378b18c362a4ea7afee

Browse source
This commit is contained in:
WPT Sync Bot 2020-01-09 08:23:47 +00:00
parent dbee7f7d27
commit 0c29efe000
160 changed files with 6195 additions and 2605 deletions
Download patch file Download diff file Expand all files Collapse all files

2
tests/wpt/metadata/FileAPI/url/url-in-tags-revoke.window.js.ini
View file

@ -7,7 +7,7 @@
expected: FAIL
[Opening a blob URL in a new window immediately before revoking it works.]
expected: TIMEOUT
expected: FAIL
[Opening a blob URL in a noopener about:blank window immediately before revoking it works.]
expected: FAIL

3
tests/wpt/metadata/FileAPI/url/url-with-fetch.any.js.ini
View file

@ -2,9 +2,6 @@
[Revoke blob URL after creating Request, will fetch]
expected: FAIL
[Revoke blob URL after calling fetch, fetch should succeed]
expected: FAIL
[url-with-fetch.any.html]
[Revoke blob URL after creating Request, will fetch]

824
tests/wpt/metadata/MANIFEST.json
View file

File diff suppressed because it is too large Load diff

28
tests/wpt/metadata/css/css-color/animation/color-composition.html.ini Normal file
View file

@ -0,0 +1,28 @@
[color-composition.html]
[Compositing: property <color> underlying [rgb(60, 60, 60)\] from add [rgb(0, 0, 0)\] to replace [rgb(50, 50, 50)\] at (1.2) should be [rgb(48, 48, 48)\]]
expected: FAIL
[Compositing: property <color> underlying [rgb(50, 50, 50)\] from add [rgb(10, 10, 10)\] to replace [rgb(30, 30, 30)\] at (1.2) should be [rgb(24, 24, 24)\]]
expected: FAIL
[Compositing: property <color> underlying [rgb(50, 50, 50)\] from add [rgb(10, 10, 10)\] to replace [rgb(30, 30, 30)\] at (1) should be [rgb(30, 30, 30)\]]
expected: FAIL
[Compositing: property <color> underlying [rgb(60, 60, 60)\] from add [rgb(0, 0, 0)\] to replace [rgb(50, 50, 50)\] at (1) should be [rgb(50, 50, 50)\]]
expected: FAIL
[Compositing: property <color> underlying [rgb(60, 60, 60)\] from add [rgb(0, 0, 0)\] to replace [rgb(50, 50, 50)\] at (0.5) should be [rgb(55, 55, 55)\]]
expected: FAIL
[Compositing: property <color> underlying [rgb(50, 50, 50)\] from add [rgb(10, 10, 10)\] to replace [rgb(30, 30, 30)\] at (0) should be [rgb(60, 60, 60)\]]
expected: FAIL
[Compositing: property <color> underlying [rgb(50, 50, 50)\] from add [rgb(10, 10, 10)\] to replace [rgb(30, 30, 30)\] at (0.2) should be [rgb(54, 54, 54)\]]
expected: FAIL
[Compositing: property <color> underlying [rgb(60, 60, 60)\] from add [rgb(0, 0, 0)\] to replace [rgb(50, 50, 50)\] at (1.5) should be [rgb(45, 45, 45)\]]
expected: FAIL
[Compositing: property <color> underlying [rgb(50, 50, 50)\] from add [rgb(10, 10, 10)\] to replace [rgb(30, 30, 30)\] at (1.5) should be [rgb(15, 15, 15)\]]
expected: FAIL

76
tests/wpt/metadata/css/css-flexbox/animation/flex-basis-composition.html.ini Normal file
View file

@ -0,0 +1,76 @@
[flex-basis-composition.html]
[Compositing: property <flex-basis> underlying [100px\] from add [100px\] to add [auto\] at (1.5) should be [auto\]]
expected: FAIL
[Compositing: property <flex-basis> underlying [100px\] from add [10px\] to add [2px\] at (1) should be [102px\]]
expected: FAIL
[Compositing: property <flex-basis> underlying [50px\] from add [100px\] to add [200px\] at (1.5) should be [300px\]]
expected: FAIL
[Compositing: property <flex-basis> underlying [100px\] from add [10px\] to add [2px\] at (0.5) should be [106px\]]
expected: FAIL
[Compositing: property <flex-basis> underlying [100px\] from add [10px\] to add [2px\] at (-0.5) should be [114px\]]
expected: FAIL
[Compositing: property <flex-basis> underlying [100px\] from add [10px\] to add [2px\] at (1.5) should be [98px\]]
expected: FAIL
[Compositing: property <flex-basis> underlying [50px\] from add [100px\] to replace [200px\] at (1) should be [200px\]]
expected: FAIL
[Compositing: property <flex-basis> underlying [10%\] from add [100px\] to add [20%\] at (1.5) should be [calc(-50px + 40%)\]]
expected: FAIL
[Compositing: property <flex-basis> underlying [10%\] from add [100px\] to add [20%\] at (0) should be [calc(100px + 10%)\]]
expected: FAIL
[Compositing: property <flex-basis> underlying [10%\] from add [100px\] to add [20%\] at (-0.3) should be [calc(130px + 4%)\]]
expected: FAIL
[Compositing: property <flex-basis> underlying [100px\] from add [100px\] to add [auto\] at (-0.3) should be [200px\]]
expected: FAIL
[Compositing: property <flex-basis> underlying [100px\] from add [100px\] to add [auto\] at (1) should be [auto\]]
expected: FAIL
[Compositing: property <flex-basis> underlying [50px\] from add [100px\] to replace [200px\] at (0.5) should be [175px\]]
expected: FAIL
[Compositing: property <flex-basis> underlying [50px\] from add [100px\] to replace [200px\] at (-0.3) should be [135px\]]
expected: FAIL
[Compositing: property <flex-basis> underlying [50px\] from add [100px\] to add [200px\] at (-0.3) should be [120px\]]
expected: FAIL
[Compositing: property <flex-basis> underlying [10%\] from add [100px\] to add [20%\] at (0.5) should be [calc(50px + 20%)\]]
expected: FAIL
[Compositing: property <flex-basis> underlying [50px\] from add [100px\] to add [200px\] at (1) should be [250px\]]
expected: FAIL
[Compositing: property <flex-basis> underlying [50px\] from add [100px\] to add [200px\] at (0) should be [150px\]]
expected: FAIL
[Compositing: property <flex-basis> underlying [100px\] from add [100px\] to add [auto\] at (0.5) should be [auto\]]
expected: FAIL
[Compositing: property <flex-basis> underlying [50px\] from add [100px\] to replace [200px\] at (0) should be [150px\]]
expected: FAIL
[Compositing: property <flex-basis> underlying [100px\] from add [100px\] to add [auto\] at (0) should be [200px\]]
expected: FAIL
[Compositing: property <flex-basis> underlying [50px\] from add [100px\] to add [200px\] at (0.5) should be [200px\]]
expected: FAIL
[Compositing: property <flex-basis> underlying [50px\] from add [100px\] to replace [200px\] at (1.5) should be [225px\]]
expected: FAIL
[Compositing: property <flex-basis> underlying [10%\] from add [100px\] to add [20%\] at (1) should be [30%\]]
expected: FAIL
[Compositing: property <flex-basis> underlying [100px\] from add [10px\] to add [2px\] at (0) should be [110px\]]
expected: FAIL

640
tests/wpt/metadata/css/css-images/animations/object-position-interpolation.html.ini
View file

@ -1,640 +0,0 @@
[object-position-interpolation.html]
[object-position-interpolation]
expected: FAIL
[Web Animations: property <object-position> from [100px 200px\] to [0px 0px\] at (0.5) should be [50px 100px\]]
expected: FAIL
[CSS Animations: property <object-position> from [50% 100%\] to [50px 100px\] at (0.5) should be [calc(25% + 25px) calc(50% + 50px)\]]
expected: FAIL
[CSS Animations: property <object-position> from [center\] to [right 0% bottom 50%\] at (1) should be [100% 50%\]]
expected: FAIL
[CSS Transitions with transition: all: property <object-position> from [initial\] to [20px 20px\] at (1) should be [calc(20px + 0%) calc(20px + 0%)\]]
expected: FAIL
[CSS Transitions with transition: all: property <object-position> from [unset\] to [20px 20px\] at (0.5) should be [calc(10px + 25%) calc(10px + 25%)\]]
expected: FAIL
[CSS Transitions: property <object-position> from neutral to [20px 20px\] at (1.5) should be [25px 15px\]]
expected: FAIL
[CSS Animations: property <object-position> from [inherit\] to [20px 20px\] at (0) should be [30px 10px\]]
expected: FAIL
[CSS Animations: property <object-position> from [center\] to [top right\] at (0) should be [50% 50%\]]
expected: FAIL
[CSS Animations: property <object-position> from [100px 200px\] to [0px 0px\] at (0.5) should be [50px 100px\]]
expected: FAIL
[CSS Transitions: property <object-position> from neutral to [20px 20px\] at (0) should be [10px 30px\]]
expected: FAIL
[CSS Transitions with transition: all: property <object-position> from [50% 100%\] to [50px 100px\] at (0.5) should be [calc(25% + 25px) calc(50% + 50px)\]]
expected: FAIL
[CSS Transitions: property <object-position> from [50% 50%\] to [100% 100%\] at (-0.3) should be [35% 35%\]]
expected: FAIL
[Web Animations: property <object-position> from [50% 50%\] to [100% 100%\] at (1.5) should be [125% 125%\]]
expected: FAIL
[Web Animations: property <object-position> from [initial\] to [20px 20px\] at (1) should be [calc(20px + 0%) calc(20px + 0%)\]]
expected: FAIL
[CSS Animations: property <object-position> from [center\] to [right 0% bottom 50%\] at (-0.5) should be [25% 50%\]]
expected: FAIL
[CSS Transitions: property <object-position> from [50% 100%\] to [50px 100px\] at (0) should be [50% 100%\]]
expected: FAIL
[CSS Transitions with transition: all: property <object-position> from [100px 200px\] to [0px 0px\] at (0.5) should be [50px 100px\]]
expected: FAIL
[CSS Transitions: property <object-position> from [center\] to [top right\] at (1) should be [100% 0%\]]
expected: FAIL
[CSS Animations: property <object-position> from neutral to [20px 20px\] at (1.5) should be [25px 15px\]]
expected: FAIL
[Web Animations: property <object-position> from [unset\] to [20px 20px\] at (1) should be [calc(20px + 0%) calc(20px + 0%)\]]
expected: FAIL
[CSS Animations: property <object-position> from [50% 100%\] to [50px 100px\] at (0) should be [50% 100%\]]
expected: FAIL
[CSS Transitions with transition: all: property <object-position> from [50% 100%\] to [50px 100px\] at (0) should be [50% 100%\]]
expected: FAIL
[Web Animations: property <object-position> from neutral to [20px 20px\] at (-0.3) should be [7px 33px\]]
expected: FAIL
[CSS Transitions: property <object-position> from [50% 100%\] to [0px 0px\] at (1) should be [0px 0px\]]
expected: FAIL
[CSS Transitions with transition: all: property <object-position> from [50% 100%\] to [0px 0px\] at (-0.3) should be [65% 130%\]]
expected: FAIL
[CSS Animations: property <object-position> from [50% 100%\] to [50px 100px\] at (-0.3) should be [calc(65% + -15px) calc(130% + -30px)\]]
expected: FAIL
[CSS Animations: property <object-position> from neutral to [20px 20px\] at (-0.3) should be [7px 33px\]]
expected: FAIL
[CSS Transitions: property <object-position> from neutral to [20px 20px\] at (-0.3) should be [7px 33px\]]
expected: FAIL
[CSS Transitions with transition: all: property <object-position> from [50% 100%\] to [0px 0px\] at (0.5) should be [25% 50%\]]
expected: FAIL
[CSS Transitions: property <object-position> from [center\] to [right 0% bottom 50%\] at (0.5) should be [75% 50%\]]
expected: FAIL
[CSS Transitions: property <object-position> from [initial\] to [20px 20px\] at (1) should be [calc(20px + 0%) calc(20px + 0%)\]]
expected: FAIL
[CSS Animations: property <object-position> from [50% 100%\] to [0px 0px\] at (0) should be [50% 100%\]]
expected: FAIL
[Web Animations: property <object-position> from [50% 50%\] to [100% 100%\] at (0) should be [50% 50%\]]
expected: FAIL
[CSS Transitions: property <object-position> from [100px 200px\] to [0px 0px\] at (1.5) should be [-50px -100px\]]
expected: FAIL
[CSS Animations: property <object-position> from [center\] to [top right\] at (1.5) should be [125% -25%\]]
expected: FAIL
[CSS Transitions: property <object-position> from [50% 50%\] to [100% 100%\] at (0.5) should be [75% 75%\]]
expected: FAIL
[CSS Transitions: property <object-position> from [inherit\] to [20px 20px\] at (1.5) should be [15px 25px\]]
expected: FAIL
[Web Animations: property <object-position> from [50% 100%\] to [50px 100px\] at (1.5) should be [calc(-25% + 75px) calc(-50% + 150px)\]]
expected: FAIL
[Web Animations: property <object-position> from [center\] to [right 0% bottom 50%\] at (0.3) should be [65% 50%\]]
expected: FAIL
[CSS Animations: property <object-position> from [50% 100%\] to [0px 0px\] at (1) should be [0px 0px\]]
expected: FAIL
[CSS Transitions: property <object-position> from [50% 100%\] to [50px 100px\] at (-0.3) should be [calc(65% + -15px) calc(130% + -30px)\]]
expected: FAIL
[CSS Animations: property <object-position> from [100px 200px\] to [0px 0px\] at (1.5) should be [-50px -100px\]]
expected: FAIL
[CSS Transitions: property <object-position> from [100px 200px\] to [0px 0px\] at (-0.3) should be [130px 260px\]]
expected: FAIL
[CSS Transitions with transition: all: property <object-position> from [initial\] to [20px 20px\] at (1.5) should be [calc(30px + -25%) calc(30px + -25%)\]]
expected: FAIL
[CSS Transitions: property <object-position> from [50% 100%\] to [50px 100px\] at (1) should be [calc(0% + 50px) calc(0% + 100px)\]]
expected: FAIL
[CSS Transitions with transition: all: property <object-position> from [initial\] to [20px 20px\] at (0.5) should be [calc(10px + 25%) calc(10px + 25%)\]]
expected: FAIL
[CSS Transitions with transition: all: property <object-position> from [50% 100%\] to [50px 100px\] at (1.5) should be [calc(-25% + 75px) calc(-50% + 150px)\]]
expected: FAIL
[Web Animations: property <object-position> from [center\] to [right 0% bottom 50%\] at (0.9) should be [95% 50%\]]
expected: FAIL
[CSS Transitions with transition: all: property <object-position> from [50% 100%\] to [0px 0px\] at (1) should be [0px 0px\]]
expected: FAIL
[Web Animations: property <object-position> from [50% 100%\] to [50px 100px\] at (0) should be [50% 100%\]]
expected: FAIL
[CSS Animations: property <object-position> from [50% 50%\] to [100% 100%\] at (0) should be [50% 50%\]]
expected: FAIL
[CSS Transitions with transition: all: property <object-position> from neutral to [20px 20px\] at (0.5) should be [15px 25px\]]
expected: FAIL
[CSS Transitions: property <object-position> from [50% 100%\] to [0px 0px\] at (0.5) should be [25% 50%\]]
expected: FAIL
[CSS Transitions with transition: all: property <object-position> from [inherit\] to [20px 20px\] at (0.5) should be [25px 15px\]]
expected: FAIL
[CSS Animations: property <object-position> from [initial\] to [20px 20px\] at (0) should be [50% 50%\]]
expected: FAIL
[Web Animations: property <object-position> from [initial\] to [20px 20px\] at (0) should be [50% 50%\]]
expected: FAIL
[CSS Transitions: property <object-position> from [inherit\] to [20px 20px\] at (0) should be [30px 10px\]]
expected: FAIL
[Web Animations: property <object-position> from [unset\] to [20px 20px\] at (1.5) should be [calc(30px + -25%) calc(30px + -25%)\]]
expected: FAIL
[CSS Animations: property <object-position> from [unset\] to [20px 20px\] at (0.5) should be [calc(10px + 25%) calc(10px + 25%)\]]
expected: FAIL
[Web Animations: property <object-position> from [50% 100%\] to [50px 100px\] at (1) should be [calc(0% + 50px) calc(0% + 100px)\]]
expected: FAIL
[CSS Animations: property <object-position> from [inherit\] to [20px 20px\] at (0.5) should be [25px 15px\]]
expected: FAIL
[CSS Transitions with transition: all: property <object-position> from [100px 200px\] to [0px 0px\] at (1) should be [0px 0px\]]
expected: FAIL
[CSS Transitions: property <object-position> from neutral to [20px 20px\] at (1) should be [20px 20px\]]
expected: FAIL
[CSS Animations: property <object-position> from [unset\] to [20px 20px\] at (1.5) should be [calc(30px + -25%) calc(30px + -25%)\]]
expected: FAIL
[CSS Animations: property <object-position> from [50% 50%\] to [100% 100%\] at (1.5) should be [125% 125%\]]
expected: FAIL
[CSS Transitions with transition: all: property <object-position> from [unset\] to [20px 20px\] at (1) should be [calc(20px + 0%) calc(20px + 0%)\]]
expected: FAIL
[CSS Transitions: property <object-position> from [initial\] to [20px 20px\] at (1.5) should be [calc(30px + -25%) calc(30px + -25%)\]]
expected: FAIL
[CSS Transitions with transition: all: property <object-position> from [center\] to [right 0% bottom 50%\] at (0.5) should be [75% 50%\]]
expected: FAIL
[Web Animations: property <object-position> from [center\] to [right 0% bottom 50%\] at (1.5) should be [125% 50%\]]
expected: FAIL
[CSS Transitions with transition: all: property <object-position> from [100px 200px\] to [0px 0px\] at (0) should be [100px 200px\]]
expected: FAIL
[CSS Transitions: property <object-position> from [50% 50%\] to [100% 100%\] at (0) should be [50% 50%\]]
expected: FAIL
[CSS Transitions with transition: all: property <object-position> from [center\] to [right 0% bottom 50%\] at (1) should be [100% 50%\]]
expected: FAIL
[Web Animations: property <object-position> from [center\] to [top right\] at (1.5) should be [125% -25%\]]
expected: FAIL
[Web Animations: property <object-position> from [center\] to [top right\] at (0) should be [50% 50%\]]
expected: FAIL
[CSS Transitions: property <object-position> from [unset\] to [20px 20px\] at (0) should be [50% 50%\]]
expected: FAIL
[Web Animations: property <object-position> from [50% 50%\] to [100% 100%\] at (0.5) should be [75% 75%\]]
expected: FAIL
[CSS Transitions with transition: all: property <object-position> from neutral to [20px 20px\] at (1) should be [20px 20px\]]
expected: FAIL
[CSS Transitions with transition: all: property <object-position> from [inherit\] to [20px 20px\] at (-0.3) should be [33px 7px\]]
expected: FAIL
[Web Animations: property <object-position> from [center\] to [right 0% bottom 50%\] at (2) should be [150% 50%\]]
expected: FAIL
[Web Animations: property <object-position> from [center\] to [right 0% bottom 50%\] at (1) should be [100% 50%\]]
expected: FAIL
[Web Animations: property <object-position> from [initial\] to [20px 20px\] at (-0.3) should be [calc(-6px + 65%) calc(-6px + 65%)\]]
expected: FAIL
[CSS Transitions with transition: all: property <object-position> from [center\] to [top right\] at (1) should be [100% 0%\]]
expected: FAIL
[CSS Transitions: property <object-position> from [unset\] to [20px 20px\] at (1) should be [calc(20px + 0%) calc(20px + 0%)\]]
expected: FAIL
[CSS Transitions: property <object-position> from [center\] to [top right\] at (1.5) should be [125% -25%\]]
expected: FAIL
[CSS Transitions: property <object-position> from [center\] to [top right\] at (0.5) should be [75% 25%\]]
expected: FAIL
[CSS Transitions: property <object-position> from [center\] to [right 0% bottom 50%\] at (2) should be [150% 50%\]]
expected: FAIL
[Web Animations: property <object-position> from [100px 200px\] to [0px 0px\] at (1.5) should be [-50px -100px\]]
expected: FAIL
[Web Animations: property <object-position> from [initial\] to [20px 20px\] at (0.5) should be [calc(10px + 25%) calc(10px + 25%)\]]
expected: FAIL
[CSS Transitions with transition: all: property <object-position> from [center\] to [right 0% bottom 50%\] at (2) should be [150% 50%\]]
expected: FAIL
[Web Animations: property <object-position> from [50% 50%\] to [100% 100%\] at (1) should be [100% 100%\]]
expected: FAIL
[CSS Transitions: property <object-position> from [center\] to [right 0% bottom 50%\] at (0.3) should be [65% 50%\]]
expected: FAIL
[Web Animations: property <object-position> from [inherit\] to [20px 20px\] at (0.5) should be [25px 15px\]]
expected: FAIL
[Web Animations: property <object-position> from neutral to [20px 20px\] at (1) should be [20px 20px\]]
expected: FAIL
[CSS Transitions with transition: all: property <object-position> from [100px 200px\] to [0px 0px\] at (1.5) should be [-50px -100px\]]
expected: FAIL
[Web Animations: property <object-position> from [center\] to [right 0% bottom 50%\] at (0) should be [center\]]
expected: FAIL
[CSS Animations: property <object-position> from [50% 50%\] to [100% 100%\] at (-0.3) should be [35% 35%\]]
expected: FAIL
[CSS Animations: property <object-position> from [50% 100%\] to [0px 0px\] at (0.5) should be [25% 50%\]]
expected: FAIL
[Web Animations: property <object-position> from [unset\] to [20px 20px\] at (-0.3) should be [calc(-6px + 65%) calc(-6px + 65%)\]]
expected: FAIL
[Web Animations: property <object-position> from [inherit\] to [20px 20px\] at (1) should be [20px 20px\]]
expected: FAIL
[CSS Animations: property <object-position> from [inherit\] to [20px 20px\] at (1.5) should be [15px 25px\]]
expected: FAIL
[Web Animations: property <object-position> from [center\] to [top right\] at (0.5) should be [75% 25%\]]
expected: FAIL
[CSS Transitions: property <object-position> from neutral to [20px 20px\] at (0.5) should be [15px 25px\]]
expected: FAIL
[Web Animations: property <object-position> from [50% 50%\] to [100% 100%\] at (-0.3) should be [35% 35%\]]
expected: FAIL
[CSS Transitions with transition: all: property <object-position> from [50% 50%\] to [100% 100%\] at (1) should be [100% 100%\]]
expected: FAIL
[CSS Animations: property <object-position> from [center\] to [top right\] at (-0.3) should be [35% 65%\]]
expected: FAIL
[CSS Transitions: property <object-position> from [center\] to [right 0% bottom 50%\] at (-0.5) should be [25% 50%\]]
expected: FAIL
[CSS Transitions: property <object-position> from [50% 100%\] to [0px 0px\] at (-0.3) should be [65% 130%\]]
expected: FAIL
[Web Animations: property <object-position> from [unset\] to [20px 20px\] at (0) should be [50% 50%\]]
expected: FAIL
[CSS Animations: property <object-position> from [50% 50%\] to [100% 100%\] at (0.5) should be [75% 75%\]]
expected: FAIL
[CSS Animations: property <object-position> from [center\] to [right 0% bottom 50%\] at (0) should be [center\]]
expected: FAIL
[CSS Animations: property <object-position> from [inherit\] to [20px 20px\] at (-0.3) should be [33px 7px\]]
expected: FAIL
[Web Animations: property <object-position> from [center\] to [top right\] at (1) should be [100% 0%\]]
expected: FAIL
[CSS Animations: property <object-position> from [100px 200px\] to [0px 0px\] at (1) should be [0px 0px\]]
expected: FAIL
[Web Animations: property <object-position> from [center\] to [top right\] at (-0.3) should be [35% 65%\]]
expected: FAIL
[CSS Animations: property <object-position> from [50% 50%\] to [100% 100%\] at (1) should be [100% 100%\]]
expected: FAIL
[CSS Transitions: property <object-position> from [initial\] to [20px 20px\] at (0) should be [50% 50%\]]
expected: FAIL
[CSS Animations: property <object-position> from neutral to [20px 20px\] at (0.5) should be [15px 25px\]]
expected: FAIL
[Web Animations: property <object-position> from [unset\] to [20px 20px\] at (0.5) should be [calc(10px + 25%) calc(10px + 25%)\]]
expected: FAIL
[CSS Animations: property <object-position> from neutral to [20px 20px\] at (0) should be [10px 30px\]]
expected: FAIL
[CSS Animations: property <object-position> from [initial\] to [20px 20px\] at (0.5) should be [calc(10px + 25%) calc(10px + 25%)\]]
expected: FAIL
[Web Animations: property <object-position> from [center\] to [right 0% bottom 50%\] at (0.5) should be [75% 50%\]]
expected: FAIL
[CSS Transitions: property <object-position> from [inherit\] to [20px 20px\] at (1) should be [20px 20px\]]
expected: FAIL
[CSS Transitions with transition: all: property <object-position> from [initial\] to [20px 20px\] at (0) should be [50% 50%\]]
expected: FAIL
[Web Animations: property <object-position> from [initial\] to [20px 20px\] at (1.5) should be [calc(30px + -25%) calc(30px + -25%)\]]
expected: FAIL
[CSS Animations: property <object-position> from [50% 100%\] to [50px 100px\] at (1.5) should be [calc(-25% + 75px) calc(-50% + 150px)\]]
expected: FAIL
[Web Animations: property <object-position> from [50% 100%\] to [0px 0px\] at (1.5) should be [-25% -50%\]]
expected: FAIL
[CSS Transitions with transition: all: property <object-position> from [center\] to [top right\] at (-0.3) should be [35% 65%\]]
expected: FAIL
[CSS Transitions with transition: all: property <object-position> from [50% 100%\] to [50px 100px\] at (-0.3) should be [calc(65% + -15px) calc(130% + -30px)\]]
expected: FAIL
[CSS Animations: property <object-position> from [unset\] to [20px 20px\] at (1) should be [calc(20px + 0%) calc(20px + 0%)\]]
expected: FAIL
[CSS Animations: property <object-position> from [100px 200px\] to [0px 0px\] at (-0.3) should be [130px 260px\]]
expected: FAIL
[CSS Transitions: property <object-position> from [inherit\] to [20px 20px\] at (-0.3) should be [33px 7px\]]
expected: FAIL
[Web Animations: property <object-position> from [50% 100%\] to [50px 100px\] at (0.5) should be [calc(25% + 25px) calc(50% + 50px)\]]
expected: FAIL
[CSS Transitions with transition: all: property <object-position> from [inherit\] to [20px 20px\] at (1.5) should be [15px 25px\]]
expected: FAIL
[CSS Transitions with transition: all: property <object-position> from [center\] to [right 0% bottom 50%\] at (0.9) should be [95% 50%\]]
expected: FAIL
[CSS Animations: property <object-position> from [center\] to [right 0% bottom 50%\] at (0.3) should be [65% 50%\]]
expected: FAIL
[CSS Transitions: property <object-position> from [center\] to [right 0% bottom 50%\] at (0) should be [center\]]
expected: FAIL
[CSS Transitions with transition: all: property <object-position> from [center\] to [right 0% bottom 50%\] at (0.3) should be [65% 50%\]]
expected: FAIL
[CSS Transitions with transition: all: property <object-position> from [50% 100%\] to [0px 0px\] at (1.5) should be [-25% -50%\]]
expected: FAIL
[CSS Transitions: property <object-position> from [unset\] to [20px 20px\] at (0.5) should be [calc(10px + 25%) calc(10px + 25%)\]]
expected: FAIL
[CSS Transitions: property <object-position> from [50% 50%\] to [100% 100%\] at (1.5) should be [125% 125%\]]
expected: FAIL
[CSS Transitions with transition: all: property <object-position> from [100px 200px\] to [0px 0px\] at (-0.3) should be [130px 260px\]]
expected: FAIL
[CSS Transitions: property <object-position> from [50% 100%\] to [50px 100px\] at (0.5) should be [calc(25% + 25px) calc(50% + 50px)\]]
expected: FAIL
[CSS Animations: property <object-position> from [center\] to [right 0% bottom 50%\] at (0.5) should be [75% 50%\]]
expected: FAIL
[Web Animations: property <object-position> from [100px 200px\] to [0px 0px\] at (0) should be [100px 200px\]]
expected: FAIL
[CSS Transitions with transition: all: property <object-position> from [center\] to [top right\] at (0) should be [50% 50%\]]
expected: FAIL
[CSS Transitions: property <object-position> from [initial\] to [20px 20px\] at (0.5) should be [calc(10px + 25%) calc(10px + 25%)\]]
expected: FAIL
[CSS Animations: property <object-position> from [50% 100%\] to [50px 100px\] at (1) should be [calc(0% + 50px) calc(0% + 100px)\]]
expected: FAIL
[CSS Transitions: property <object-position> from [100px 200px\] to [0px 0px\] at (0.5) should be [50px 100px\]]
expected: FAIL
[CSS Animations: property <object-position> from [center\] to [top right\] at (1) should be [100% 0%\]]
expected: FAIL
[Web Animations: property <object-position> from [50% 100%\] to [0px 0px\] at (0) should be [50% 100%\]]
expected: FAIL
[Web Animations: property <object-position> from [center\] to [right 0% bottom 50%\] at (-0.5) should be [25% 50%\]]
expected: FAIL
[CSS Transitions with transition: all: property <object-position> from [center\] to [right 0% bottom 50%\] at (1.5) should be [125% 50%\]]
expected: FAIL
[CSS Transitions with transition: all: property <object-position> from [50% 50%\] to [100% 100%\] at (1.5) should be [125% 125%\]]
expected: FAIL
[CSS Transitions: property <object-position> from [100px 200px\] to [0px 0px\] at (1) should be [0px 0px\]]
expected: FAIL
[CSS Animations: property <object-position> from [center\] to [right 0% bottom 50%\] at (1.5) should be [125% 50%\]]
expected: FAIL
[Web Animations: property <object-position> from [100px 200px\] to [0px 0px\] at (1) should be [0px 0px\]]
expected: FAIL
[CSS Animations: property <object-position> from [center\] to [right 0% bottom 50%\] at (0.9) should be [95% 50%\]]
expected: FAIL
[CSS Animations: property <object-position> from [unset\] to [20px 20px\] at (0) should be [50% 50%\]]
expected: FAIL
[CSS Transitions: property <object-position> from [center\] to [right 0% bottom 50%\] at (0.9) should be [95% 50%\]]
expected: FAIL
[CSS Transitions with transition: all: property <object-position> from [50% 50%\] to [100% 100%\] at (0) should be [50% 50%\]]
expected: FAIL
[CSS Transitions with transition: all: property <object-position> from neutral to [20px 20px\] at (1.5) should be [25px 15px\]]
expected: FAIL
[CSS Transitions: property <object-position> from [center\] to [top right\] at (0) should be [50% 50%\]]
expected: FAIL
[CSS Transitions with transition: all: property <object-position> from neutral to [20px 20px\] at (0) should be [10px 30px\]]
expected: FAIL
[CSS Animations: property <object-position> from [initial\] to [20px 20px\] at (1.5) should be [calc(30px + -25%) calc(30px + -25%)\]]
expected: FAIL
[CSS Transitions with transition: all: property <object-position> from [initial\] to [20px 20px\] at (-0.3) should be [calc(-6px + 65%) calc(-6px + 65%)\]]
expected: FAIL
[CSS Animations: property <object-position> from neutral to [20px 20px\] at (1) should be [20px 20px\]]
expected: FAIL
[CSS Transitions: property <object-position> from [50% 50%\] to [100% 100%\] at (1) should be [100% 100%\]]
expected: FAIL
[CSS Transitions: property <object-position> from [initial\] to [20px 20px\] at (-0.3) should be [calc(-6px + 65%) calc(-6px + 65%)\]]
expected: FAIL
[CSS Animations: property <object-position> from [50% 100%\] to [0px 0px\] at (-0.3) should be [65% 130%\]]
expected: FAIL
[Web Animations: property <object-position> from [50% 100%\] to [50px 100px\] at (-0.3) should be [calc(65% + -15px) calc(130% + -30px)\]]
expected: FAIL
[Web Animations: property <object-position> from [50% 100%\] to [0px 0px\] at (1) should be [0px 0px\]]
expected: FAIL
[CSS Transitions with transition: all: property <object-position> from [center\] to [top right\] at (0.5) should be [75% 25%\]]
expected: FAIL
[CSS Transitions with transition: all: property <object-position> from [center\] to [right 0% bottom 50%\] at (0) should be [center\]]
expected: FAIL
[CSS Transitions: property <object-position> from [50% 100%\] to [50px 100px\] at (1.5) should be [calc(-25% + 75px) calc(-50% + 150px)\]]
expected: FAIL
[CSS Transitions with transition: all: property <object-position> from [inherit\] to [20px 20px\] at (1) should be [20px 20px\]]
expected: FAIL
[CSS Transitions with transition: all: property <object-position> from [inherit\] to [20px 20px\] at (0) should be [30px 10px\]]
expected: FAIL
[CSS Animations: property <object-position> from [inherit\] to [20px 20px\] at (1) should be [20px 20px\]]
expected: FAIL
[CSS Transitions with transition: all: property <object-position> from [50% 100%\] to [0px 0px\] at (0) should be [50% 100%\]]
expected: FAIL
[CSS Animations: property <object-position> from [initial\] to [20px 20px\] at (-0.3) should be [calc(-6px + 65%) calc(-6px + 65%)\]]
expected: FAIL
[CSS Transitions with transition: all: property <object-position> from [50% 100%\] to [50px 100px\] at (1) should be [calc(0% + 50px) calc(0% + 100px)\]]
expected: FAIL
[Web Animations: property <object-position> from [50% 100%\] to [0px 0px\] at (-0.3) should be [65% 130%\]]
expected: FAIL
[CSS Animations: property <object-position> from [100px 200px\] to [0px 0px\] at (0) should be [100px 200px\]]
expected: FAIL
[CSS Animations: property <object-position> from [initial\] to [20px 20px\] at (1) should be [calc(20px + 0%) calc(20px + 0%)\]]
expected: FAIL
[CSS Transitions with transition: all: property <object-position> from [unset\] to [20px 20px\] at (1.5) should be [calc(30px + -25%) calc(30px + -25%)\]]
expected: FAIL
[CSS Transitions: property <object-position> from [50% 100%\] to [0px 0px\] at (1.5) should be [-25% -50%\]]
expected: FAIL
[CSS Animations: property <object-position> from [unset\] to [20px 20px\] at (-0.3) should be [calc(-6px + 65%) calc(-6px + 65%)\]]
expected: FAIL
[CSS Transitions: property <object-position> from [inherit\] to [20px 20px\] at (0.5) should be [25px 15px\]]
expected: FAIL
[CSS Transitions with transition: all: property <object-position> from [center\] to [top right\] at (1.5) should be [125% -25%\]]
expected: FAIL
[Web Animations: property <object-position> from neutral to [20px 20px\] at (0) should be [10px 30px\]]
expected: FAIL
[CSS Transitions: property <object-position> from [center\] to [top right\] at (-0.3) should be [35% 65%\]]
expected: FAIL
[Web Animations: property <object-position> from [100px 200px\] to [0px 0px\] at (-0.3) should be [130px 260px\]]
expected: FAIL
[CSS Animations: property <object-position> from [center\] to [right 0% bottom 50%\] at (2) should be [150% 50%\]]
expected: FAIL
[CSS Transitions with transition: all: property <object-position> from [center\] to [right 0% bottom 50%\] at (-0.5) should be [25% 50%\]]
expected: FAIL
[Web Animations: property <object-position> from neutral to [20px 20px\] at (1.5) should be [25px 15px\]]
expected: FAIL
[Web Animations: property <object-position> from [inherit\] to [20px 20px\] at (1.5) should be [15px 25px\]]
expected: FAIL
[CSS Transitions with transition: all: property <object-position> from [unset\] to [20px 20px\] at (0) should be [50% 50%\]]
expected: FAIL
[CSS Transitions with transition: all: property <object-position> from [50% 50%\] to [100% 100%\] at (-0.3) should be [35% 35%\]]
expected: FAIL
[CSS Animations: property <object-position> from [50% 100%\] to [0px 0px\] at (1.5) should be [-25% -50%\]]
expected: FAIL
[CSS Transitions: property <object-position> from [center\] to [right 0% bottom 50%\] at (1) should be [100% 50%\]]
expected: FAIL
[Web Animations: property <object-position> from neutral to [20px 20px\] at (0.5) should be [15px 25px\]]
expected: FAIL
[CSS Transitions: property <object-position> from [unset\] to [20px 20px\] at (-0.3) should be [calc(-6px + 65%) calc(-6px + 65%)\]]
expected: FAIL
[CSS Transitions: property <object-position> from [unset\] to [20px 20px\] at (1.5) should be [calc(30px + -25%) calc(30px + -25%)\]]
expected: FAIL
[CSS Transitions with transition: all: property <object-position> from [50% 50%\] to [100% 100%\] at (0.5) should be [75% 75%\]]
expected: FAIL
[CSS Transitions: property <object-position> from [100px 200px\] to [0px 0px\] at (0) should be [100px 200px\]]
expected: FAIL
[Web Animations: property <object-position> from [inherit\] to [20px 20px\] at (-0.3) should be [33px 7px\]]
expected: FAIL
[Web Animations: property <object-position> from [50% 100%\] to [0px 0px\] at (0.5) should be [25% 50%\]]
expected: FAIL
[CSS Transitions with transition: all: property <object-position> from neutral to [20px 20px\] at (-0.3) should be [7px 33px\]]
expected: FAIL
[CSS Transitions: property <object-position> from [50% 100%\] to [0px 0px\] at (0) should be [50% 100%\]]
expected: FAIL
[Web Animations: property <object-position> from [inherit\] to [20px 20px\] at (0) should be [30px 10px\]]
expected: FAIL
[CSS Transitions with transition: all: property <object-position> from [unset\] to [20px 20px\] at (-0.3) should be [calc(-6px + 65%) calc(-6px + 65%)\]]
expected: FAIL
[CSS Transitions: property <object-position> from [center\] to [right 0% bottom 50%\] at (1.5) should be [125% 50%\]]
expected: FAIL
[CSS Animations: property <object-position> from [center\] to [top right\] at (0.5) should be [75% 25%\]]
expected: FAIL

61
tests/wpt/metadata/css/css-transforms/animation/perspective-composition.html.ini Normal file
View file

@ -0,0 +1,61 @@
[perspective-composition.html]
[Compositing: property <perspective> underlying [50px\] from add [100px\] to replace [200px\] at (1.5) should be [225px\]]
expected: FAIL
[Compositing: property <perspective> underlying [100px\] from add [100px\] to add [none\] at (1.5) should be [none\]]
expected: FAIL
[Compositing: property <perspective> underlying [50px\] from add [100px\] to add [200px\] at (0.5) should be [200px\]]
expected: FAIL
[Compositing: property <perspective> underlying [100px\] from add [100px\] to add [none\] at (1) should be [none\]]
expected: FAIL
[Compositing: property <perspective> underlying [100px\] from add [100px\] to add [none\] at (-0.3) should be [200px\]]
expected: FAIL
[Compositing: property <perspective> underlying [100px\] from add [10px\] to add [2px\] at (0.5) should be [106px\]]
expected: FAIL
[Compositing: property <perspective> underlying [100px\] from add [10px\] to add [2px\] at (1) should be [102px\]]
expected: FAIL
[Compositing: property <perspective> underlying [100px\] from add [10px\] to add [2px\] at (-0.5) should be [114px\]]
expected: FAIL
[Compositing: property <perspective> underlying [50px\] from add [100px\] to add [200px\] at (1) should be [250px\]]
expected: FAIL
[Compositing: property <perspective> underlying [100px\] from add [100px\] to add [none\] at (0.5) should be [none\]]
expected: FAIL
[Compositing: property <perspective> underlying [50px\] from add [100px\] to add [200px\] at (1.5) should be [300px\]]
expected: FAIL
[Compositing: property <perspective> underlying [100px\] from add [10px\] to add [2px\] at (0) should be [110px\]]
expected: FAIL
[Compositing: property <perspective> underlying [50px\] from add [100px\] to replace [200px\] at (0.5) should be [175px\]]
expected: FAIL
[Compositing: property <perspective> underlying [50px\] from add [100px\] to replace [200px\] at (1) should be [200px\]]
expected: FAIL
[Compositing: property <perspective> underlying [50px\] from add [100px\] to add [200px\] at (0) should be [150px\]]
expected: FAIL
[Compositing: property <perspective> underlying [50px\] from add [100px\] to replace [200px\] at (0) should be [150px\]]
expected: FAIL
[Compositing: property <perspective> underlying [50px\] from add [100px\] to add [200px\] at (-0.3) should be [120px\]]
expected: FAIL
[Compositing: property <perspective> underlying [100px\] from add [100px\] to add [none\] at (0) should be [200px\]]
expected: FAIL
[Compositing: property <perspective> underlying [100px\] from add [10px\] to add [2px\] at (1.5) should be [98px\]]
expected: FAIL
[Compositing: property <perspective> underlying [50px\] from add [100px\] to replace [200px\] at (-0.3) should be [135px\]]
expected: FAIL

187
tests/wpt/metadata/css/css-transforms/animation/rotate-composition.html.ini Normal file
View file

@ -0,0 +1,187 @@
[rotate-composition.html]
[Compositing: property <rotate> underlying [1 2 3 90deg\] from add [none\] to replace [0 1 0 100deg\] at (-1) should be [0.31 -0.22 0.92 131.66deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [1 2 3 270deg\] from add [1 2 3 90deg\] to replace [0 1 0 100deg\] at (0.75) should be [-1.51909e-17 1 -4.55726e-17 75deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [none\] from add [none\] to replace [0 1 0 100deg\] at (-1) should be [0 1 0 -100deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [1 2 3 90deg\] from add [none\] to replace [0 1 0 100deg\] at (1) should be [0 1 0 100deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [1 0 0 200deg\] from add [1 0 0 -100deg\] to replace [1 0 0 40deg\] at (-1) should be [1 0 0 160deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [1 2 3 90deg\] from add [2 4 6 270deg\] to replace [none\] at (0.25) should be [1 2 3 270deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [1 0 0 90deg\] from add [0 1 0 180deg\] to replace [0 0 1 90deg\] at (0.25) should be [-1.48952e-16 -0.894427 -0.447214 131.81deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [none\] from add [none\] to replace [0 1 0 100deg\] at (1) should be [0 1 0 100deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [1 2 3 270deg\] from add [1 2 3 90deg\] to replace [0 1 0 100deg\] at (0.25) should be [-1.20172e-16 1 -3.60516e-16 25deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [1 2 3 90deg\] from add [2 4 6 270deg\] to replace [0 1 0 100deg\] at (0.75) should be [-1.51909e-17 1 -4.55726e-17 75deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [1 0 0 90deg\] from add [0 1 0 180deg\] to replace [0 0 1 90deg\] at (-1) should be [-6.12323e-17 -1 1.57009e-16 90deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [1 2 3 90deg\] from add [none\] to replace [0 1 0 100deg\] at (2) should be [-0.2 0.79 -0.59 151.11deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [1 2 3 90deg\] from add [2 4 6 270deg\] to replace [none\] at (2) should be [1 2 3 -360deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [0 1 0 -40deg\] from replace [0 1 0 50deg\] to add [0 1 0 10deg\] at (-1) should be [0 1 0 130deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [none\] from add [none\] to replace [0 1 0 100deg\] at (0.75) should be [0 1 0 75deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [1 0 0 200deg\] from add [1 0 0 -100deg\] to replace [1 0 0 40deg\] at (0) should be [1 0 0 100deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [1 2 3 90deg\] from add [2 4 6 270deg\] to replace [0 1 0 100deg\] at (0.25) should be [-1.20172e-16 1 -3.60516e-16 25deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [1 2 3 90deg\] from add [2 4 6 270deg\] to replace [0 1 0 100deg\] at (2) should be [-3.3235e-17 -1 -9.97049e-17 160deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [1 2 3 40deg\] from add [2 4 6 10deg\] to add [3 6 9 50deg\] at (0) should be [1 2 3 50deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [0 1 0 -40deg\] from replace [0 1 0 50deg\] to add [0 1 0 10deg\] at (2) should be [0 1 0 -110deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [1 0 0 90deg\] from add [0 1 0 180deg\] to replace [0 0 1 90deg\] at (1) should be [90deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [1 2 3 270deg\] from add [1 2 3 90deg\] to replace [0 1 0 100deg\] at (2) should be [-3.3235e-17 -1 -9.97049e-17 160deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [100deg\] from add [10deg\] to add [30deg\] at (1) should be [130deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [none\] from add [2 4 6 270deg\] to replace [none\] at (0) should be [2 4 6 270deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [none\] from add [2 4 6 270deg\] to replace [none\] at (-1) should be [2 4 6 540deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [1 2 3 90deg\] from add [2 4 6 270deg\] to replace [0 1 0 100deg\] at (1) should be [0 1 0 100deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [1 2 3 40deg\] from add [2 4 6 10deg\] to add [3 6 9 50deg\] at (0.75) should be [1 2 3 80deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [1 2 3 270deg\] from add [1 2 3 90deg\] to replace [0 1 0 100deg\] at (0) should be [1 2 3 360deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [1 2 3 270deg\] from add [1 2 3 90deg\] to replace [0 1 0 100deg\] at (-1) should be [-5.49276e-17 -1 -1.64783e-16 100deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [1 2 3 40deg\] from add [2 4 6 10deg\] to add [3 6 9 50deg\] at (-1) should be [1 2 3 10deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [1 2 3 270deg\] from add [1 2 3 90deg\] to replace [0 1 0 100deg\] at (1) should be [0 1 0 100deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [1 2 3 40deg\] from add [2 4 6 10deg\] to add [3 6 9 50deg\] at (1) should be [1 2 3 90deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [1 2 3 90deg\] from add [2 4 6 270deg\] to replace [none\] at (1) should be [none\]]
expected: FAIL
[Compositing: property <rotate> underlying [1 0 0 200deg\] from add [1 0 0 -100deg\] to replace [1 0 0 40deg\] at (2) should be [1 0 0 -20deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [100deg\] from add [10deg\] to add [30deg\] at (2) should be [150deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [1 2 3 90deg\] from add [none\] to replace [0 1 0 100deg\] at (0.25) should be [0.21 0.73 0.64 86.72deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [100deg\] from add [10deg\] to add [30deg\] at (-1) should be [90deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [1 0 0 200deg\] from add [1 0 0 -100deg\] to replace [1 0 0 40deg\] at (1) should be [1 0 0 40deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [1 2 3 90deg\] from add [2 4 6 270deg\] to replace [none\] at (-1) should be [1 2 3 720deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [1 2 3 40deg\] from add [2 4 6 10deg\] to add [3 6 9 50deg\] at (0.25) should be [1 2 3 60deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [100deg\] from add [10deg\] to add [30deg\] at (0) should be [110deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [1 0 0 200deg\] from add [1 0 0 -100deg\] to replace [1 0 0 40deg\] at (0.75) should be [1 0 0 55deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [1 0 0 200deg\] from add [1 0 0 -100deg\] to replace [1 0 0 40deg\] at (0.25) should be [1 0 0 85deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [1 0 0 90deg\] from add [0 1 0 180deg\] to replace [0 0 1 90deg\] at (2) should be [-6.12323e-17 -1 -4.71028e-16 90deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [1 2 3 90deg\] from add [2 4 6 270deg\] to replace [0 1 0 100deg\] at (-1) should be [-5.49276e-17 -1 -1.64783e-16 100deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [0 1 0 -40deg\] from replace [0 1 0 50deg\] to add [0 1 0 10deg\] at (0.25) should be [0 1 0 30deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [none\] from add [2 4 6 270deg\] to replace [none\] at (0.75) should be [2 4 6 67.5deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [1 2 3 90deg\] from add [2 4 6 270deg\] to replace [0 1 0 100deg\] at (0) should be [1 2 3 360deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [none\] from add [none\] to replace [0 1 0 100deg\] at (2) should be [0 1 0 200deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [1 2 3 90deg\] from add [none\] to replace [0 1 0 100deg\] at (0.75) should be [0.07 0.97 0.21 92.05deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [100deg\] from add [10deg\] to add [30deg\] at (0.75) should be [125deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [none\] from add [2 4 6 270deg\] to replace [none\] at (0.25) should be [2 4 6 202.5deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [none\] from add [2 4 6 270deg\] to replace [none\] at (2) should be [2 4 6 -270deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [0 1 0 -40deg\] from replace [0 1 0 50deg\] to add [0 1 0 10deg\] at (0.75) should be [0 1 0 -10deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [0 1 0 -40deg\] from replace [0 1 0 50deg\] to add [0 1 0 10deg\] at (1) should be [0 1 0 -30deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [100deg\] from add [10deg\] to add [30deg\] at (0.25) should be [115deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [1 2 3 40deg\] from add [2 4 6 10deg\] to add [3 6 9 50deg\] at (2) should be [1 2 3 130deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [none\] from add [none\] to replace [0 1 0 100deg\] at (0.25) should be [0 1 0 25deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [1 2 3 90deg\] from add [2 4 6 270deg\] to replace [none\] at (0) should be [1 2 3 360deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [0 1 0 -40deg\] from replace [0 1 0 50deg\] to add [0 1 0 10deg\] at (0) should be [0 1 0 50deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [1 0 0 90deg\] from add [0 1 0 180deg\] to replace [0 0 1 90deg\] at (0.75) should be [-2.94392e-17 -0.707107 0.707107 70.5288deg\]]
expected: FAIL
[Compositing: property <rotate> underlying [1 0 0 90deg\] from add [0 1 0 180deg\] to replace [0 0 1 90deg\] at (0) should be [-4.32978e-17 -0.707107 -0.707107 180deg\]]
expected: FAIL

115
tests/wpt/metadata/css/css-transforms/animation/scale-composition.html.ini Normal file
View file

@ -0,0 +1,115 @@
[scale-composition.html]
[Compositing: property <scale> underlying [1 2 3\] from add [none\] to replace [7 8 9\] at (-0.5) should be [-2 -1 0\]]
expected: FAIL
[Compositing: property <scale> underlying [1 2 3\] from add [4 5 6\] to replace [none\] at (1.5) should be [-0.5 -3.5 -7.5\]]
expected: FAIL
[Compositing: property <scale> underlying [1 2 3\] from add [4 5 6\] to replace [7 8 9\] at (-0.5) should be [2.5 11 22.5\]]
expected: FAIL
[Compositing: property <scale> underlying [none\] from add [none\] to replace [1.5 1\] at (2) should be [2 1\]]
expected: FAIL
[Compositing: property <scale> underlying [none\] from add [none\] to replace [1.5 1\] at (0) should be [1\]]
expected: FAIL
[Compositing: property <scale> underlying [1 2 3\] from add [4 5 6\] to replace [none\] at (-0.5) should be [5.5 14.5 26.5\]]
expected: FAIL
[Compositing: property <scale> underlying [none\] from add [none\] to replace [1.5 1\] at (-1) should be [0.5 1\]]
expected: FAIL
[Compositing: property <scale> underlying [2 1\] from add [3 1\] to add [4 1\] at (0.25) should be [6.5 1\]]
expected: FAIL
[Compositing: property <scale> underlying [1 2 3\] from add [4 5 6\] to replace [none\] at (1) should be [none\]]
expected: FAIL
[Compositing: property <scale> underlying [2 1\] from add [3 1\] to add [4 1\] at (0.75) should be [7.5 1\]]
expected: FAIL
[Compositing: property <scale> underlying [1 2 3\] from add [none\] to replace [7 8 9\] at (0.75) should be [5.5 6.5 7.5\]]
expected: FAIL
[Compositing: property <scale> underlying [1 2 3\] from add [4 5 6\] to replace [7 8 9\] at (0.75) should be [6.25 8.5 11.25\]]
expected: FAIL
[Compositing: property <scale> underlying [none\] from add [none\] to replace [1.5 1\] at (1) should be [1.5 1\]]
expected: FAIL
[Compositing: property <scale> underlying [1 2 3\] from add [4 5 6\] to replace [7 8 9\] at (1.5) should be [8.5 7 4.5\]]
expected: FAIL
[Compositing: property <scale> underlying [1 2 3\] from add [4 5 6\] to replace [7 8 9\] at (0) should be [4 10 18\]]
expected: FAIL
[Compositing: property <scale> underlying [none\] from add [4 5 6\] to replace [none\] at (0.75) should be [1.75 2 2.25\]]
expected: FAIL
[Compositing: property <scale> underlying [2 1\] from add [3 1\] to add [4 1\] at (1) should be [8 1\]]
expected: FAIL
[Compositing: property <scale> underlying [1 2 3\] from add [none\] to replace [7 8 9\] at (1) should be [7 8 9\]]
expected: FAIL
[Compositing: property <scale> underlying [1 2 3\] from add [4 5 6\] to replace [none\] at (0.25) should be [3.25 7.75 13.75\]]
expected: FAIL
[Compositing: property <scale> underlying [none\] from add [none\] to replace [1.5 1\] at (0.25) should be [1.125 1\]]
expected: FAIL
[Compositing: property <scale> underlying [1 2 3\] from add [4 5 6\] to replace [7 8 9\] at (1) should be [7 8 9\]]
expected: FAIL
[Compositing: property <scale> underlying [2 1\] from add [3 1\] to add [4 1\] at (1.5) should be [9 1\]]
expected: FAIL
[Compositing: property <scale> underlying [none\] from add [4 5 6\] to replace [none\] at (0.25) should be [3.25 4 4.75\]]
expected: FAIL
[Compositing: property <scale> underlying [1 2 3\] from add [4 5 6\] to replace [7 8 9\] at (0.25) should be [4.75 9.5 15.75\]]
expected: FAIL
[Compositing: property <scale> underlying [1 2 3\] from add [4 5 6\] to replace [none\] at (0) should be [4 10 18\]]
expected: FAIL
[Compositing: property <scale> underlying [1 2 3\] from add [4 5 6\] to replace [none\] at (0.5) should be [2.5 5.5 9.5\]]
expected: FAIL
[Compositing: property <scale> underlying [1 2 3\] from add [none\] to replace [7 8 9\] at (0.25) should be [2.5 3.5 4.5\]]
expected: FAIL
[Compositing: property <scale> underlying [2 1\] from add [3 1\] to add [4 1\] at (0) should be [6 1\]]
expected: FAIL
[Compositing: property <scale> underlying [1 2 3\] from add [4 5 6\] to replace [7 8 9\] at (0.5) should be [5.5 9 13.5\]]
expected: FAIL
[Compositing: property <scale> underlying [1 2 3\] from add [4 5 6\] to replace [none\] at (0.75) should be [1.75 3.25 5.25\]]
expected: FAIL
[Compositing: property <scale> underlying [none\] from add [4 5 6\] to replace [none\] at (0) should be [4 5 6\]]
expected: FAIL
[Compositing: property <scale> underlying [none\] from add [4 5 6\] to replace [none\] at (2) should be [-2 -3 -4\]]
expected: FAIL
[Compositing: property <scale> underlying [2 1\] from add [3 1\] to add [4 1\] at (-0.5) should be [5 1\]]
expected: FAIL
[Compositing: property <scale> underlying [1 2 3\] from add [none\] to replace [7 8 9\] at (0.5) should be [4 5 6\]]
expected: FAIL
[Compositing: property <scale> underlying [2 1\] from add [3 1\] to add [4 1\] at (0.5) should be [7 1\]]
expected: FAIL
[Compositing: property <scale> underlying [none\] from add [4 5 6\] to replace [none\] at (-1) should be [7 9 11\]]
expected: FAIL
[Compositing: property <scale> underlying [1 2 3\] from add [none\] to replace [7 8 9\] at (1.5) should be [10 11 12\]]
expected: FAIL
[Compositing: property <scale> underlying [none\] from add [none\] to replace [1.5 1\] at (0.75) should be [1.375 1\]]
expected: FAIL

64
tests/wpt/metadata/css/css-transforms/animation/transform-composition.html.ini Normal file
View file

@ -0,0 +1,64 @@
[transform-composition.html]
[Compositing: property <transform> underlying [rotateX(90deg)\] from add [translate(100px, 100px)\] to add [scale(2)\] at (1) should be [matrix3d(2, 0, 0, 0, 0, 1.22465e-16, 2, 0, 0, -1, 6.12323e-17, 0, 0, 0, 0, 1)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateX(90deg)\] from add [translate(100px, 100px)\] to add [scale(2)\] at (0) should be [matrix3d(1, 0, 0, 0, 0, 6.12323e-17, 1, 0, 0, -1, 6.12323e-17, 0, 100, 6.12323e-15, 100, 1)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateX(100deg) rotateY(100deg)\] from add [translate(10px, 20px)\] to replace [rotateX(200deg) rotateY(200deg) translate(110px, 220px)\] at (0.5) should be [rotateX(150deg) rotateY(150deg) translate(60px, 120px)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateX(100deg) rotateY(100deg)\] from add [translate(10px, 20px)\] to replace [rotateX(200deg) rotateY(200deg) translate(110px, 220px)\] at (1) should be [rotateX(200deg) rotateY(200deg) translate(110px, 220px)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateX(90deg)\] from add [translate(100px, 100px)\] to add [scale(2)\] at (0.75) should be [matrix3d(1.75, 0, 0, 0, 0, 3.88578e-16, 1.75, 0, 0, -1, 2.22045e-16, 0, 25, 1.53081e-15, 25, 1)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateX(100deg) rotateY(100deg)\] from add [translate(10px, 20px)\] to replace [rotateX(200deg) rotateY(200deg) translate(110px, 220px)\] at (1.5) should be [rotateX(250deg) rotateY(250deg) translate(160px, 320px)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateX(100deg) rotateY(100deg)\] from add [translate(10px, 20px)\] to replace [rotateX(200deg) rotateY(200deg) translate(110px, 220px)\] at (-0.5) should be [rotateX(50deg) rotateY(50deg) translate(-40px, -80px)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateX(45deg)\] from add [none\] to add [rotateY(360deg)\] at (0.5) should be [rotateX(45deg) rotateY(180deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateX(100deg) rotateY(100deg)\] from add [translate(10px, 20px)\] to replace [rotateX(200deg) rotateY(200deg) translate(110px, 220px)\] at (0) should be [rotateX(100deg) rotateY(100deg) translate(10px, 20px)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateX(90deg)\] from add [translate(100px, 100px)\] to add [scale(2)\] at (0.5) should be [matrix3d(1.5, 0, 0, 0, 0, 3.33067e-16, 1.5, 0, 0, -1, 2.22045e-16, 0, 50, 3.06162e-15, 50, 1)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateX(90deg)\] from add [translate(100px, 100px)\] to add [scale(2)\] at (0.25) should be [matrix3d(1.25, 0, 0, 0, 0, 2.77556e-16, 1.25, 0, 0, -1, 2.22045e-16, 0, 75, 4.59243e-15, 75, 1)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateX(45deg)\] from add [none\] to add [rotateY(360deg)\] at (0) should be [rotateX(45deg) rotateY(0deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateX(90deg)\] from add [translate(100px, 100px)\] to add [scale(2)\] at (-0.5) should be [matrix3d(0.5, 0, 0, 0, 0, 1.11022e-16, 0.5, 0, 0, -1, 2.22045e-16, 0, 150, 9.18485e-15, 150, 1)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateX(100deg) rotateY(100deg)\] from add [translate(10px, 20px)\] to replace [rotateX(200deg) rotateY(200deg) translate(110px, 220px)\] at (0.75) should be [rotateX(175deg) rotateY(175deg) translate(85px, 170px)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateX(45deg)\] from add [none\] to add [rotateY(360deg)\] at (1) should be [rotateX(45deg) rotateY(360deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateX(90deg)\] from add [translate(100px, 100px)\] to add [scale(2)\] at (1.5) should be [matrix3d(2.5, 0, 0, 0, 0, 5.55112e-16, 2.5, 0, 0, -1, 2.22045e-16, 0, -50, -3.06162e-15, -50, 1)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateX(45deg)\] from add [none\] to add [rotateY(360deg)\] at (1.5) should be [rotateX(45deg) rotateY(540deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateX(45deg)\] from add [none\] to add [rotateY(360deg)\] at (0.75) should be [rotateX(45deg) rotateY(270deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateX(100deg) rotateY(100deg)\] from add [translate(10px, 20px)\] to replace [rotateX(200deg) rotateY(200deg) translate(110px, 220px)\] at (0.25) should be [rotateX(125deg) rotateY(125deg) translate(35px, 70px)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateX(45deg)\] from add [none\] to add [rotateY(360deg)\] at (-0.5) should be [rotateX(45deg) rotateY(-180deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateX(45deg)\] from add [none\] to add [rotateY(360deg)\] at (0.25) should be [rotateX(45deg) rotateY(90deg)\]]
expected: FAIL

169
tests/wpt/metadata/css/css-transforms/animation/transform-matrix-composition.html.ini Normal file
View file

@ -0,0 +1,169 @@
[transform-matrix-composition.html]
[Compositing: property <transform> underlying [matrix3d(0.8535533905932737,0.1464466094067262,-0.5,0,0.1464466094067262,0.8535533905932737,0.5,0,0.5,-0.5,0.7071067811865476,0,100,0,0,1)\] from add [matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 100, 0, 0, 1)\] to add [matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 200, 0, 0, 1)\] at (0.5) should be [translateX(100px) rotate3d(1, 1, 0, 45deg) translateX(150px)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix(1, 1, 0, 0, 0, 100)\] from accumulate [matrix(1, 0, 0, 1, 100, 0)\] to accumulate [matrix(1, 0, 0, 1, 200, 0)\] at (0.25) should be [matrix(1, 0, 0, 1, 125, 0)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix(1, 0, 0, 1, 100, 0)\] from add [matrix(1, 1, 0, 0, 0, 100)\] to add [matrix(1, 0, 0, 1, 200, 0)\] at (0.25) should be [matrix(1, 1, 0, 0, 100, 100)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix3d(0.8535533905932737,0.1464466094067262,-0.5,0,0.1464466094067262,0.8535533905932737,0.5,0,0.5,-0.5,0.7071067811865476,0,100,0,0,1)\] from add [matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 100, 0, 0, 1)\] to add [matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 200, 0, 0, 1)\] at (1) should be [translateX(100px) rotate3d(1, 1, 0, 45deg) translateX(200px)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix(1, 0, 0, 1, 100, 0)\] from add [matrix(1, 1, 0, 0, 0, 100)\] to add [matrix(1, 0, 0, 1, 200, 0)\] at (0) should be [matrix(1, 1, 0, 0, 100, 100)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix3d(0.8535533905932737,0.1464466094067262,-0.5,0,0.1464466094067262,0.8535533905932737,0.5,0,0.5,-0.5,0.7071067811865476,0,100,0,0,1)\] from add [matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 100, 0, 0, 1)\] to add [matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 200, 0, 0, 1)\] at (0) should be [translateX(100px) rotate3d(1, 1, 0, 45deg) translateX(100px)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix(0, 1, -1, 0, 100, 0)\] from add [matrix(1, 0, 0, 1, 100, 0)\] to add [matrix(1, 0, 0, 1, 200, 0)\] at (0.25) should be [matrix(0, 1, -1, 0, 100, 125)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix(1, 1, 0, 0, 0, 100)\] from accumulate [matrix(1, 0, 0, 1, 100, 0)\] to accumulate [matrix(1, 0, 0, 1, 200, 0)\] at (0.75) should be [matrix(1, 0, 0, 1, 175, 0)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix(0, 1, -1, 0, 100, 0)\] from add [matrix(1, 0, 0, 1, 100, 0)\] to add [matrix(1, 0, 0, 1, 200, 0)\] at (1) should be [matrix(0, 1, -1, 0, 100, 200)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix3d(0.8535533905932737,0.1464466094067262,-0.5,0,0.1464466094067262,0.8535533905932737,0.5,0,0.5,-0.5,0.7071067811865476,0,100,0,0,1)\] from accumulate [matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 100, 0, 0, 1)\] to accumulate [matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 200, 0, 0, 1)\] at (0.25) should be [translateX(225px) rotate3d(1, 1, 0, 45deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix(0, 1, -1, 0, 100, 0)\] from accumulate [matrix(1, 0, 0, 1, 100, 0)\] to accumulate [matrix(1, 0, 0, 1, 200, 0)\] at (1.5) should be [matrix(0, 1, -1, 0, 350, 0)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix(1, 0, 0, 1, 100, 0)\] from accumulate [matrix(1, 1, 0, 0, 0, 100)\] to accumulate [matrix(1, 0, 0, 1, 200, 0)\] at (-0.5) should be [matrix(1, 1, 0, 0, 0, 100)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix3d(0.8535533905932737,0.1464466094067262,-0.5,0,0.1464466094067262,0.8535533905932737,0.5,0,0.5,-0.5,0.7071067811865476,0,100,0,0,1)\] from add [matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 100, 0, 0, 1)\] to add [matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 200, 0, 0, 1)\] at (1.5) should be [translateX(100px) rotate3d(1, 1, 0, 45deg) translateX(250px)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix(1, 1, 0, 0, 0, 100)\] from add [matrix(1, 0, 0, 1, 100, 0)\] to add [matrix(1, 0, 0, 1, 200, 0)\] at (0.25) should be [matrix(1, 1, 0, 0, 100, 200)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix3d(0.8535533905932737,0.1464466094067262,-0.5,0,0.1464466094067262,0.8535533905932737,0.5,0,0.5,-0.5,0.7071067811865476,0,100,0,0,1)\] from accumulate [matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 100, 0, 0, 1)\] to accumulate [matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 200, 0, 0, 1)\] at (0.75) should be [translateX(275px) rotate3d(1, 1, 0, 45deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix(1, 1, 0, 0, 0, 100)\] from add [matrix(1, 0, 0, 1, 100, 0)\] to add [matrix(1, 0, 0, 1, 200, 0)\] at (-0.5) should be [matrix(1, 1, 0, 0, 100, 200)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix(1, 0, 0, 1, 100, 0)\] from accumulate [matrix(1, 1, 0, 0, 0, 100)\] to accumulate [matrix(1, 0, 0, 1, 200, 0)\] at (0.5) should be [matrix(1, 0, 0, 1, 300, 0)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix3d(0.8535533905932737,0.1464466094067262,-0.5,0,0.1464466094067262,0.8535533905932737,0.5,0,0.5,-0.5,0.7071067811865476,0,100,0,0,1)\] from accumulate [matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 100, 0, 0, 1)\] to accumulate [matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 200, 0, 0, 1)\] at (1.5) should be [translateX(350px) rotate3d(1, 1, 0, 45deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix(1, 1, 0, 0, 0, 100)\] from add [matrix(1, 0, 0, 1, 100, 0)\] to add [matrix(1, 0, 0, 1, 200, 0)\] at (1) should be [matrix(1, 1, 0, 0, 200, 300)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix(1, 1, 0, 0, 0, 100)\] from add [matrix(1, 0, 0, 1, 100, 0)\] to add [matrix(1, 0, 0, 1, 200, 0)\] at (1.5) should be [matrix(1, 1, 0, 0, 200, 300)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix(1, 0, 0, 1, 100, 0)\] from add [matrix(1, 1, 0, 0, 0, 100)\] to add [matrix(1, 0, 0, 1, 200, 0)\] at (1) should be [matrix(1, 0, 0, 1, 300, 0)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix(1, 1, 0, 0, 0, 100)\] from accumulate [matrix(1, 0, 0, 1, 100, 0)\] to accumulate [matrix(1, 0, 0, 1, 200, 0)\] at (1) should be [matrix(1, 0, 0, 1, 200, 0)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix(0, 1, -1, 0, 100, 0)\] from accumulate [matrix(1, 0, 0, 1, 100, 0)\] to accumulate [matrix(1, 0, 0, 1, 200, 0)\] at (0) should be [matrix(0, 1, -1, 0, 200, 0)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix(1, 1, 0, 0, 0, 100)\] from accumulate [matrix(1, 0, 0, 1, 100, 0)\] to accumulate [matrix(1, 0, 0, 1, 200, 0)\] at (0.5) should be [matrix(1, 0, 0, 1, 150, 0)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix3d(0.8535533905932737,0.1464466094067262,-0.5,0,0.1464466094067262,0.8535533905932737,0.5,0,0.5,-0.5,0.7071067811865476,0,100,0,0,1)\] from accumulate [matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 100, 0, 0, 1)\] to accumulate [matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 200, 0, 0, 1)\] at (-0.5) should be [translateX(150px) rotate3d(1, 1, 0, 45deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix(0, 1, -1, 0, 100, 0)\] from accumulate [matrix(1, 0, 0, 1, 100, 0)\] to accumulate [matrix(1, 0, 0, 1, 200, 0)\] at (-0.5) should be [matrix(0, 1, -1, 0, 150, 0)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix(1, 0, 0, 1, 100, 0)\] from accumulate [matrix(1, 1, 0, 0, 0, 100)\] to accumulate [matrix(1, 0, 0, 1, 200, 0)\] at (0) should be [matrix(1, 1, 0, 0, 0, 100)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix(0, 1, -1, 0, 100, 0)\] from accumulate [matrix(1, 0, 0, 1, 100, 0)\] to accumulate [matrix(1, 0, 0, 1, 200, 0)\] at (0.25) should be [matrix(0, 1, -1, 0, 225, 0)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix(1, 1, 0, 0, 0, 100)\] from accumulate [matrix(1, 0, 0, 1, 100, 0)\] to accumulate [matrix(1, 0, 0, 1, 200, 0)\] at (-0.5) should be [matrix(1, 0, 0, 1, 50, 0)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix(1, 1, 0, 0, 0, 100)\] from add [matrix(1, 0, 0, 1, 100, 0)\] to add [matrix(1, 0, 0, 1, 200, 0)\] at (0) should be [matrix(1, 1, 0, 0, 100, 200)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix(1, 0, 0, 1, 100, 0)\] from accumulate [matrix(1, 1, 0, 0, 0, 100)\] to accumulate [matrix(1, 0, 0, 1, 200, 0)\] at (0.75) should be [matrix(1, 0, 0, 1, 300, 0)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix3d(0.8535533905932737,0.1464466094067262,-0.5,0,0.1464466094067262,0.8535533905932737,0.5,0,0.5,-0.5,0.7071067811865476,0,100,0,0,1)\] from accumulate [matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 100, 0, 0, 1)\] to accumulate [matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 200, 0, 0, 1)\] at (0) should be [translateX(200px) rotate3d(1, 1, 0, 45deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix(1, 0, 0, 1, 100, 0)\] from add [matrix(1, 1, 0, 0, 0, 100)\] to add [matrix(1, 0, 0, 1, 200, 0)\] at (0.75) should be [matrix(1, 0, 0, 1, 300, 0)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix3d(0.8535533905932737,0.1464466094067262,-0.5,0,0.1464466094067262,0.8535533905932737,0.5,0,0.5,-0.5,0.7071067811865476,0,100,0,0,1)\] from add [matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 100, 0, 0, 1)\] to add [matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 200, 0, 0, 1)\] at (0.75) should be [translateX(100px) rotate3d(1, 1, 0, 45deg) translateX(175px)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix3d(0.8535533905932737,0.1464466094067262,-0.5,0,0.1464466094067262,0.8535533905932737,0.5,0,0.5,-0.5,0.7071067811865476,0,100,0,0,1)\] from accumulate [matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 100, 0, 0, 1)\] to accumulate [matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 200, 0, 0, 1)\] at (0.5) should be [translateX(250px) rotate3d(1, 1, 0, 45deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix(1, 0, 0, 1, 100, 0)\] from add [matrix(1, 1, 0, 0, 0, 100)\] to add [matrix(1, 0, 0, 1, 200, 0)\] at (-0.5) should be [matrix(1, 1, 0, 0, 100, 100)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix(1, 1, 0, 0, 0, 100)\] from add [matrix(1, 0, 0, 1, 100, 0)\] to add [matrix(1, 0, 0, 1, 200, 0)\] at (0.75) should be [matrix(1, 1, 0, 0, 200, 300)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix(1, 1, 0, 0, 0, 100)\] from accumulate [matrix(1, 0, 0, 1, 100, 0)\] to accumulate [matrix(1, 0, 0, 1, 200, 0)\] at (1.5) should be [matrix(1, 0, 0, 1, 250, 0)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix(0, 1, -1, 0, 100, 0)\] from add [matrix(1, 0, 0, 1, 100, 0)\] to add [matrix(1, 0, 0, 1, 200, 0)\] at (-0.5) should be [matrix(0, 1, -1, 0, 100, 50)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix(1, 0, 0, 1, 100, 0)\] from accumulate [matrix(1, 1, 0, 0, 0, 100)\] to accumulate [matrix(1, 0, 0, 1, 200, 0)\] at (1.5) should be [matrix(1, 0, 0, 1, 300, 0)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix(1, 1, 0, 0, 0, 100)\] from add [matrix(1, 0, 0, 1, 100, 0)\] to add [matrix(1, 0, 0, 1, 200, 0)\] at (0.5) should be [matrix(1, 1, 0, 0, 200, 300)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix3d(0.8535533905932737,0.1464466094067262,-0.5,0,0.1464466094067262,0.8535533905932737,0.5,0,0.5,-0.5,0.7071067811865476,0,100,0,0,1)\] from add [matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 100, 0, 0, 1)\] to add [matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 200, 0, 0, 1)\] at (0.25) should be [translateX(100px) rotate3d(1, 1, 0, 45deg) translateX(125px)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix(0, 1, -1, 0, 100, 0)\] from add [matrix(1, 0, 0, 1, 100, 0)\] to add [matrix(1, 0, 0, 1, 200, 0)\] at (0.5) should be [matrix(0, 1, -1, 0, 100, 150)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix(0, 1, -1, 0, 100, 0)\] from add [matrix(1, 0, 0, 1, 100, 0)\] to add [matrix(1, 0, 0, 1, 200, 0)\] at (1.5) should be [matrix(0, 1, -1, 0, 100, 250)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix(1, 1, 0, 0, 0, 100)\] from accumulate [matrix(1, 0, 0, 1, 100, 0)\] to accumulate [matrix(1, 0, 0, 1, 200, 0)\] at (0) should be [matrix(1, 0, 0, 1, 100, 0)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix(0, 1, -1, 0, 100, 0)\] from accumulate [matrix(1, 0, 0, 1, 100, 0)\] to accumulate [matrix(1, 0, 0, 1, 200, 0)\] at (0.75) should be [matrix(0, 1, -1, 0, 275, 0)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix(1, 0, 0, 1, 100, 0)\] from accumulate [matrix(1, 1, 0, 0, 0, 100)\] to accumulate [matrix(1, 0, 0, 1, 200, 0)\] at (0.25) should be [matrix(1, 1, 0, 0, 0, 100)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix3d(0.8535533905932737,0.1464466094067262,-0.5,0,0.1464466094067262,0.8535533905932737,0.5,0,0.5,-0.5,0.7071067811865476,0,100,0,0,1)\] from accumulate [matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 100, 0, 0, 1)\] to accumulate [matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 200, 0, 0, 1)\] at (1) should be [translateX(300px) rotate3d(1, 1, 0, 45deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix(1, 0, 0, 1, 100, 0)\] from add [matrix(1, 1, 0, 0, 0, 100)\] to add [matrix(1, 0, 0, 1, 200, 0)\] at (0.5) should be [matrix(1, 0, 0, 1, 300, 0)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix3d(0.8535533905932737,0.1464466094067262,-0.5,0,0.1464466094067262,0.8535533905932737,0.5,0,0.5,-0.5,0.7071067811865476,0,100,0,0,1)\] from add [matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 100, 0, 0, 1)\] to add [matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 200, 0, 0, 1)\] at (-0.5) should be [translateX(100px) rotate3d(1, 1, 0, 45deg) translateX(50px)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix(1, 0, 0, 1, 100, 0)\] from add [matrix(1, 1, 0, 0, 0, 100)\] to add [matrix(1, 0, 0, 1, 200, 0)\] at (1.5) should be [matrix(1, 0, 0, 1, 300, 0)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix(1, 0, 0, 1, 100, 0)\] from accumulate [matrix(1, 1, 0, 0, 0, 100)\] to accumulate [matrix(1, 0, 0, 1, 200, 0)\] at (1) should be [matrix(1, 0, 0, 1, 300, 0)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix(0, 1, -1, 0, 100, 0)\] from accumulate [matrix(1, 0, 0, 1, 100, 0)\] to accumulate [matrix(1, 0, 0, 1, 200, 0)\] at (0.5) should be [matrix(0, 1, -1, 0, 250, 0)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix(0, 1, -1, 0, 100, 0)\] from accumulate [matrix(1, 0, 0, 1, 100, 0)\] to accumulate [matrix(1, 0, 0, 1, 200, 0)\] at (1) should be [matrix(0, 1, -1, 0, 300, 0)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix(0, 1, -1, 0, 100, 0)\] from add [matrix(1, 0, 0, 1, 100, 0)\] to add [matrix(1, 0, 0, 1, 200, 0)\] at (0.75) should be [matrix(0, 1, -1, 0, 100, 175)\]]
expected: FAIL
[Compositing: property <transform> underlying [matrix(0, 1, -1, 0, 100, 0)\] from add [matrix(1, 0, 0, 1, 100, 0)\] to add [matrix(1, 0, 0, 1, 200, 0)\] at (0) should be [matrix(0, 1, -1, 0, 100, 100)\]]
expected: FAIL

40
tests/wpt/metadata/css/css-transforms/animation/transform-perspective-composition.html.ini Normal file
View file

@ -0,0 +1,40 @@
[transform-perspective-composition.html]
[Compositing: property <transform> underlying [perspective(10px)\] from accumulate [perspective(10px)\] to accumulate [perspective(50px)\] at (1.5) should be [perspective(12.5px)\]]
expected: FAIL
[Compositing: property <transform> underlying [perspective(10px)\] from accumulate [perspective(10px)\] to accumulate [perspective(50px)\] at (0) should be [perspective(5px)\]]
expected: FAIL
[Compositing: property <transform> underlying [perspective(10px)\] from add [perspective(10px)\] to add [perspective(50px)\] at (-0.5) should be [perspective(4.12px)\]]
expected: FAIL
[Compositing: property <transform> underlying [perspective(10px)\] from accumulate [perspective(10px)\] to accumulate [perspective(50px)\] at (1) should be [perspective(8.33px)\]]
expected: FAIL
[Compositing: property <transform> underlying [perspective(10px)\] from accumulate [perspective(10px)\] to accumulate [perspective(50px)\] at (0.75) should be [perspective(7.06px)\]]
expected: FAIL
[Compositing: property <transform> underlying [perspective(10px)\] from accumulate [perspective(10px)\] to accumulate [perspective(50px)\] at (-0.5) should be [perspective(4.12px)\]]
expected: FAIL
[Compositing: property <transform> underlying [perspective(10px)\] from accumulate [perspective(10px)\] to accumulate [perspective(50px)\] at (0.25) should be [perspective(5.45px)\]]
expected: FAIL
[Compositing: property <transform> underlying [perspective(10px)\] from add [perspective(10px)\] to add [perspective(50px)\] at (1) should be [perspective(8.33px)\]]
expected: FAIL
[Compositing: property <transform> underlying [perspective(10px)\] from add [perspective(10px)\] to add [perspective(50px)\] at (0.75) should be [perspective(7.06px)\]]
expected: FAIL
[Compositing: property <transform> underlying [perspective(10px)\] from add [perspective(10px)\] to add [perspective(50px)\] at (0.25) should be [perspective(5.45px)\]]
expected: FAIL
[Compositing: property <transform> underlying [perspective(10px)\] from accumulate [perspective(10px)\] to accumulate [perspective(50px)\] at (0.5) should be [perspective(6.15px)\]]
expected: FAIL
[Compositing: property <transform> underlying [perspective(10px)\] from add [perspective(10px)\] to add [perspective(50px)\] at (0) should be [perspective(5px)\]]
expected: FAIL
[Compositing: property <transform> underlying [perspective(10px)\] from add [perspective(10px)\] to add [perspective(50px)\] at (0.5) should be [perspective(6.15px)\]]
expected: FAIL

190
tests/wpt/metadata/css/css-transforms/animation/transform-rotate-composition.html.ini Normal file
View file

@ -0,0 +1,190 @@
[transform-rotate-composition.html]
[Compositing: property <transform> underlying [rotateY(20deg)\] from accumulate [rotateY(40deg)\] to accumulate [rotateY(60deg)\] at (1.5) should be [rotateY(90deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateZ(20deg)\] from add [rotateZ(40deg)\] to add [rotateZ(60deg)\] at (-0.5) should be [rotateZ(50deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotate(45deg) skew(10deg, 20deg)\] from add [rotate(45deg)\] to add [rotate(225deg)\] at (1.5) should be [rotate(45deg) skew(10deg, 20deg) rotate(315deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotate(45deg) skew(10deg, 20deg)\] from accumulate [rotate(45deg)\] to accumulate [rotate(225deg)\] at (0) should be [rotate(90deg) skew(10deg, 20deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateX(20deg)\] from accumulate [rotateX(40deg)\] to accumulate [rotateX(60deg)\] at (-0.5) should be [rotateX(50deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotate(45deg) skew(10deg, 20deg)\] from accumulate [rotate(45deg)\] to accumulate [rotate(225deg)\] at (-0.5) should be [rotate(0deg) skew(10deg, 20deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateZ(20deg)\] from add [rotateZ(40deg)\] to add [rotateZ(60deg)\] at (0) should be [rotateZ(60deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateX(20deg)\] from accumulate [rotateX(40deg)\] to accumulate [rotateX(60deg)\] at (0.75) should be [rotateX(75deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateX(20deg)\] from add [rotateX(40deg)\] to add [rotateX(60deg)\] at (-0.5) should be [rotateX(50deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateY(20deg)\] from add [rotateY(40deg)\] to add [rotateY(60deg)\] at (1) should be [rotateY(80deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateX(45deg)\] from accumulate [rotateY(30deg)\] to accumulate [rotateY(70deg)\] at (1.5) should be [rotateX(45deg) rotateY(90deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotate(45deg) skew(10deg, 20deg)\] from add [rotate(45deg)\] to add [rotate(225deg)\] at (1) should be [rotate(45deg) skew(10deg, 20deg) rotate(225deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateX(20deg)\] from accumulate [rotateX(40deg)\] to accumulate [rotateX(60deg)\] at (1) should be [rotateX(80deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateZ(20deg)\] from accumulate [rotateZ(40deg)\] to accumulate [rotateZ(60deg)\] at (1) should be [rotateZ(80deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateY(20deg)\] from accumulate [rotateY(40deg)\] to accumulate [rotateY(60deg)\] at (0.5) should be [rotateY(70deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotate(45deg) skew(10deg, 20deg)\] from accumulate [rotate(45deg)\] to accumulate [rotate(225deg)\] at (0.75) should be [rotate(225deg) skew(10deg, 20deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateX(20deg)\] from accumulate [rotateX(40deg)\] to accumulate [rotateX(60deg)\] at (0) should be [rotateX(60deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateY(20deg)\] from accumulate [rotateY(40deg)\] to accumulate [rotateY(60deg)\] at (0) should be [rotateY(60deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateZ(20deg)\] from add [rotateZ(40deg)\] to add [rotateZ(60deg)\] at (1) should be [rotateZ(80deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotate(45deg) skew(10deg, 20deg)\] from add [rotate(45deg)\] to add [rotate(225deg)\] at (-0.5) should be [rotate(45deg) skew(10deg, 20deg) rotate(-45deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateX(20deg)\] from add [rotateX(40deg)\] to add [rotateX(60deg)\] at (1.5) should be [rotateX(90deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateZ(20deg)\] from add [rotateZ(40deg)\] to add [rotateZ(60deg)\] at (0.5) should be [rotateZ(70deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateY(20deg)\] from accumulate [rotateY(40deg)\] to accumulate [rotateY(60deg)\] at (0.75) should be [rotateY(75deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateX(20deg)\] from add [rotateX(40deg)\] to add [rotateX(60deg)\] at (1) should be [rotateX(80deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotate(45deg) skew(10deg, 20deg)\] from add [rotate(45deg)\] to add [rotate(225deg)\] at (0) should be [rotate(45deg) skew(10deg, 20deg) rotate(45deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateZ(20deg)\] from accumulate [rotateZ(40deg)\] to accumulate [rotateZ(60deg)\] at (1.5) should be [rotateZ(90deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateY(20deg)\] from add [rotateY(40deg)\] to add [rotateY(60deg)\] at (0) should be [rotateY(60deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotate(45deg) skew(10deg, 20deg)\] from add [rotate(45deg)\] to add [rotate(225deg)\] at (0.5) should be [rotate(45deg) skew(10deg, 20deg) rotate(135deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateY(20deg)\] from add [rotateY(40deg)\] to add [rotateY(60deg)\] at (0.5) should be [rotateY(70deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateZ(20deg)\] from accumulate [rotateZ(40deg)\] to accumulate [rotateZ(60deg)\] at (0.75) should be [rotateZ(75deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotate(45deg) skew(10deg, 20deg)\] from add [rotate(45deg)\] to add [rotate(225deg)\] at (0.75) should be [rotate(45deg) skew(10deg, 20deg) rotate(180deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateY(20deg)\] from add [rotateY(40deg)\] to add [rotateY(60deg)\] at (0.75) should be [rotateY(75deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateX(20deg)\] from add [rotateX(40deg)\] to add [rotateX(60deg)\] at (0.75) should be [rotateX(75deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateZ(20deg)\] from add [rotateZ(40deg)\] to add [rotateZ(60deg)\] at (0.25) should be [rotateZ(65deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateY(20deg)\] from add [rotateY(40deg)\] to add [rotateY(60deg)\] at (0.25) should be [rotateY(65deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateX(20deg)\] from accumulate [rotateX(40deg)\] to accumulate [rotateX(60deg)\] at (0.25) should be [rotateX(65deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateZ(20deg)\] from accumulate [rotateZ(40deg)\] to accumulate [rotateZ(60deg)\] at (0.5) should be [rotateZ(70deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateY(20deg)\] from accumulate [rotateY(40deg)\] to accumulate [rotateY(60deg)\] at (-0.5) should be [rotateY(50deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateX(45deg)\] from accumulate [rotateY(30deg)\] to accumulate [rotateY(70deg)\] at (0.25) should be [rotateX(45deg) rotateY(40deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotate(45deg) skew(10deg, 20deg)\] from accumulate [rotate(45deg)\] to accumulate [rotate(225deg)\] at (0.5) should be [rotate(180deg) skew(10deg, 20deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateZ(20deg)\] from accumulate [rotateZ(40deg)\] to accumulate [rotateZ(60deg)\] at (-0.5) should be [rotateZ(50deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateX(20deg)\] from accumulate [rotateX(40deg)\] to accumulate [rotateX(60deg)\] at (1.5) should be [rotateX(90deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateX(20deg)\] from accumulate [rotateX(40deg)\] to accumulate [rotateX(60deg)\] at (0.5) should be [rotateX(70deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateX(45deg)\] from accumulate [rotateY(30deg)\] to accumulate [rotateY(70deg)\] at (0) should be [rotateX(45deg) rotateY(30deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotate(45deg) skew(10deg, 20deg)\] from add [rotate(45deg)\] to add [rotate(225deg)\] at (0.25) should be [rotate(45deg) skew(10deg, 20deg) rotate(90deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateY(20deg)\] from add [rotateY(40deg)\] to add [rotateY(60deg)\] at (1.5) should be [rotateY(90deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateY(20deg)\] from add [rotateY(40deg)\] to add [rotateY(60deg)\] at (-0.5) should be [rotateY(50deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateY(20deg)\] from accumulate [rotateY(40deg)\] to accumulate [rotateY(60deg)\] at (1) should be [rotateY(80deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateX(45deg)\] from accumulate [rotateY(30deg)\] to accumulate [rotateY(70deg)\] at (0.75) should be [rotateX(45deg) rotateY(60deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotate(45deg) skew(10deg, 20deg)\] from accumulate [rotate(45deg)\] to accumulate [rotate(225deg)\] at (1.5) should be [rotate(360deg) skew(10deg, 20deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotate(45deg) skew(10deg, 20deg)\] from accumulate [rotate(45deg)\] to accumulate [rotate(225deg)\] at (0.25) should be [rotate(135deg) skew(10deg, 20deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateY(20deg)\] from accumulate [rotateY(40deg)\] to accumulate [rotateY(60deg)\] at (0.25) should be [rotateY(65deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateX(20deg)\] from add [rotateX(40deg)\] to add [rotateX(60deg)\] at (0.25) should be [rotateX(65deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateZ(20deg)\] from add [rotateZ(40deg)\] to add [rotateZ(60deg)\] at (1.5) should be [rotateZ(90deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateZ(20deg)\] from accumulate [rotateZ(40deg)\] to accumulate [rotateZ(60deg)\] at (0) should be [rotateZ(60deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotate(45deg) skew(10deg, 20deg)\] from accumulate [rotate(45deg)\] to accumulate [rotate(225deg)\] at (1) should be [rotate(270deg) skew(10deg, 20deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateX(20deg)\] from add [rotateX(40deg)\] to add [rotateX(60deg)\] at (0.5) should be [rotateX(70deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateZ(20deg)\] from accumulate [rotateZ(40deg)\] to accumulate [rotateZ(60deg)\] at (0.25) should be [rotateZ(65deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateX(20deg)\] from add [rotateX(40deg)\] to add [rotateX(60deg)\] at (0) should be [rotateX(60deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateZ(20deg)\] from add [rotateZ(40deg)\] to add [rotateZ(60deg)\] at (0.75) should be [rotateZ(75deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateX(45deg)\] from accumulate [rotateY(30deg)\] to accumulate [rotateY(70deg)\] at (0.5) should be [rotateX(45deg) rotateY(50deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateX(45deg)\] from accumulate [rotateY(30deg)\] to accumulate [rotateY(70deg)\] at (1) should be [rotateX(45deg) rotateY(70deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [rotateX(45deg)\] from accumulate [rotateY(30deg)\] to accumulate [rotateY(70deg)\] at (-0.5) should be [rotateX(45deg) rotateY(10deg)\]]
expected: FAIL

148
tests/wpt/metadata/css/css-transforms/animation/transform-scale-composition.html.ini Normal file
View file

@ -0,0 +1,148 @@
[transform-scale-composition.html]
[Compositing: property <transform> underlying [scaleZ(2)\] from accumulate [scaleZ(3)\] to accumulate [scaleZ(4)\] at (-0.5) should be [scaleZ(3.5)\]]
expected: FAIL
[Compositing: property <transform> underlying [scaleY(2)\] from accumulate [scaleY(3)\] to accumulate [scaleY(4)\] at (0.5) should be [scaleY(4.5)\]]
expected: FAIL
[Compositing: property <transform> underlying [scaleX(2)\] from add [scaleX(3)\] to add [scaleX(4)\] at (1.5) should be [scaleX(9)\]]
expected: FAIL
[Compositing: property <transform> underlying [scaleZ(2)\] from add [scaleZ(3)\] to add [scaleZ(4)\] at (-0.5) should be [scaleZ(5)\]]
expected: FAIL
[Compositing: property <transform> underlying [scaleX(2)\] from accumulate [scaleX(3)\] to accumulate [scaleX(4)\] at (0) should be [scaleX(4)\]]
expected: FAIL
[Compositing: property <transform> underlying [scaleZ(2)\] from add [scaleZ(3)\] to add [scaleZ(4)\] at (0.25) should be [scaleZ(6.5)\]]
expected: FAIL
[Compositing: property <transform> underlying [scaleZ(2)\] from accumulate [scaleZ(3)\] to accumulate [scaleZ(4)\] at (1) should be [scaleZ(5)\]]
expected: FAIL
[Compositing: property <transform> underlying [scale(2, 4)\] from accumulate [scaleZ(3)\] to accumulate [scaleZ(4)\] at (0.5) should be [scale3d(2, 4, 3.5)\]]
expected: FAIL
[Compositing: property <transform> underlying [scaleX(2)\] from accumulate [scaleX(3)\] to accumulate [scaleX(4)\] at (-0.5) should be [scaleX(3.5)\]]
expected: FAIL
[Compositing: property <transform> underlying [scale(2, 4)\] from accumulate [scaleZ(3)\] to accumulate [scaleZ(4)\] at (0.75) should be [scale3d(2, 4, 3.75)\]]
expected: FAIL
[Compositing: property <transform> underlying [scaleZ(2)\] from accumulate [scaleZ(3)\] to accumulate [scaleZ(4)\] at (0) should be [scaleZ(4)\]]
expected: FAIL
[Compositing: property <transform> underlying [scaleZ(2)\] from accumulate [scaleZ(3)\] to accumulate [scaleZ(4)\] at (0.5) should be [scaleZ(4.5)\]]
expected: FAIL
[Compositing: property <transform> underlying [scaleX(2)\] from add [scaleX(3)\] to add [scaleX(4)\] at (1) should be [scaleX(8)\]]
expected: FAIL
[Compositing: property <transform> underlying [scaleY(2)\] from accumulate [scaleY(3)\] to accumulate [scaleY(4)\] at (0) should be [scaleY(4)\]]
expected: FAIL
[Compositing: property <transform> underlying [scaleX(2)\] from add [scaleX(3)\] to add [scaleX(4)\] at (0.25) should be [scaleX(6.5)\]]
expected: FAIL
[Compositing: property <transform> underlying [scaleY(2)\] from accumulate [scaleY(3)\] to accumulate [scaleY(4)\] at (1) should be [scaleY(5)\]]
expected: FAIL
[Compositing: property <transform> underlying [scaleZ(2)\] from add [scaleZ(3)\] to add [scaleZ(4)\] at (1.5) should be [scaleZ(9)\]]
expected: FAIL
[Compositing: property <transform> underlying [scale(2, 4)\] from accumulate [scaleZ(3)\] to accumulate [scaleZ(4)\] at (1) should be [scale3d(2, 4, 4)\]]
expected: FAIL
[Compositing: property <transform> underlying [scaleZ(2)\] from accumulate [scaleZ(3)\] to accumulate [scaleZ(4)\] at (1.5) should be [scaleZ(5.5)\]]
expected: FAIL
[Compositing: property <transform> underlying [scaleY(2)\] from accumulate [scaleY(3)\] to accumulate [scaleY(4)\] at (-0.5) should be [scaleY(3.5)\]]
expected: FAIL
[Compositing: property <transform> underlying [scaleX(2)\] from accumulate [scaleX(3)\] to accumulate [scaleX(4)\] at (0.25) should be [scaleX(4.25)\]]
expected: FAIL
[Compositing: property <transform> underlying [scaleX(2)\] from accumulate [scaleX(3)\] to accumulate [scaleX(4)\] at (1) should be [scaleX(5)\]]
expected: FAIL
[Compositing: property <transform> underlying [scale(2, 4)\] from accumulate [scaleZ(3)\] to accumulate [scaleZ(4)\] at (1.5) should be [scale3d(2, 4, 4.5)\]]
expected: FAIL
[Compositing: property <transform> underlying [scaleY(2)\] from add [scaleY(3)\] to add [scaleY(4)\] at (0.75) should be [scaleY(7.5)\]]
expected: FAIL
[Compositing: property <transform> underlying [scaleX(2)\] from accumulate [scaleX(3)\] to accumulate [scaleX(4)\] at (0.75) should be [scaleX(4.75)\]]
expected: FAIL
[Compositing: property <transform> underlying [scaleY(2)\] from add [scaleY(3)\] to add [scaleY(4)\] at (0.5) should be [scaleY(7)\]]
expected: FAIL
[Compositing: property <transform> underlying [scaleY(2)\] from add [scaleY(3)\] to add [scaleY(4)\] at (0.25) should be [scaleY(6.5)\]]
expected: FAIL
[Compositing: property <transform> underlying [scale(2, 4)\] from accumulate [scaleZ(3)\] to accumulate [scaleZ(4)\] at (0) should be [scale3d(2, 4, 3)\]]
expected: FAIL
[Compositing: property <transform> underlying [scale(2, 4)\] from accumulate [scaleZ(3)\] to accumulate [scaleZ(4)\] at (-0.5) should be [scale3d(2, 4, 2.5)\]]
expected: FAIL
[Compositing: property <transform> underlying [scaleZ(2)\] from add [scaleZ(3)\] to add [scaleZ(4)\] at (0.75) should be [scaleZ(7.5)\]]
expected: FAIL
[Compositing: property <transform> underlying [scaleZ(2)\] from accumulate [scaleZ(3)\] to accumulate [scaleZ(4)\] at (0.75) should be [scaleZ(4.75)\]]
expected: FAIL
[Compositing: property <transform> underlying [scaleY(2)\] from add [scaleY(3)\] to add [scaleY(4)\] at (-0.5) should be [scaleY(5)\]]
expected: FAIL
[Compositing: property <transform> underlying [scaleX(2)\] from accumulate [scaleX(3)\] to accumulate [scaleX(4)\] at (0.5) should be [scaleX(4.5)\]]
expected: FAIL
[Compositing: property <transform> underlying [scale(2, 4)\] from accumulate [scaleZ(3)\] to accumulate [scaleZ(4)\] at (0.25) should be [scale3d(2, 4, 3.25)\]]
expected: FAIL
[Compositing: property <transform> underlying [scaleY(2)\] from accumulate [scaleY(3)\] to accumulate [scaleY(4)\] at (1.5) should be [scaleY(5.5)\]]
expected: FAIL
[Compositing: property <transform> underlying [scaleX(2)\] from add [scaleX(3)\] to add [scaleX(4)\] at (0) should be [scaleX(6)\]]
expected: FAIL
[Compositing: property <transform> underlying [scaleY(2)\] from accumulate [scaleY(3)\] to accumulate [scaleY(4)\] at (0.75) should be [scaleY(4.75)\]]
expected: FAIL
[Compositing: property <transform> underlying [scaleY(2)\] from add [scaleY(3)\] to add [scaleY(4)\] at (0) should be [scaleY(6)\]]
expected: FAIL
[Compositing: property <transform> underlying [scaleZ(2)\] from add [scaleZ(3)\] to add [scaleZ(4)\] at (1) should be [scaleZ(8)\]]
expected: FAIL
[Compositing: property <transform> underlying [scaleZ(2)\] from add [scaleZ(3)\] to add [scaleZ(4)\] at (0) should be [scaleZ(6)\]]
expected: FAIL
[Compositing: property <transform> underlying [scaleX(2)\] from add [scaleX(3)\] to add [scaleX(4)\] at (0.75) should be [scaleX(7.5)\]]
expected: FAIL
[Compositing: property <transform> underlying [scaleX(2)\] from add [scaleX(3)\] to add [scaleX(4)\] at (-0.5) should be [scaleX(5)\]]
expected: FAIL
[Compositing: property <transform> underlying [scaleY(2)\] from add [scaleY(3)\] to add [scaleY(4)\] at (1) should be [scaleY(8)\]]
expected: FAIL
[Compositing: property <transform> underlying [scaleY(2)\] from accumulate [scaleY(3)\] to accumulate [scaleY(4)\] at (0.25) should be [scaleY(4.25)\]]
expected: FAIL
[Compositing: property <transform> underlying [scaleX(2)\] from accumulate [scaleX(3)\] to accumulate [scaleX(4)\] at (1.5) should be [scaleX(5.5)\]]
expected: FAIL
[Compositing: property <transform> underlying [scaleY(2)\] from add [scaleY(3)\] to add [scaleY(4)\] at (1.5) should be [scaleY(9)\]]
expected: FAIL
[Compositing: property <transform> underlying [scaleZ(2)\] from accumulate [scaleZ(3)\] to accumulate [scaleZ(4)\] at (0.25) should be [scaleZ(4.25)\]]
expected: FAIL
[Compositing: property <transform> underlying [scaleZ(2)\] from add [scaleZ(3)\] to add [scaleZ(4)\] at (0.5) should be [scaleZ(7)\]]
expected: FAIL
[Compositing: property <transform> underlying [scaleX(2)\] from add [scaleX(3)\] to add [scaleX(4)\] at (0.5) should be [scaleX(7)\]]
expected: FAIL

130
tests/wpt/metadata/css/css-transforms/animation/transform-skew-composition.html.ini Normal file
View file

@ -0,0 +1,130 @@
[transform-skew-composition.html]
[Compositing: property <transform> underlying [skew(10deg, 20deg)\] from add [skew(30deg, 10deg)\] to add [skew(50deg, 50deg)\] at (0.25) should be [skew(10deg, 20deg) skew(35deg, 20deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [skewY(10deg)\] from add [skewY(30deg)\] to add [skewY(50deg)\] at (0) should be [skewY(10deg) skewY(30deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [skewX(10deg)\] from add [skewX(30deg)\] to add [skewX(50deg)\] at (0.5) should be [skewX(10deg) skewX(40deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [skew(10deg, 20deg)\] from add [skew(30deg, 10deg)\] to add [skew(50deg, 50deg)\] at (0.75) should be [skew(10deg, 20deg) skew(45deg, 40deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [skew(10deg, 20deg)\] from add [skew(30deg, 10deg)\] to add [skew(50deg, 50deg)\] at (-0.5) should be [skew(10deg, 20deg) skew(20deg, -10deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [skew(10deg, 45deg)\] from accumulate [skew(20deg, 30deg)\] to accumulate [skew(40deg, 70deg)\] at (1.5) should be [skew(60deg, 135deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [skewY(45deg)\] from accumulate [skewY(30deg)\] to accumulate [skewY(70deg)\] at (0) should be [skewY(75deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [skewX(10deg)\] from add [skewX(30deg)\] to add [skewX(50deg)\] at (0) should be [skewX(10deg) skewX(30deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [skewX(45deg)\] from accumulate [skewX(30deg)\] to accumulate [skewX(70deg)\] at (0.5) should be [skewX(95deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [skewY(45deg)\] from accumulate [skewY(30deg)\] to accumulate [skewY(70deg)\] at (-0.5) should be [skewY(55deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [skewX(45deg)\] from accumulate [skewX(30deg)\] to accumulate [skewX(70deg)\] at (0) should be [skewX(75deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [skewX(45deg)\] from accumulate [skewX(30deg)\] to accumulate [skewX(70deg)\] at (0.75) should be [skewX(105deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [skewY(10deg)\] from add [skewY(30deg)\] to add [skewY(50deg)\] at (1.5) should be [skewY(10deg) skewY(60deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [skew(10deg, 20deg)\] from add [skew(30deg, 10deg)\] to add [skew(50deg, 50deg)\] at (1) should be [skew(10deg, 20deg) skew(50deg, 50deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [skew(10deg, 45deg)\] from accumulate [skew(20deg, 30deg)\] to accumulate [skew(40deg, 70deg)\] at (1) should be [skew(50deg, 115deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [skewY(10deg)\] from add [skewY(30deg)\] to add [skewY(50deg)\] at (0.5) should be [skewY(10deg) skewY(40deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [skewY(45deg)\] from accumulate [skewY(30deg)\] to accumulate [skewY(70deg)\] at (1) should be [skewY(115deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [skewX(45deg)\] from accumulate [skewX(30deg)\] to accumulate [skewX(70deg)\] at (1) should be [skewX(115deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [skewY(45deg)\] from accumulate [skewY(30deg)\] to accumulate [skewY(70deg)\] at (1.5) should be [skewY(135deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [skewX(10deg)\] from add [skewX(30deg)\] to add [skewX(50deg)\] at (1.5) should be [skewX(10deg) skewX(60deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [skew(10deg, 45deg)\] from accumulate [skew(20deg, 30deg)\] to accumulate [skew(40deg, 70deg)\] at (-0.5) should be [skew(20deg, 55deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [skew(10deg, 20deg)\] from add [skew(30deg, 10deg)\] to add [skew(50deg, 50deg)\] at (0.5) should be [skew(10deg, 20deg) skew(40deg, 30deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [skew(10deg, 20deg)\] from add [skew(30deg, 10deg)\] to add [skew(50deg, 50deg)\] at (1.5) should be [skew(10deg, 20deg) skew(60deg, 70deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [skewY(10deg)\] from add [skewY(30deg)\] to add [skewY(50deg)\] at (1) should be [skewY(10deg) skewY(50deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [skewX(10deg)\] from add [skewX(30deg)\] to add [skewX(50deg)\] at (-0.5) should be [skewX(10deg) skewX(20deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [skewX(10deg)\] from add [skewX(30deg)\] to add [skewX(50deg)\] at (1) should be [skewX(10deg) skewX(50deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [skew(10deg, 45deg)\] from accumulate [skew(20deg, 30deg)\] to accumulate [skew(40deg, 70deg)\] at (0.75) should be [skew(45deg, 105deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [skew(10deg, 45deg)\] from accumulate [skew(20deg, 30deg)\] to accumulate [skew(40deg, 70deg)\] at (0.25) should be [skew(35deg, 85deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [skewY(45deg)\] from accumulate [skewY(30deg)\] to accumulate [skewY(70deg)\] at (0.5) should be [skewY(95deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [skewY(45deg)\] from accumulate [skewY(30deg)\] to accumulate [skewY(70deg)\] at (0.75) should be [skewY(105deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [skewX(45deg)\] from accumulate [skewX(30deg)\] to accumulate [skewX(70deg)\] at (1.5) should be [skewX(135deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [skewX(10deg)\] from add [skewX(30deg)\] to add [skewX(50deg)\] at (0.25) should be [skewX(10deg) skewX(35deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [skewX(45deg)\] from accumulate [skewX(30deg)\] to accumulate [skewX(70deg)\] at (-0.5) should be [skewX(55deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [skewY(10deg)\] from add [skewY(30deg)\] to add [skewY(50deg)\] at (0.75) should be [skewY(10deg) skewY(45deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [skewX(45deg)\] from accumulate [skewY(45deg)\] to accumulate [skewY(45deg)\] at (0.5) should be [matrix(1, 1, 0.5, 1.5, 0, 0)\]]
expected: FAIL
[Compositing: property <transform> underlying [skewX(45deg)\] from accumulate [skewX(30deg)\] to accumulate [skewX(70deg)\] at (0.25) should be [skewX(85deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [skew(10deg, 45deg)\] from accumulate [skew(20deg, 30deg)\] to accumulate [skew(40deg, 70deg)\] at (0) should be [skew(30deg, 75deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [skewX(10deg)\] from add [skewX(30deg)\] to add [skewX(50deg)\] at (0.75) should be [skewX(10deg) skewX(45deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [skewY(45deg)\] from accumulate [skewY(30deg)\] to accumulate [skewY(70deg)\] at (0.25) should be [skewY(85deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [skew(10deg, 45deg)\] from accumulate [skew(20deg, 30deg)\] to accumulate [skew(40deg, 70deg)\] at (0.5) should be [skew(40deg, 95deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [skew(10deg, 20deg)\] from add [skew(30deg, 10deg)\] to add [skew(50deg, 50deg)\] at (0) should be [skew(10deg, 20deg) skew(30deg, 10deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [skewY(10deg)\] from add [skewY(30deg)\] to add [skewY(50deg)\] at (-0.5) should be [skewY(10deg) skewY(20deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [skewY(10deg)\] from add [skewY(30deg)\] to add [skewY(50deg)\] at (0.25) should be [skewY(10deg) skewY(35deg)\]]
expected: FAIL

169
tests/wpt/metadata/css/css-transforms/animation/transform-translate-composition.html.ini Normal file
View file

@ -0,0 +1,169 @@
[transform-translate-composition.html]
[Compositing: property <transform> underlying [translateX(100px) rotate(90deg)\] from accumulate [translateX(100px)\] to accumulate [translateX(200px)\] at (0.25) should be [translateX(225px) rotate(90deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [translate(100px, 50px)\] from accumulate [translateZ(50px)\] to accumulate [translateZ(250px)\] at (-0.5) should be [translate3d(100px, 50px, -50px)\]]
expected: FAIL
[Compositing: property <transform> underlying [translate(100px, 50px)\] from accumulate [translateZ(50px)\] to accumulate [translateZ(250px)\] at (1.5) should be [translate3d(100px, 50px, 350px)\]]
expected: FAIL
[Compositing: property <transform> underlying [translateX(100px) rotate(90deg)\] from accumulate [translateX(100px)\] to accumulate [translateX(200px)\] at (0.5) should be [translateX(250px) rotate(90deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [translateX(100px)\] from accumulate [translateX(50px)\] to accumulate [translateX(250px)\] at (1) should be [translateX(350px)\]]
expected: FAIL
[Compositing: property <transform> underlying [translate(100px, 50px)\] from accumulate [translateZ(50px)\] to accumulate [translateZ(250px)\] at (0.75) should be [translate3d(100px, 50px, 200px)\]]
expected: FAIL
[Compositing: property <transform> underlying [translate(10px, 20px)\] from add [translate(100px, 200px)\] to add [translate(200px, 400px)\] at (0.5) should be [translate(160px, 320px)\]]
expected: FAIL
[Compositing: property <transform> underlying [translateX(100px) rotate(90deg)\] from add [translateX(100px)\] to add [translateX(200px)\] at (0.25) should be [translateX(100px) rotate(90deg) translateX(125px)\]]
expected: FAIL
[Compositing: property <transform> underlying [translate(100px, 50px)\] from accumulate [translateZ(50px)\] to accumulate [translateZ(250px)\] at (0.5) should be [translate3d(100px, 50px, 150px)\]]
expected: FAIL
[Compositing: property <transform> underlying [translateZ(100px)\] from accumulate [translateZ(50px)\] to accumulate [translateZ(250px)\] at (1.5) should be [translateZ(450px)\]]
expected: FAIL
[Compositing: property <transform> underlying [translateX(100px)\] from accumulate [translateX(50px)\] to accumulate [translateX(250px)\] at (0.25) should be [translateX(200px)\]]
expected: FAIL
[Compositing: property <transform> underlying [translate(10px, 20px)\] from add [translate(100px, 200px)\] to replace [translate(210px, 420px)\] at (1) should be [translate(210px, 420px)\]]
expected: FAIL
[Compositing: property <transform> underlying [translate(10px, 20px)\] from add [translate(100px, 200px)\] to replace [translate(210px, 420px)\] at (-0.5) should be [translate(60px, 120px)\]]
expected: FAIL
[Compositing: property <transform> underlying [translateX(100px)\] from accumulate [translateX(50px)\] to accumulate [translateX(250px)\] at (0.75) should be [translateX(300px)\]]
expected: FAIL
[Compositing: property <transform> underlying [translateZ(100px)\] from accumulate [translateZ(50px)\] to accumulate [translateZ(250px)\] at (0.5) should be [translateZ(250px)\]]
expected: FAIL
[Compositing: property <transform> underlying [translateX(100px) rotate(90deg)\] from accumulate [translateX(100px)\] to accumulate [translateX(200px)\] at (-0.5) should be [translateX(150px) rotate(90deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [translate(10px, 20px)\] from add [translate(100px, 200px)\] to add [translate(200px, 400px)\] at (0) should be [translate(110px, 220px)\]]
expected: FAIL
[Compositing: property <transform> underlying [translate(10px, 20px)\] from add [translate(100px, 200px)\] to replace [translate(210px, 420px)\] at (0) should be [translate(110px, 220px)\]]
expected: FAIL
[Compositing: property <transform> underlying [translate(10px, 20px)\] from add [translate(100px, 200px)\] to replace [translate(210px, 420px)\] at (0.25) should be [translate(135px, 270px)\]]
expected: FAIL
[Compositing: property <transform> underlying [translateY(100px)\] from accumulate [translateY(50px)\] to accumulate [translateY(250px)\] at (0.75) should be [translateY(300px)\]]
expected: FAIL
[Compositing: property <transform> underlying [translateX(100px) rotate(90deg)\] from add [translateX(100px)\] to add [translateX(200px)\] at (-0.5) should be [translateX(100px) rotate(90deg) translateX(50px)\]]
expected: FAIL
[Compositing: property <transform> underlying [translateX(100px) rotate(90deg)\] from accumulate [translateX(100px)\] to accumulate [translateX(200px)\] at (1) should be [translateX(300px) rotate(90deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [translate(10px, 20px)\] from add [translate(100px, 200px)\] to add [translate(200px, 400px)\] at (-0.5) should be [translate(60px, 120px)\]]
expected: FAIL
[Compositing: property <transform> underlying [translateY(100px)\] from accumulate [translateY(50px)\] to accumulate [translateY(250px)\] at (0.5) should be [translateY(250px)\]]
expected: FAIL
[Compositing: property <transform> underlying [translateX(100px) rotate(90deg)\] from accumulate [translateX(100px)\] to accumulate [translateX(200px)\] at (1.5) should be [translateX(350px) rotate(90deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [translateX(100px) rotate(90deg)\] from accumulate [translateX(100px)\] to accumulate [translateX(200px)\] at (0.75) should be [translateX(275px) rotate(90deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [translate(10px, 20px)\] from add [translate(100px, 200px)\] to add [translate(200px, 400px)\] at (1.5) should be [translate(260px, 520px)\]]
expected: FAIL
[Compositing: property <transform> underlying [translate(100px, 50px)\] from accumulate [translateZ(50px)\] to accumulate [translateZ(250px)\] at (0) should be [translate3d(100px, 50px, 50px)\]]
expected: FAIL
[Compositing: property <transform> underlying [translateX(100px)\] from accumulate [translateX(50px)\] to accumulate [translateX(250px)\] at (0) should be [translateX(150px)\]]
expected: FAIL
[Compositing: property <transform> underlying [translateX(100px) rotate(90deg)\] from add [translateX(100px)\] to add [translateX(200px)\] at (1) should be [translateX(100px) rotate(90deg) translateX(200px)\]]
expected: FAIL
[Compositing: property <transform> underlying [translate(10px, 20px)\] from add [translate(100px, 200px)\] to replace [translate(210px, 420px)\] at (1.5) should be [translate(260px, 520px)\]]
expected: FAIL
[Compositing: property <transform> underlying [translate(10px, 20px)\] from add [translate(100px, 200px)\] to add [translate(200px, 400px)\] at (1) should be [translate(210px, 420px)\]]
expected: FAIL
[Compositing: property <transform> underlying [translateX(100px) rotate(90deg)\] from add [translateX(100px)\] to add [translateX(200px)\] at (0) should be [translateX(100px) rotate(90deg) translateX(100px)\]]
expected: FAIL
[Compositing: property <transform> underlying [translateX(100px) rotate(90deg)\] from add [translateX(100px)\] to add [translateX(200px)\] at (0.75) should be [translateX(100px) rotate(90deg) translateX(175px)\]]
expected: FAIL
[Compositing: property <transform> underlying [translateY(100px)\] from accumulate [translateY(50px)\] to accumulate [translateY(250px)\] at (-0.5) should be [translateY(50px)\]]
expected: FAIL
[Compositing: property <transform> underlying [translateZ(100px)\] from accumulate [translateZ(50px)\] to accumulate [translateZ(250px)\] at (0.75) should be [translateZ(300px)\]]
expected: FAIL
[Compositing: property <transform> underlying [translateX(100px)\] from accumulate [translateX(50px)\] to accumulate [translateX(250px)\] at (1.5) should be [translateX(450px)\]]
expected: FAIL
[Compositing: property <transform> underlying [translateX(100px) rotate(90deg)\] from accumulate [translateX(100px)\] to accumulate [translateX(200px)\] at (0) should be [translateX(200px) rotate(90deg)\]]
expected: FAIL
[Compositing: property <transform> underlying [translateX(100px) rotate(90deg)\] from add [translateX(100px)\] to add [translateX(200px)\] at (0.5) should be [translateX(100px) rotate(90deg) translateX(150px)\]]
expected: FAIL
[Compositing: property <transform> underlying [translateX(100px)\] from accumulate [translateX(50px)\] to accumulate [translateX(250px)\] at (-0.5) should be [translateX(50px)\]]
expected: FAIL
[Compositing: property <transform> underlying [translateZ(100px)\] from accumulate [translateZ(50px)\] to accumulate [translateZ(250px)\] at (0.25) should be [translateZ(200px)\]]
expected: FAIL
[Compositing: property <transform> underlying [translate(100px, 50px)\] from accumulate [translateZ(50px)\] to accumulate [translateZ(250px)\] at (0.25) should be [translate3d(100px, 50px, 100px)\]]
expected: FAIL
[Compositing: property <transform> underlying [translateZ(100px)\] from accumulate [translateZ(50px)\] to accumulate [translateZ(250px)\] at (-0.5) should be [translateZ(50px)\]]
expected: FAIL
[Compositing: property <transform> underlying [translateX(100px)\] from accumulate [translateX(50px)\] to accumulate [translateX(250px)\] at (0.5) should be [translateX(250px)\]]
expected: FAIL
[Compositing: property <transform> underlying [translateY(100px)\] from accumulate [translateY(50px)\] to accumulate [translateY(250px)\] at (1) should be [translateY(350px)\]]
expected: FAIL
[Compositing: property <transform> underlying [translateZ(100px)\] from accumulate [translateZ(50px)\] to accumulate [translateZ(250px)\] at (1) should be [translateZ(350px)\]]
expected: FAIL
[Compositing: property <transform> underlying [translate(10px, 20px)\] from add [translate(100px, 200px)\] to add [translate(200px, 400px)\] at (0.25) should be [translate(135px, 270px)\]]
expected: FAIL
[Compositing: property <transform> underlying [translate(10px, 20px)\] from add [translate(100px, 200px)\] to replace [translate(210px, 420px)\] at (0.5) should be [translate(160px, 320px)\]]
expected: FAIL
[Compositing: property <transform> underlying [translateZ(100px)\] from accumulate [translateZ(50px)\] to accumulate [translateZ(250px)\] at (0) should be [translateZ(150px)\]]
expected: FAIL
[Compositing: property <transform> underlying [translateY(100px)\] from accumulate [translateY(50px)\] to accumulate [translateY(250px)\] at (0) should be [translateY(150px)\]]
expected: FAIL
[Compositing: property <transform> underlying [translateY(100px)\] from accumulate [translateY(50px)\] to accumulate [translateY(250px)\] at (1.5) should be [translateY(450px)\]]
expected: FAIL
[Compositing: property <transform> underlying [translateX(100px) rotate(90deg)\] from add [translateX(100px)\] to add [translateX(200px)\] at (1.5) should be [translateX(100px) rotate(90deg) translateX(250px)\]]
expected: FAIL
[Compositing: property <transform> underlying [translate(10px, 20px)\] from add [translate(100px, 200px)\] to add [translate(200px, 400px)\] at (0.75) should be [translate(185px, 370px)\]]
expected: FAIL
[Compositing: property <transform> underlying [translateY(100px)\] from accumulate [translateY(50px)\] to accumulate [translateY(250px)\] at (0.25) should be [translateY(200px)\]]
expected: FAIL
[Compositing: property <transform> underlying [translate(100px, 50px)\] from accumulate [translateZ(50px)\] to accumulate [translateZ(250px)\] at (1) should be [translate3d(100px, 50px, 250px)\]]
expected: FAIL
[Compositing: property <transform> underlying [translate(10px, 20px)\] from add [translate(100px, 200px)\] to replace [translate(210px, 420px)\] at (0.75) should be [translate(185px, 370px)\]]
expected: FAIL

154
tests/wpt/metadata/css/css-transforms/animation/translate-composition.html.ini Normal file
View file

@ -0,0 +1,154 @@
[translate-composition.html]
[Compositing: property <translate> underlying [100px 200px 300px\] from replace [50% 100px\] to add [200px 50% 100px\] at (0.75) should be [calc(225px + 12.5%) calc(175px + 37.5%) 300px\]]
expected: FAIL
[Compositing: property <translate> underlying [80px 20px\] from add [0px 40px 60px\] to replace [none\] at (1) should be [none\]]
expected: FAIL
[Compositing: property <translate> underlying [100px 200px 300px\] from add [-50px 50%\] to add [100%\] at (0) should be [calc(50px + 0%) calc(200px + 50%) 300px\]]
expected: FAIL
[Compositing: property <translate> underlying [none\] from replace [0px 40px 60px\] to add [none\] at (0) should be [0px 40px 60px\]]
expected: FAIL
[Compositing: property <translate> underlying [80px 20px\] from add [0px 40px 60px\] to replace [none\] at (0) should be [80px 60px 60px\]]
expected: FAIL
[Compositing: property <translate> underlying [80px 20px\] from add [0px 40px 60px\] to replace [none\] at (0.75) should be [20px 15px 15px\]]
expected: FAIL
[Compositing: property <translate> underlying [none\] from replace [0px 40px 60px\] to replace [none\] at (2) should be [0px -40px -60px\]]
expected: FAIL
[Compositing: property <translate> underlying [80px 20px\] from add [0px 40px 60px\] to replace [none\] at (0.25) should be [60px 45px 45px\]]
expected: FAIL
[Compositing: property <translate> underlying [80px 20px\] from add [none\] to replace [0px 40px 60px\] at (2) should be [-80px 60px 120px\]]
expected: FAIL
[Compositing: property <translate> underlying [none\] from replace [0px 40px 60px\] to replace [none\] at (0.75) should be [0px 10px 15px\]]
expected: FAIL
[Compositing: property <translate> underlying [none\] from replace [0px 40px 60px\] to add [none\] at (-1) should be [0px 80px 120px\]]
expected: FAIL
[Compositing: property <translate> underlying [none\] from add [none\] to add [100px\] at (0.75) should be [75px\]]
expected: FAIL
[Compositing: property <translate> underlying [80px 20px\] from add [0px 40px 60px\] to replace [none\] at (-1) should be [160px 120px 120px\]]
expected: FAIL
[Compositing: property <translate> underlying [none\] from replace [none\] to add [100px\] at (1) should be [100px\]]
expected: FAIL
[Compositing: property <translate> underlying [none\] from replace [none\] to add [100px\] at (0.75) should be [75px\]]
expected: FAIL
[Compositing: property <translate> underlying [100px 200px 300px\] from replace [50% 100px\] to add [200px 50% 100px\] at (0) should be [50% calc(100px + 0%)\]]
expected: FAIL
[Compositing: property <translate> underlying [none\] from replace [0px 40px 60px\] to add [none\] at (2) should be [0px -40px -60px\]]
expected: FAIL
[Compositing: property <translate> underlying [100px 200px 300px\] from add [-50px 50%\] to add [100%\] at (0.25) should be [calc(62.5px + 25%) calc(200px + 37.5%) 300px\]]
expected: FAIL
[Compositing: property <translate> underlying [100px 200px 300px\] from replace [50% 100px\] to add [200px 50% 100px\] at (0.25) should be [calc(75px + 37.5%) calc(125px + 12.5%) 100px\]]
expected: FAIL
[Compositing: property <translate> underlying [none\] from replace [0px 40px 60px\] to replace [none\] at (-1) should be [0px 80px 120px\]]
expected: FAIL
[Compositing: property <translate> underlying [100px 200px 300px\] from add [50% 100px\] to replace [200px 50% 100px\] at (0.25) should be [calc(125px + 37.5%) calc(225px + 12.5%) 250px\]]
expected: FAIL
[Compositing: property <translate> underlying [none\] from replace [0px 40px 60px\] to replace [none\] at (0) should be [0px 40px 60px\]]
expected: FAIL
[Compositing: property <translate> underlying [80px 20px\] from add [0px 40px 60px\] to replace [none\] at (0.5) should be [40px 30px 30px\]]
expected: FAIL
[Compositing: property <translate> underlying [none\] from replace [0px 40px 60px\] to add [none\] at (0.25) should be [0px 30px 45px\]]
expected: FAIL
[Compositing: property <translate> underlying [100px 200px 300px\] from add [-50px 50%\] to add [100%\] at (2) should be [calc(150px + 200%) calc(200px - 50%) 300px\]]
expected: FAIL
[Compositing: property <translate> underlying [100px 200px 300px\] from add [50% 100px\] to replace [200px 50% 100px\] at (1) should be [calc(200px + 0%) 50% 100px\]]
expected: FAIL
[Compositing: property <translate> underlying [80px 20px\] from add [none\] to replace [0px 40px 60px\] at (-1) should be [160px 0px -60px\]]
expected: FAIL
[Compositing: property <translate> underlying [none\] from add [none\] to add [100px\] at (0.25) should be [25px\]]
expected: FAIL
[Compositing: property <translate> underlying [none\] from add [none\] to add [100px\] at (-1) should be [-100px\]]
expected: FAIL
[Compositing: property <translate> underlying [none\] from replace [0px 40px 60px\] to add [none\] at (0.75) should be [0px 10px 15px\]]
expected: FAIL
[Compositing: property <translate> underlying [none\] from replace [none\] to add [100px\] at (0.25) should be [25px\]]
expected: FAIL
[Compositing: property <translate> underlying [80px 20px\] from add [none\] to replace [0px 40px 60px\] at (0.25) should be [60px 25px 15px\]]
expected: FAIL
[Compositing: property <translate> underlying [80px 20px\] from add [none\] to replace [0px 40px 60px\] at (0.5) should be [40px 30px 30px\]]
expected: FAIL
[Compositing: property <translate> underlying [100px 200px 300px\] from replace [50% 100px\] to add [200px 50% 100px\] at (2) should be [calc(600px - 50%) calc(300px + 100%) 800px\]]
expected: FAIL
[Compositing: property <translate> underlying [100px 200px 300px\] from add [-50px 50%\] to add [100%\] at (0.75) should be [calc(87.5px + 75%) calc(200px + 12.5%) 300px\]]
expected: FAIL
[Compositing: property <translate> underlying [80px 20px\] from add [0px 40px 60px\] to replace [none\] at (2) should be [-80px -60px -60px\]]
expected: FAIL
[Compositing: property <translate> underlying [100px 200px 300px\] from add [50% 100px\] to replace [200px 50% 100px\] at (0.75) should be [calc(175px + 12.5%) calc(75px + 37.5%) 150px\]]
expected: FAIL
[Compositing: property <translate> underlying [100px 200px 300px\] from add [50% 100px\] to replace [200px 50% 100px\] at (2) should be [calc(300px - 50%) calc(-300px + 100%) -100px\]]
expected: FAIL
[Compositing: property <translate> underlying [80px 20px\] from add [none\] to replace [0px 40px 60px\] at (0.75) should be [20px 35px 45px\]]
expected: FAIL
[Compositing: property <translate> underlying [100px 200px 300px\] from replace [50% 100px\] to add [200px 50% 100px\] at (1) should be [calc(300px + 0%) calc(200px + 50%) 400px\]]
expected: FAIL
[Compositing: property <translate> underlying [none\] from add [none\] to add [100px\] at (1) should be [100px\]]
expected: FAIL
[Compositing: property <translate> underlying [none\] from replace [0px 40px 60px\] to replace [none\] at (0.25) should be [0px 30px 45px\]]
expected: FAIL
[Compositing: property <translate> underlying [100px 200px 300px\] from add [-50px 50%\] to add [100%\] at (-1) should be [-100% calc(200px + 100%) 300px\]]
expected: FAIL
[Compositing: property <translate> underlying [80px 20px\] from add [none\] to replace [0px 40px 60px\] at (1) should be [0px 40px 60px\]]
expected: FAIL
[Compositing: property <translate> underlying [100px 200px 300px\] from replace [50% 100px\] to add [200px 50% 100px\] at (-1) should be [calc(-300px + 100%) -50% -400px\]]
expected: FAIL
[Compositing: property <translate> underlying [none\] from add [none\] to add [100px\] at (2) should be [200px\]]
expected: FAIL
[Compositing: property <translate> underlying [none\] from replace [none\] to add [100px\] at (-1) should be [-100px\]]
expected: FAIL
[Compositing: property <translate> underlying [100px 200px 300px\] from add [-50px 50%\] to add [100%\] at (1) should be [calc(100px + 100%) calc(200px + 0%) 300px\]]
expected: FAIL
[Compositing: property <translate> underlying [100px 200px 300px\] from add [50% 100px\] to replace [200px 50% 100px\] at (0) should be [calc(100px + 50%) calc(300px + 0%) 300px\]]
expected: FAIL
[Compositing: property <translate> underlying [100px 200px 300px\] from add [50% 100px\] to replace [200px 50% 100px\] at (-1) should be [100% calc(600px - 50%) 500px\]]
expected: FAIL
[Compositing: property <translate> underlying [none\] from replace [none\] to add [100px\] at (2) should be [200px\]]
expected: FAIL

61
tests/wpt/metadata/css/css-transitions/animations/vertical-align-composition.html.ini Normal file
View file

@ -0,0 +1,61 @@
[vertical-align-composition.html]
[Compositing: property <vertical-align> underlying [10%\] from add [100px\] to add [20%\] at (0) should be [calc(100px + 10%)\]]
expected: FAIL
[Compositing: property <vertical-align> underlying [50px\] from add [100px\] to add [200px\] at (-0.3) should be [120px\]]
expected: FAIL
[Compositing: property <vertical-align> underlying [100px\] from add [10px\] to add [2px\] at (0.5) should be [106px\]]
expected: FAIL
[Compositing: property <vertical-align> underlying [50px\] from add [100px\] to replace [200px\] at (1) should be [200px\]]
expected: FAIL
[Compositing: property <vertical-align> underlying [50px\] from add [100px\] to replace [200px\] at (0) should be [150px\]]
expected: FAIL
[Compositing: property <vertical-align> underlying [100px\] from add [10px\] to add [2px\] at (1) should be [102px\]]
expected: FAIL
[Compositing: property <vertical-align> underlying [50px\] from add [100px\] to add [200px\] at (0.5) should be [200px\]]
expected: FAIL
[Compositing: property <vertical-align> underlying [50px\] from add [100px\] to replace [200px\] at (0.5) should be [175px\]]
expected: FAIL
[Compositing: property <vertical-align> underlying [10%\] from add [100px\] to add [20%\] at (-0.3) should be [calc(130px + 4%)\]]
expected: FAIL
[Compositing: property <vertical-align> underlying [50px\] from add [100px\] to replace [200px\] at (1.5) should be [225px\]]
expected: FAIL
[Compositing: property <vertical-align> underlying [50px\] from add [100px\] to replace [200px\] at (-0.3) should be [135px\]]
expected: FAIL
[Compositing: property <vertical-align> underlying [50px\] from add [100px\] to add [200px\] at (1) should be [250px\]]
expected: FAIL
[Compositing: property <vertical-align> underlying [50px\] from add [100px\] to add [200px\] at (1.5) should be [300px\]]
expected: FAIL
[Compositing: property <vertical-align> underlying [100px\] from add [10px\] to add [2px\] at (1.5) should be [98px\]]
expected: FAIL
[Compositing: property <vertical-align> underlying [100px\] from add [10px\] to add [2px\] at (-0.5) should be [114px\]]
expected: FAIL
[Compositing: property <vertical-align> underlying [100px\] from add [10px\] to add [2px\] at (0) should be [110px\]]
expected: FAIL
[Compositing: property <vertical-align> underlying [10%\] from add [100px\] to add [20%\] at (0.5) should be [calc(50px + 20%)\]]
expected: FAIL
[Compositing: property <vertical-align> underlying [10%\] from add [100px\] to add [20%\] at (1) should be [30%\]]
expected: FAIL
[Compositing: property <vertical-align> underlying [50px\] from add [100px\] to add [200px\] at (0) should be [150px\]]
expected: FAIL
[Compositing: property <vertical-align> underlying [10%\] from add [100px\] to add [20%\] at (1.5) should be [calc(-50px + 40%)\]]
expected: FAIL

24
tests/wpt/metadata/fetch/content-type/response.window.js.ini
View file

@ -309,30 +309,18 @@
[<iframe>: separate response Content-Type: */* text/html]
expected: FAIL
[<iframe>: separate response Content-Type: text/html */*;charset=gbk]
expected: FAIL
[<iframe>: combined response Content-Type: text/html;charset=gbk text/plain text/html]
expected: FAIL
[fetch(): separate response Content-Type: text/plain ]
expected: NOTRUN
[<iframe>: separate response Content-Type: text/html */*]
expected: FAIL
[<iframe>: separate response Content-Type: text/html;" \\" text/plain]
expected: FAIL
[<iframe>: separate response Content-Type: text/html;" text/plain]
expected: FAIL
[<iframe>: separate response Content-Type: text/plain */*]
expected: FAIL
[<iframe>: separate response Content-Type: text/html;x=" text/plain]
expected: FAIL
[<iframe>: combined response Content-Type: text/html;" \\" text/plain]
expected: FAIL
[<iframe>: combined response Content-Type: text/html */*;charset=gbk]
expected: FAIL
[<iframe>: combined response Content-Type: text/html;x=" text/plain]
expected: FAIL

4
tests/wpt/metadata/fetch/metadata/appcache.tentative.https.sub.html.ini
View file

@ -1,4 +0,0 @@
[appcache.tentative.https.sub.html]
[Appcache!]
expected: FAIL

2
tests/wpt/metadata/fetch/security/embedded-credentials.tentative.sub.html.ini
View file

@ -5,7 +5,7 @@
expected: FAIL
[Embedded credentials are treated as network errors in frames.]
expected: FAIL
expected: TIMEOUT
[Embedded credentials are treated as network errors in new windows.]
expected: FAIL

55
tests/wpt/metadata/html/cross-origin-opener-policy/popup-none.https.html.ini
View file

@ -1,55 +0,0 @@
[popup-none.https.html]
[none document opening popup to https://web-platform.test:8443 with COOP: ""]
expected: FAIL
[none document opening popup to https://web-platform.test:8443 with COOP: "jibberish"]
expected: FAIL
[none document opening popup to https://www1.web-platform.test:8443 with COOP: ""]
expected: FAIL
[none document opening popup to https://www1.web-platform.test:8443 with COOP: "same-origin unsafe-allow-outgoing"]
expected: FAIL
[none document opening popup to https://www1.web-platform.test:8443 with COOP: "jibberish"]
expected: FAIL
[none document opening popup to https://web-platform.test:8443 with COOP: "same-origin unsafe-allow-outgoing"]
expected: FAIL
[none document opening popup to https://web-platform.test:8443 with COOP: "same-site unsafe-allow-outgoing"]
expected: FAIL
[none document opening popup to https://www1.web-platform.test:8443 with COOP: "same-origin"]
expected: FAIL
[none document opening popup to https://not-web-platform.test:8443 with COOP: "same-origin"]
expected: FAIL
[none document opening popup to https://web-platform.test:8443 with COOP: "same-site"]
expected: FAIL
[none document opening popup to https://web-platform.test:8443 with COOP: "same-origin"]
expected: FAIL
[none document opening popup to https://www1.web-platform.test:8443 with COOP: "same-site unsafe-allow-outgoing"]
expected: FAIL
[none document opening popup to https://not-web-platform.test:8443 with COOP: ""]
expected: FAIL
[none document opening popup to https://www1.web-platform.test:8443 with COOP: "same-site"]
expected: FAIL
[none document opening popup to https://not-web-platform.test:8443 with COOP: "same-origin unsafe-allow-outgoing"]
expected: FAIL
[none document opening popup to https://not-web-platform.test:8443 with COOP: "same-site"]
expected: FAIL
[none document opening popup to https://not-web-platform.test:8443 with COOP: "same-site unsafe-allow-outgoing"]
expected: FAIL
[none document opening popup to https://not-web-platform.test:8443 with COOP: "jibberish"]
expected: FAIL

55
tests/wpt/metadata/html/cross-origin-opener-policy/popup-same-origin-unsafe-allow-outgoing.https.html.ini
View file

@ -1,55 +0,0 @@
[popup-same-origin-unsafe-allow-outgoing.https.html]
[same-origin_unsafe-allow-outgoing document opening popup to https://not-web-platform.test:8443 with COOP: "same-origin unsafe-allow-outgoing"]
expected: FAIL
[same-origin_unsafe-allow-outgoing document opening popup to https://www1.web-platform.test:8443 with COOP: "same-site unsafe-allow-outgoing"]
expected: FAIL
[same-origin_unsafe-allow-outgoing document opening popup to https://web-platform.test:8443 with COOP: ""]
expected: FAIL
[same-origin_unsafe-allow-outgoing document opening popup to https://not-web-platform.test:8443 with COOP: ""]
expected: FAIL
[same-origin_unsafe-allow-outgoing document opening popup to https://www1.web-platform.test:8443 with COOP: "same-origin"]
expected: FAIL
[same-origin_unsafe-allow-outgoing document opening popup to https://www1.web-platform.test:8443 with COOP: "same-origin unsafe-allow-outgoing"]
expected: FAIL
[same-origin_unsafe-allow-outgoing document opening popup to https://web-platform.test:8443 with COOP: "same-site"]
expected: FAIL
[same-origin_unsafe-allow-outgoing document opening popup to https://www1.web-platform.test:8443 with COOP: "same-site"]
expected: FAIL
[same-origin_unsafe-allow-outgoing document opening popup to https://web-platform.test:8443 with COOP: "same-origin unsafe-allow-outgoing"]
expected: FAIL
[same-origin_unsafe-allow-outgoing document opening popup to https://web-platform.test:8443 with COOP: "same-site unsafe-allow-outgoing"]
expected: FAIL
[same-origin_unsafe-allow-outgoing document opening popup to https://web-platform.test:8443 with COOP: "jibberish"]
expected: FAIL
[same-origin_unsafe-allow-outgoing document opening popup to https://not-web-platform.test:8443 with COOP: "same-origin"]
expected: FAIL
[same-origin_unsafe-allow-outgoing document opening popup to https://not-web-platform.test:8443 with COOP: "same-site"]
expected: FAIL
[same-origin_unsafe-allow-outgoing document opening popup to https://www1.web-platform.test:8443 with COOP: ""]
expected: FAIL
[same-origin_unsafe-allow-outgoing document opening popup to https://not-web-platform.test:8443 with COOP: "same-site unsafe-allow-outgoing"]
expected: FAIL
[same-origin_unsafe-allow-outgoing document opening popup to https://web-platform.test:8443 with COOP: "same-origin"]
expected: FAIL
[same-origin_unsafe-allow-outgoing document opening popup to https://www1.web-platform.test:8443 with COOP: "jibberish"]
expected: FAIL
[same-origin_unsafe-allow-outgoing document opening popup to https://not-web-platform.test:8443 with COOP: "jibberish"]
expected: FAIL

55
tests/wpt/metadata/html/cross-origin-opener-policy/popup-same-origin.https.html.ini
View file

@ -1,55 +0,0 @@
[popup-same-origin.https.html]
[same-origin document opening popup to https://not-web-platform.test:8443 with COOP: ""]
expected: FAIL
[same-origin document opening popup to https://web-platform.test:8443 with COOP: "same-site"]
expected: FAIL
[same-origin document opening popup to https://www1.web-platform.test:8443 with COOP: "same-site unsafe-allow-outgoing"]
expected: FAIL
[same-origin document opening popup to https://web-platform.test:8443 with COOP: ""]
expected: FAIL
[same-origin document opening popup to https://www1.web-platform.test:8443 with COOP: "same-site"]
expected: FAIL
[same-origin document opening popup to https://not-web-platform.test:8443 with COOP: "same-site unsafe-allow-outgoing"]
expected: FAIL
[same-origin document opening popup to https://not-web-platform.test:8443 with COOP: "jibberish"]
expected: FAIL
[same-origin document opening popup to https://www1.web-platform.test:8443 with COOP: "same-origin"]
expected: FAIL
[same-origin document opening popup to https://www1.web-platform.test:8443 with COOP: "jibberish"]
expected: FAIL
[same-origin document opening popup to https://web-platform.test:8443 with COOP: "same-origin unsafe-allow-outgoing"]
expected: FAIL
[same-origin document opening popup to https://not-web-platform.test:8443 with COOP: "same-origin"]
expected: FAIL
[same-origin document opening popup to https://web-platform.test:8443 with COOP: "jibberish"]
expected: FAIL
[same-origin document opening popup to https://not-web-platform.test:8443 with COOP: "same-site"]
expected: FAIL
[same-origin document opening popup to https://www1.web-platform.test:8443 with COOP: ""]
expected: FAIL
[same-origin document opening popup to https://web-platform.test:8443 with COOP: "same-site unsafe-allow-outgoing"]
expected: FAIL
[same-origin document opening popup to https://web-platform.test:8443 with COOP: "same-origin"]
expected: FAIL
[same-origin document opening popup to https://not-web-platform.test:8443 with COOP: "same-origin unsafe-allow-outgoing"]
expected: FAIL
[same-origin document opening popup to https://www1.web-platform.test:8443 with COOP: "same-origin unsafe-allow-outgoing"]
expected: FAIL

55
tests/wpt/metadata/html/cross-origin-opener-policy/popup-same-site-unsafe-allow-outgoing.https.html.ini
View file

@ -1,55 +0,0 @@
[popup-same-site-unsafe-allow-outgoing.https.html]
[same-site_unsafe-allow-outgoing document opening popup to https://web-platform.test:8443 with COOP: "jibberish"]
expected: FAIL
[same-site_unsafe-allow-outgoing document opening popup to https://www1.web-platform.test:8443 with COOP: "same-site"]
expected: FAIL
[same-site_unsafe-allow-outgoing document opening popup to https://www1.web-platform.test:8443 with COOP: "same-origin unsafe-allow-outgoing"]
expected: FAIL
[same-site_unsafe-allow-outgoing document opening popup to https://www1.web-platform.test:8443 with COOP: "same-site unsafe-allow-outgoing"]
expected: FAIL
[same-site_unsafe-allow-outgoing document opening popup to https://not-web-platform.test:8443 with COOP: "same-origin unsafe-allow-outgoing"]
expected: FAIL
[same-site_unsafe-allow-outgoing document opening popup to https://not-web-platform.test:8443 with COOP: "same-site unsafe-allow-outgoing"]
expected: FAIL
[same-site_unsafe-allow-outgoing document opening popup to https://web-platform.test:8443 with COOP: "same-origin"]
expected: FAIL
[same-site_unsafe-allow-outgoing document opening popup to https://not-web-platform.test:8443 with COOP: "same-site"]
expected: FAIL
[same-site_unsafe-allow-outgoing document opening popup to https://web-platform.test:8443 with COOP: "same-site unsafe-allow-outgoing"]
expected: FAIL
[same-site_unsafe-allow-outgoing document opening popup to https://not-web-platform.test:8443 with COOP: "same-origin"]
expected: FAIL
[same-site_unsafe-allow-outgoing document opening popup to https://web-platform.test:8443 with COOP: "same-site"]
expected: FAIL
[same-site_unsafe-allow-outgoing document opening popup to https://www1.web-platform.test:8443 with COOP: "same-origin"]
expected: FAIL
[same-site_unsafe-allow-outgoing document opening popup to https://web-platform.test:8443 with COOP: ""]
expected: FAIL
[same-site_unsafe-allow-outgoing document opening popup to https://www1.web-platform.test:8443 with COOP: ""]
expected: FAIL
[same-site_unsafe-allow-outgoing document opening popup to https://not-web-platform.test:8443 with COOP: ""]
expected: FAIL
[same-site_unsafe-allow-outgoing document opening popup to https://web-platform.test:8443 with COOP: "same-origin unsafe-allow-outgoing"]
expected: FAIL
[same-site_unsafe-allow-outgoing document opening popup to https://not-web-platform.test:8443 with COOP: "jibberish"]
expected: FAIL
[same-site_unsafe-allow-outgoing document opening popup to https://www1.web-platform.test:8443 with COOP: "jibberish"]
expected: FAIL

55
tests/wpt/metadata/html/cross-origin-opener-policy/popup-same-site.https.html.ini
View file

@ -1,55 +0,0 @@
[popup-same-site.https.html]
[same-site document opening popup to https://not-web-platform.test:8443 with COOP: "same-origin unsafe-allow-outgoing"]
expected: FAIL
[same-site document opening popup to https://www1.web-platform.test:8443 with COOP: "same-site unsafe-allow-outgoing"]
expected: FAIL
[same-site document opening popup to https://www1.web-platform.test:8443 with COOP: "same-site"]
expected: FAIL
[same-site document opening popup to https://web-platform.test:8443 with COOP: "same-origin unsafe-allow-outgoing"]
expected: FAIL
[same-site document opening popup to https://web-platform.test:8443 with COOP: "same-origin"]
expected: FAIL
[same-site document opening popup to https://not-web-platform.test:8443 with COOP: "jibberish"]
expected: FAIL
[same-site document opening popup to https://web-platform.test:8443 with COOP: ""]
expected: FAIL
[same-site document opening popup to https://not-web-platform.test:8443 with COOP: "same-origin"]
expected: FAIL
[same-site document opening popup to https://www1.web-platform.test:8443 with COOP: ""]
expected: FAIL
[same-site document opening popup to https://www1.web-platform.test:8443 with COOP: "same-origin unsafe-allow-outgoing"]
expected: FAIL
[same-site document opening popup to https://not-web-platform.test:8443 with COOP: ""]
expected: FAIL
[same-site document opening popup to https://web-platform.test:8443 with COOP: "jibberish"]
expected: FAIL
[same-site document opening popup to https://not-web-platform.test:8443 with COOP: "same-site unsafe-allow-outgoing"]
expected: FAIL
[same-site document opening popup to https://www1.web-platform.test:8443 with COOP: "jibberish"]
expected: FAIL
[same-site document opening popup to https://www1.web-platform.test:8443 with COOP: "same-origin"]
expected: FAIL
[same-site document opening popup to https://not-web-platform.test:8443 with COOP: "same-site"]
expected: FAIL
[same-site document opening popup to https://web-platform.test:8443 with COOP: "same-site"]
expected: FAIL
[same-site document opening popup to https://web-platform.test:8443 with COOP: "same-site unsafe-allow-outgoing"]
expected: FAIL

3
tests/wpt/metadata/html/dom/idlharness.worker.js.ini
View file

@ -554,6 +554,3 @@
[OffscreenCanvasRenderingContext2D interface: operation clip(CanvasFillRule)]
expected: FAIL
[MessageEvent interface: new MessageEvent("message", { data: 5 }) must inherit property "source" with the proper type]
expected: FAIL

4
tests/wpt/metadata/html/interaction/focus/the-autofocus-attribute/skip-document-with-fragment.html.ini
View file

@ -1,4 +1,8 @@
[skip-document-with-fragment.html]
expected: TIMEOUT
[Autofocus elements in iframed documents with URL fragments should be skipped.]
expected: FAIL
[Autofocus elements in top-level browsing context's documents with URI fragments should be skipped.]
expected: TIMEOUT

12
tests/wpt/metadata/html/interaction/focus/the-autofocus-attribute/supported-elements.html.ini
View file

@ -1,16 +1,20 @@
[supported-elements.html]
expected: TIMEOUT
[Contenteditable element should support autofocus]
expected: FAIL
[Element with tabindex should support autofocus]
expected: FAIL
expected: TIMEOUT
[Host element with delegatesFocus including no focusable descendants should be skipped]
expected: FAIL
expected: NOTRUN
[Area element should support autofocus]
expected: FAIL
expected: NOTRUN
[Host element with delegatesFocus should support autofocus]
expected: FAIL
expected: NOTRUN
[Non-HTMLElement should not support autofocus]
expected: NOTRUN

12
tests/wpt/metadata/html/semantics/forms/constraints/form-validation-validity-rangeOverflow.html.ini
View file

@ -228,3 +228,15 @@
[[INPUT in NUMBER status\] The value is greater than max(special floating number)]
expected: FAIL
[[INPUT in TIME status\] The time is inside the accepted range for reversed range]
expected: FAIL
[[INPUT in TIME status\] The time is outside the accepted range for reversed range]
expected: FAIL
[[INPUT in TIME status\] The time is min for reversed range]
expected: FAIL
[[INPUT in TIME status\] The time is max for reversed range]
expected: FAIL

12
tests/wpt/metadata/html/semantics/forms/constraints/form-validation-validity-rangeUnderflow.html.ini
View file

@ -222,3 +222,15 @@
[[INPUT in NUMBER status\] The value is less than min(special floating number)]
expected: FAIL
[[INPUT in TIME status\] The time is max for reversed range]
expected: FAIL
[[INPUT in TIME status\] The time is outside the accepted range for reversed range]
expected: FAIL
[[INPUT in TIME status\] The time is min for reversed range]
expected: FAIL
[[INPUT in TIME status\] The time is inside the accepted range for reversed range]
expected: FAIL

3
tests/wpt/metadata/html/semantics/forms/constraints/form-validation-validity-valueMissing.html.ini
View file

@ -315,3 +315,6 @@
[[select\] Selected the option with value equals to empty]
expected: FAIL
[[INPUT in RADIO status\] The checked attribute is false and the name attribute is empty]
expected: FAIL

79
tests/wpt/metadata/html/semantics/forms/the-input-element/input-valueasdate.html.ini Normal file
View file

@ -0,0 +1,79 @@
[input-valueasdate.html]
[valueAsDate getter on type date (actual value: 2019-00-12, expected valueAsDate: null)]
expected: FAIL
[valueAsDate getter on type date (actual value: 2016-02-29, expected valueAsDate: Mon Feb 29 2016 00:00:00 GMT+0000 (Coordinated Universal Time))]
expected: FAIL
[valueAsDate getter on type date (actual value: , expected valueAsDate: null)]
expected: FAIL
[valueAsDate getter on type week (actual value: 2019-W00, expected valueAsDate: null)]
expected: FAIL
[valueAsDate setter on type date (actual valueAsDate: Tue Dec 10 2019 00:00:00 GMT+0000 (Coordinated Universal Time), expected value: 2019-12-10)]
expected: FAIL
[valueAsDate getter on type month (actual value: 2019-12, expected valueAsDate: Sun Dec 01 2019 00:00:00 GMT+0000 (Coordinated Universal Time))]
expected: FAIL
[valueAsDate getter on type week (actual value: 2019-W50, expected valueAsDate: Mon Dec 09 2019 00:00:00 GMT+0000 (Coordinated Universal Time))]
expected: FAIL
[valueAsDate getter on type week (actual value: 2019-W60, expected valueAsDate: null)]
expected: FAIL
[valueAsDate getter on type date (actual value: 2019-12-10, expected valueAsDate: Tue Dec 10 2019 00:00:00 GMT+0000 (Coordinated Universal Time))]
expected: FAIL
[valueAsDate getter on type date (actual value: 2019-13-10, expected valueAsDate: null)]
expected: FAIL
[valueAsDate getter on type time (actual value: 00:60, expected valueAsDate: null)]
expected: FAIL
[valueAsDate setter on type time (actual valueAsDate: Thu Jan 01 1970 00:00:00 GMT+0000 (Coordinated Universal Time), expected value: 00:00)]
expected: FAIL
[valueAsDate getter on type date (actual value: 2019-12-00, expected valueAsDate: null)]
expected: FAIL
[valueAsDate getter on type month (actual value: 2019-00, expected valueAsDate: null)]
expected: FAIL
[valueAsDate getter on type week (actual value: , expected valueAsDate: null)]
expected: FAIL
[valueAsDate getter on type time (actual value: , expected valueAsDate: null)]
expected: FAIL
[valueAsDate getter on type month (actual value: , expected valueAsDate: null)]
expected: FAIL
[valueAsDate getter on type time (actual value: 12:00, expected valueAsDate: Thu Jan 01 1970 12:00:00 GMT+0000 (Coordinated Universal Time))]
expected: FAIL
[valueAsDate getter on type time (actual value: 23:59, expected valueAsDate: Thu Jan 01 1970 23:59:00 GMT+0000 (Coordinated Universal Time))]
expected: FAIL
[valueAsDate getter on type date (actual value: 2019-02-29, expected valueAsDate: null)]
expected: FAIL
[valueAsDate getter on type month (actual value: 0000-12, expected valueAsDate: null)]
expected: FAIL
[valueAsDate getter on type week (actual value: 0000-W50, expected valueAsDate: null)]
expected: FAIL
[valueAsDate getter on type date (actual value: 0000-12-10, expected valueAsDate: null)]
expected: FAIL
[valueAsDate setter on type time (actual valueAsDate: Thu Jan 01 1970 12:00:00 GMT+0000 (Coordinated Universal Time), expected value: 12:00)]
expected: FAIL
[valueAsDate getter on type time (actual value: 00:00, expected valueAsDate: Thu Jan 01 1970 00:00:00 GMT+0000 (Coordinated Universal Time))]
expected: FAIL
[valueAsDate getter on type time (actual value: 24:00, expected valueAsDate: null)]
expected: FAIL

136
tests/wpt/metadata/html/semantics/forms/the-input-element/input-valueasnumber.html.ini Normal file
View file

@ -0,0 +1,136 @@
[input-valueasnumber.html]
[valueAsNumber getter on type month (actual value: 0000-12, expected valueAsNumber: NaN)]
expected: FAIL
[valueAsNumber getter on type datetime-local (actual value: 2019-12-10T12:00, expected valueAsNumber: 1575979200000)]
expected: FAIL
[valueAsNumber getter on type month (actual value: 2019-00, expected valueAsNumber: NaN)]
expected: FAIL
[valueAsNumber getter on type date (actual value: 2016-02-29, expected valueAsNumber: 1456704000000)]
expected: FAIL
[valueAsNumber getter on type time (actual value: , expected valueAsNumber: NaN)]
expected: FAIL
[valueAsNumber setter on type range (actual valueAsNumber: 0, expected value: 0)]
expected: FAIL
[valueAsNumber getter on type range (actual value: 110, expected valueAsNumber: 100)]
expected: FAIL
[valueAsNumber getter on type range (actual value: -10, expected valueAsNumber: 0)]
expected: FAIL
[valueAsNumber setter on type date (actual valueAsNumber: 0, expected value: 1970-01-01)]
expected: FAIL
[valueAsNumber getter on type date (actual value: 2019-00-12, expected valueAsNumber: NaN)]
expected: FAIL
[valueAsNumber getter on type date (actual value: 2019-12-00, expected valueAsNumber: NaN)]
expected: FAIL
[valueAsNumber setter on type date (actual valueAsNumber: 1575936000000, expected value: 2019-12-10)]
expected: FAIL
[valueAsNumber setter on type time (actual valueAsNumber: 43200000, expected value: 12:00)]
expected: FAIL
[valueAsNumber setter on type time (actual valueAsNumber: 0, expected value: 00:00)]
expected: FAIL
[valueAsNumber getter on type time (actual value: 24:00, expected valueAsNumber: NaN)]
expected: FAIL
[valueAsNumber setter on type number (actual valueAsNumber: 123, expected value: 123)]
expected: FAIL
[valueAsNumber getter on type time (actual value: 00:60, expected valueAsNumber: NaN)]
expected: FAIL
[valueAsNumber getter on type week (actual value: 2019-W60, expected valueAsNumber: NaN)]
expected: FAIL
[valueAsNumber getter on type date (actual value: , expected valueAsNumber: NaN)]
expected: FAIL
[valueAsNumber getter on type number (actual value: 123, expected valueAsNumber: 123)]
expected: FAIL
[valueAsNumber setter on type range (actual valueAsNumber: 50, expected value: 50)]
expected: FAIL
[valueAsNumber setter on type week (actual valueAsNumber: 0, expected value: 1970-W01)]
expected: FAIL
[valueAsNumber getter on type week (actual value: , expected valueAsNumber: NaN)]
expected: FAIL
[valueAsNumber getter on type range (actual value: 100, expected valueAsNumber: 100)]
expected: FAIL
[valueAsNumber getter on type datetime-local (actual value: 2019-12-10T00:00, expected valueAsNumber: 1575936000000)]
expected: FAIL
[valueAsNumber getter on type time (actual value: 12:00, expected valueAsNumber: 43200000)]
expected: FAIL
[valueAsNumber getter on type datetime-local (actual value: , expected valueAsNumber: NaN)]
expected: FAIL
[valueAsNumber getter on type number (actual value: , expected valueAsNumber: NaN)]
expected: FAIL
[valueAsNumber getter on type number (actual value: 123.456, expected valueAsNumber: 123.456)]
expected: FAIL
[valueAsNumber getter on type time (actual value: 23:59, expected valueAsNumber: 86340000)]
expected: FAIL
[valueAsNumber getter on type week (actual value: 0000-W50, expected valueAsNumber: NaN)]
expected: FAIL
[valueAsNumber getter on type month (actual value: 2019-12, expected valueAsNumber: 599)]
expected: FAIL
[valueAsNumber getter on type range (actual value: 0, expected valueAsNumber: 0)]
expected: FAIL
[valueAsNumber getter on type range (actual value: 50, expected valueAsNumber: 50)]
expected: FAIL
[valueAsNumber getter on type week (actual value: 2019-W50, expected valueAsNumber: 1575849600000)]
expected: FAIL
[valueAsNumber setter on type datetime-local (actual valueAsNumber: 1575936000000, expected value: 2019-12-10T00:00)]
expected: FAIL
[valueAsNumber getter on type date (actual value: 0000-12-10, expected valueAsNumber: NaN)]
expected: FAIL
[valueAsNumber getter on type date (actual value: 2019-13-10, expected valueAsNumber: NaN)]
expected: FAIL
[valueAsNumber getter on type time (actual value: 00:00, expected valueAsNumber: 0)]
expected: FAIL
[valueAsNumber getter on type range (actual value: , expected valueAsNumber: 50)]
expected: FAIL
[valueAsNumber setter on type range (actual valueAsNumber: 100, expected value: 100)]
expected: FAIL
[valueAsNumber getter on type date (actual value: 2019-02-29, expected valueAsNumber: NaN)]
expected: FAIL
[valueAsNumber getter on type date (actual value: 2019-12-10, expected valueAsNumber: 1575936000000)]
expected: FAIL
[valueAsNumber getter on type week (actual value: 2019-W00, expected valueAsNumber: NaN)]
expected: FAIL
[valueAsNumber getter on type month (actual value: , expected valueAsNumber: NaN)]
expected: FAIL

4
tests/wpt/metadata/html/semantics/forms/the-input-element/radio.html.ini Normal file
View file

@ -0,0 +1,4 @@
[radio.html]
[Radio buttons in an orphan tree should make a group]
expected: FAIL

5
tests/wpt/metadata/webmessaging/with-ports/018.html.ini Normal file
View file

@ -0,0 +1,5 @@
[018.html]
expected: TIMEOUT
[origin of the script that invoked the method, javascript:]
expected: TIMEOUT

3
tests/wpt/metadata/webxr/xrSession_input_events_end.https.html.ini
View file

@ -1,4 +1,5 @@
[xrSession_input_events_end.https.html]
expected: TIMEOUT
[Calling end during an input callback stops processing at the right time]
expected: FAIL
expected: TIMEOUT

1
tests/wpt/metadata/workers/semantics/multiple-workers/005.html.ini
View file

@ -1,5 +1,4 @@
[005.html]
expected: ERROR
[dedicated worker in shared worker in dedicated worker]
expected: FAIL

6
tests/wpt/web-platform-tests/clipboard-apis/async-interfaces.https.html
View file

@ -9,12 +9,13 @@
<script>
'use strict';
function doTest(idl, dom) {
function doTest(idl, dom, html) {
const idl_array = new IdlArray();
idl_array.add_untested_idls('interface Navigator {};');
idl_array.add_untested_idls('interface EventTarget {};');
idl_array.add_untested_idls('dictionary PermissionDescriptor {};');
idl_array.add_untested_idls(dom, { only: ['Event', 'EventInit'] });
idl_array.add_untested_idls(html, { only: ['DataTransfer', 'DataTransferItemList'] });
idl_array.add_idls(idl);
idl_array.add_objects({
Navigator: ['navigator'],
@ -33,7 +34,8 @@ promise_test(() => {
[
'/interfaces/clipboard-apis.idl',
'/interfaces/dom.idl',
'/interfaces/html.idl',
].map(fetchText))
.then(([idl, dom]) => doTest(idl, dom));
.then(([idl, dom, html]) => doTest(idl, dom, html));
}, 'Test driver');
</script>

0
tests/wpt/web-platform-tests/conformance-checkers/html-rdfa/0234-novalid.html → tests/wpt/web-platform-tests/conformance-checkers/html-rdfa/0234-isvalid.html
View file

0
tests/wpt/web-platform-tests/conformance-checkers/html-rdfa/0303-novalid.html → tests/wpt/web-platform-tests/conformance-checkers/html-rdfa/0303-isvalid.html
View file

0
tests/wpt/web-platform-tests/conformance-checkers/html-rdfalite/0015-novalid.html → tests/wpt/web-platform-tests/conformance-checkers/html-rdfalite/0015-isvalid.html
View file

0
tests/wpt/web-platform-tests/conformance-checkers/html-rdfalite/0030-novalid.html → tests/wpt/web-platform-tests/conformance-checkers/html-rdfalite/0030-isvalid.html
View file

0
tests/wpt/web-platform-tests/conformance-checkers/html-rdfalite/0071-novalid.html → tests/wpt/web-platform-tests/conformance-checkers/html-rdfalite/0071-isvalid.html
View file

0
tests/wpt/web-platform-tests/conformance-checkers/html-rdfalite/0074-novalid.html → tests/wpt/web-platform-tests/conformance-checkers/html-rdfalite/0074-isvalid.html
View file

6
tests/wpt/web-platform-tests/conformance-checkers/messages.json
View file

@ -28,22 +28,16 @@
"html-rdfa/0226-novalid.html": "Element \u201cp\u201d not allowed as child of element \u201cspan\u201d in this context. (Suppressing further errors from this subtree.)",
"html-rdfa/0227-novalid.html": "Element \u201cp\u201d not allowed as child of element \u201cspan\u201d in this context. (Suppressing further errors from this subtree.)",
"html-rdfa/0230-novalid.html": "Attribute \u201chref\u201d not allowed on element \u201cimg\u201d at this point.",
"html-rdfa/0234-novalid.html": "Bad value \u201cdescribedby\u201d for attribute \u201crel\u201d on element \u201ca\u201d: Bad list of link-type keywords: The string \u201cdescribedby\u201d is not a registered keyword.",
"html-rdfa/0237-novalid.html": "Bad value \u201c$malformed http://example.com\u201d for attribute \u201cprefix\u201d on element \u201cbody\u201d.",
"html-rdfa/0258-novalid.html": "Attribute \u201cxmlns:_\u201d not allowed here.",
"html-rdfa/0280-novalid.html": "Bad value \u201cP2011Y06M28DT00H00M00S\u201d for attribute \u201cdatetime\u201d on element \u201ctime\u201d: Bad time-datetime: The literal did not satisfy the time-datetime format.",
"html-rdfa/0285-novalid.html": "Bad value \u201cD-Day\u201d for attribute \u201cdatetime\u201d on element \u201ctime\u201d: Bad time-datetime: The literal did not satisfy the time-datetime format.",
"html-rdfa/0303-novalid.html": "Bad value \u201chomepage foaf:homepage\u201d for attribute \u201crel\u201d on element \u201ca\u201d: Bad list of link-type keywords: The string \u201chomepage\u201d is not a registered keyword.",
"html-rdfa/0308-novalid.html": "Bad value \u201chttp://www.example.com/roles/somerole\u201d for attribute \u201crole\u201d on element \u201cdiv\u201d.",
"html-rdfa/0309-novalid.html": "Bad value \u201cex:somerole\u201d for attribute \u201crole\u201d on element \u201cdiv\u201d.",
"html-rdfa/0310-novalid.html": "Bad value \u201cex:somerole someOtherRole http://www.example.com/alternate/role\u201d for attribute \u201crole\u201d on element \u201cdiv\u201d.",
"html-rdfa/0314-novalid.html": "Bad value \u201csection\u201d for attribute \u201crole\u201d on element \u201cdiv\u201d.",
"html-rdfa/0319-novalid.html": "Attribute \u201cxmlns:xpr\u201d not allowed here.",
"html-rdfa/0320-novalid.html": "Attribute \u201csrc\u201d not allowed on element \u201ca\u201d at this point.",
"html-rdfalite/0015-novalid.html": "Bad value \u201cdc:source\u201d for attribute \u201crel\u201d on element \u201clink\u201d: Bad list of link-type keywords: The string \u201cdc:source\u201d is not a registered keyword.",
"html-rdfalite/0030-novalid.html": "Bad value \u201ccc:license\u201d for attribute \u201crel\u201d on element \u201ca\u201d: Bad list of link-type keywords: The string \u201ccc:license\u201d is not a registered keyword.",
"html-rdfalite/0071-novalid.html": "Bad value \u201ccc:license\u201d for attribute \u201crel\u201d on element \u201ca\u201d: Bad list of link-type keywords: The string \u201ccc:license\u201d is not a registered keyword.",
"html-rdfalite/0074-novalid.html": "Bad value \u201cdc:creator\u201d for attribute \u201crel\u201d on element \u201ca\u201d: Bad list of link-type keywords: The string \u201cdc:creator\u201d is not a registered keyword.",
"html-rdfalite/0147.novalid.html": "Attribute \u201cxmlns:xmlzzz\u201d not allowed here.",
"html-rdfalite/0319-novalid.html": "Attribute \u201cxmlns:xpr\u201d not allowed here.",
"html-svg/animate-elem-24-t-novalid.html": "Duplicate ID \u201cMyFont\u201d.",

3
tests/wpt/web-platform-tests/cookies/http-state/general-tests.html
View file

@ -49,8 +49,7 @@
{file: "0025", name: "Ignore cookies with ';' in all 'Set-Cookie'."},
{file: "0026", name: "Ignore malformed cookies in all 'Set-Cookie' v2."},
{file: "0027", name: "Ignore malformed cookies in all 'Set-Cookie' v3."},
// TODO(fhorschig): Ask about 0028's expectations ... should be empty?
{file: "0028", name: "[INVALID EXPECTATION] Ignore malformed cookies in all 'Set-Cookie' v4."},
{file: "0028", name: "Ignore malformed cookies in all 'Set-Cookie' v4."},
];
for (const i in TEST_CASES) {

2
tests/wpt/web-platform-tests/cookies/http-state/resources/cookie-http-state-template.js
View file

@ -39,7 +39,7 @@ function expireCookie(name, expiry_date, path) {
name = name || "";
expiry_date = expiry_date || "Thu, 01 Jan 1970 00:00:00 UTC";
path = path || getLocalResourcesPath();
document.cookie = name + "=; expires=" + expiry_date + "; path=" + path + ";";
document.cookie = name + "=value; expires=" + expiry_date + "; path=" + path + ";";
}
/* Captures a snapshot of cookies with |parse| and allows to diff it with a

2
tests/wpt/web-platform-tests/cookies/http-state/resources/test-files/0026-test
View file

@ -1,2 +1,2 @@
Set-Cookie: foo
Set-Cookie:
Set-Cookie:

2
tests/wpt/web-platform-tests/cookies/http-state/resources/test-files/0028-expected
View file

@ -1,2 +0,0 @@
Set-Cookie: foo
Set-Cookie:

2
tests/wpt/web-platform-tests/cookies/http-state/resources/test-files/0028-test
View file

@ -1,2 +1,2 @@
Set-Cookie: foo
Set-Cookie:
Set-Cookie:

3
tests/wpt/web-platform-tests/css/css-color-adjust/rendering/dark-color-scheme/color-scheme-iframe-background-ref.html Normal file
View file

@ -0,0 +1,3 @@
<!doctype html>
<title>CSS Test Reference</title>
<iframe width="600" height="400" src="support/dark-frame-ref.html"></iframe>

6
tests/wpt/web-platform-tests/css/css-color-adjust/rendering/dark-color-scheme/color-scheme-iframe-background.html Normal file
View file

@ -0,0 +1,6 @@
<!doctype html>
<title>CSS Color Adjustment Test: Frames with a dark color-scheme should still be transparent</title>
<link rel="help" href="https://drafts.csswg.org/css-color-adjust/#color-scheme-processing">
<link rel="match" href="color-scheme-iframe-background-ref.html">
<link rel="stylesheet" href="support/assert-preferred-dark.css">
<iframe width="600" height="400" src="support/dark-frame.html"></iframe>

15
tests/wpt/web-platform-tests/css/css-color-adjust/rendering/dark-color-scheme/color-scheme-root-background.html Normal file
View file

@ -0,0 +1,15 @@
<!doctype html>
<title>CSS Color Adjustment Test: color-scheme does not affect :root background</title>
<link rel="help" href="https://drafts.csswg.org/css-color-adjust/#color-scheme-processing">
<link rel="stylesheet" href="support/assert-preferred-dark.css">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<style>
:root { color-scheme: dark }
</style>
<body></body>
<script>
test(() => {
assert_equals(getComputedStyle(document.documentElement).backgroundColor, "rgba(0, 0, 0, 0)");
}, "Root element background should be transparent for dark color-scheme.");
</script>

9
tests/wpt/web-platform-tests/css/css-color-adjust/rendering/dark-color-scheme/support/assert-preferred-dark.css Normal file
View file

@ -0,0 +1,9 @@
@media not all and (prefers-color-scheme: dark) {
:root {
background-color: red !important;
}
body::before {
font-size: 64px;
content: "Test must be run with preferred dark color scheme.";
}
}

5
tests/wpt/web-platform-tests/css/css-color-adjust/rendering/dark-color-scheme/support/dark-frame-ref.html Normal file
View file

@ -0,0 +1,5 @@
<!doctype html>
<style>
p { color: green }
</style>
<p>This text should be green and the background should be the same as the top document.</p>

6
tests/wpt/web-platform-tests/css/css-color-adjust/rendering/dark-color-scheme/support/dark-frame.html Normal file
View file

@ -0,0 +1,6 @@
<!doctype html>
<style>
:root { color-scheme: dark }
p { color: green }
</style>
<p>This text should be green and the background should be the same as the top document.</p>

50
tests/wpt/web-platform-tests/css/css-color/animation/color-composition.html Normal file
View file

@ -0,0 +1,50 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>color composition</title>
<link rel="help" href="https://drafts.csswg.org/css-color/#the-color-property">
<meta name="assert" content="color supports animation by computed value type">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/interpolation-testcommon.js"></script>
<style>
.target {
width: 40px;
height: 40px;
background-color: black;
}
.expected {
background-color: green;
}
</style>
<body>
<script>
test_composition({
property: 'color',
underlying: 'rgb(50, 50, 50)',
addFrom: 'rgb(10, 10, 10)',
replaceTo: 'rgb(30, 30, 30)',
}, [
{at: 0, expect: 'rgb(60, 60, 60)'},
{at: 0.2, expect: 'rgb(54, 54, 54)'},
{at: 1, expect: 'rgb(30, 30, 30)'},
{at: 1.2, expect: 'rgb(24, 24, 24)'},
{at: 1.5, expect: 'rgb(15, 15, 15)'},
]);
test_composition({
property: 'color',
underlying: 'rgb(60, 60, 60)',
addFrom: 'rgb(0, 0, 0)',
replaceTo: 'rgb(50, 50, 50)',
}, [
{at: 0, expect: 'rgb(60, 60, 60)'},
{at: 0.5, expect: 'rgb(55, 55, 55)'},
{at: 1, expect: 'rgb(50, 50, 50)'},
{at: 1.2, expect: 'rgb(48, 48, 48)'},
{at: 1.5, expect: 'rgb(45, 45, 45)'},
]);
</script>
</body>

78
tests/wpt/web-platform-tests/css/css-flexbox/animation/flex-basis-composition.html Normal file
View file

@ -0,0 +1,78 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>flex-basis composition</title>
<link rel="help" href="https://drafts.csswg.org/css-flexbox-1/#flex-basis-property">
<meta name="assert" content="flex-basis supports animation by computed value type">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/interpolation-testcommon.js"></script>
<body>
<script>
test_composition({
property: 'flex-basis',
underlying: '50px',
addFrom: '100px',
addTo: '200px',
}, [
{at: -0.3, expect: '120px'},
{at: 0, expect: '150px'},
{at: 0.5, expect: '200px'},
{at: 1, expect: '250px'},
{at: 1.5, expect: '300px'},
]);
test_composition({
property: 'flex-basis',
underlying: '100px',
addFrom: '10px',
addTo: '2px',
}, [
{at: -0.5, expect: '114px'},
{at: 0, expect: '110px'},
{at: 0.5, expect: '106px'},
{at: 1, expect: '102px'},
{at: 1.5, expect: '98px'}, // Value clamping should happen after composition.
]);
test_composition({
property: 'flex-basis',
underlying: '10%',
addFrom: '100px',
addTo: '20%',
}, [
{at: -0.3, expect: 'calc(130px + 4%)'},
{at: 0, expect: 'calc(100px + 10%)'},
{at: 0.5, expect: 'calc(50px + 20%)'},
{at: 1, expect: '30%'},
{at: 1.5, expect: 'calc(-50px + 40%)'},
]);
test_composition({
property: 'flex-basis',
underlying: '50px',
addFrom: '100px',
replaceTo: '200px',
}, [
{at: -0.3, expect: '135px'},
{at: 0, expect: '150px'},
{at: 0.5, expect: '175px'},
{at: 1, expect: '200px'},
{at: 1.5, expect: '225px'},
]);
test_composition({
property: 'flex-basis',
underlying: '100px',
addFrom: '100px',
addTo: 'auto',
}, [
{at: -0.3, expect: '200px'},
{at: 0, expect: '200px'},
{at: 0.5, expect: 'auto'},
{at: 1, expect: 'auto'},
{at: 1.5, expect: 'auto'},
]);
</script>
</body>

358
tests/wpt/web-platform-tests/css/css-grid/alignment/grid-align-content-distribution-vertical-lr.html
View file

@ -1,358 +0,0 @@
<meta charset="utf-8">
<title>CSS Grid Layout Test: aligned content distribution for vertical lr</title>
<link rel="author" title="Rossana Monteriso" href="mailto:rmonteriso@igalia.com">
<link rel="help" href="https://drafts.csswg.org/css-align-3/#distribution-values">
<meta name="assert" content="This test checks that the align-content property is applied correctly when using content-distribution values for the vertical-lr writing mode.">
<meta name="flags" content="ahem">
<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" />
<link rel="stylesheet" href="/css/support/grid.css">
<style>
.grid {
grid-auto-columns: 20px;
grid-auto-rows: 40px;
position: relative;
width: 400px;
height: 300px;
}
.stretchedGrid {
grid-auto-rows: auto;
}
.thirdRowFirstColumn {
background-color: green;
grid-column: 1;
grid-row: 3;
}
.fourthRowFirstColumn {
background-color: deepskyblue;
grid-column: 1;
grid-row: 4;
}
.fourthRowSecondColumn {
background-color: maroon;
grid-column: 2;
grid-row: 4;
}
.thirdRowFirstColumn {
background-color: green;
grid-column: 1;
grid-row: 3;
}
.fourthRowFirstColumn {
background-color: deepskyblue;
grid-column: 1;
grid-row: 4;
}
.fourthRowSecondColumn {
background-color: maroon;
grid-column: 2;
grid-row: 4;
}
</style>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/resources/check-layout-th.js"></script>
<body onload="checkLayout('.grid')">
<p>This test checks that the align-content property is applied correctly when using content-distribution values in vertical-lr writing mode.</p>
<div style="position: relative">
<p>direction: LTR | align-content: 'space-between'</p>
<div class="grid alignContentSpaceBetween verticalLR" data-expected-width="400" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="firstRowSecondColumn" data-offset-x="0" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowFirstColumn" data-offset-x="360" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowSecondColumn" data-offset-x="360" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
</div>
</div>
<div style="position: relative">
<p>direction: LTR | align-content: 'space-around'</p>
<div class="grid alignContentSpaceAround verticalLR" data-expected-width="400" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="80" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="firstRowSecondColumn" data-offset-x="80" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowFirstColumn" data-offset-x="280" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowSecondColumn" data-offset-x="280" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
</div>
</div>
<div style="position: relative">
<p>direction: LTR | align-content: 'space-evenly'</p>
<div class="grid alignContentSpaceEvenly verticalLR" data-expected-width="400" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="107" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="firstRowSecondColumn" data-offset-x="107" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowFirstColumn" data-offset-x="253" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowSecondColumn" data-offset-x="253" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
</div>
</div>
<div style="position: relative">
<p>direction: LTR | align-content: 'stretch'</p>
<div class="grid stretchedGrid alignContentStretch verticalLR" data-expected-width="400" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="200" data-expected-height="20"></div>
<div class="firstRowSecondColumn" data-offset-x="0" data-offset-y="20" data-expected-width="200" data-expected-height="20"></div>
<div class="secondRowFirstColumn" data-offset-x="200" data-offset-y="0" data-expected-width="200" data-expected-height="20"></div>
<div class="secondRowSecondColumn" data-offset-x="200" data-offset-y="20" data-expected-width="200" data-expected-height="20"></div>
</div>
</div>
<div style="position: relative">
<p>direction: LTR | align-content: 'space-between'</p>
<div class="grid alignContentSpaceBetween verticalLR" data-expected-width="400" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="firstRowSecondColumn" data-offset-x="0" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowFirstColumn" data-offset-x="180" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowSecondColumn" data-offset-x="180" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
<div class="thirdRowFirstColumn" data-offset-x="360" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="thirdRowSecondColumn" data-offset-x="360" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
</div>
</div>
<div style="position: relative">
<p>direction: LTR | align-content: 'space-around'</p>
<div class="grid alignContentSpaceAround verticalLR" data-expected-width="400" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="47" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="firstRowSecondColumn" data-offset-x="47" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowFirstColumn" data-offset-x="180" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowSecondColumn" data-offset-x="180" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
<div class="thirdRowFirstColumn" data-offset-x="313" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="thirdRowSecondColumn" data-offset-x="313" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
</div>
</div>
<div style="position: relative">
<p>direction: LTR | align-content: 'space-evenly'</p>
<div class="grid alignContentSpaceEvenly verticalLR" data-expected-width="400" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="70" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="firstRowSecondColumn" data-offset-x="70" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowFirstColumn" data-offset-x="180" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowSecondColumn" data-offset-x="180" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
<div class="thirdRowFirstColumn" data-offset-x="290" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="thirdRowSecondColumn" data-offset-x="290" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
</div>
</div>
<div style="position: relative">
<p>direction: LTR | align-content: 'stretch'</p>
<div class="grid stretchedGrid alignContentStretch verticalLR" data-expected-width="400" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="133" data-expected-height="20"></div>
<div class="firstRowSecondColumn" data-offset-x="0" data-offset-y="20" data-expected-width="133" data-expected-height="20"></div>
<div class="secondRowFirstColumn" data-offset-x="133" data-offset-y="0" data-expected-width="133" data-expected-height="20"></div>
<div class="secondRowSecondColumn" data-offset-x="133" data-offset-y="20" data-expected-width="133" data-expected-height="20"></div>
<div class="thirdRowFirstColumn" data-offset-x="267" data-offset-y="0" data-expected-width="133" data-expected-height="20"></div>
<div class="thirdRowSecondColumn" data-offset-x="267" data-offset-y="20" data-expected-width="133" data-expected-height="20"></div>
</div>
</div>
<div style="position: relative">
<p>direction: LTR | align-content: 'space-between'</p>
<div class="grid alignContentSpaceBetween verticalLR" data-expected-width="400" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="firstRowSecondColumn" data-offset-x="0" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowFirstColumn" data-offset-x="120" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowSecondColumn" data-offset-x="120" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
<div class="thirdRowFirstColumn" data-offset-x="240" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="thirdRowSecondColumn" data-offset-x="240" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
<div class="fourthRowFirstColumn" data-offset-x="360" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="fourthRowSecondColumn" data-offset-x="360" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
</div>
</div>
<div style="position: relative">
<p>direction: LTR | align-content: 'space-around'</p>
<div class="grid alignContentSpaceAround verticalLR" data-expected-width="400" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="30" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="firstRowSecondColumn" data-offset-x="30" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowFirstColumn" data-offset-x="130" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowSecondColumn" data-offset-x="130" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
<div class="thirdRowFirstColumn" data-offset-x="230" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="thirdRowSecondColumn" data-offset-x="230" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
<div class="fourthRowFirstColumn" data-offset-x="330" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="fourthRowSecondColumn" data-offset-x="330" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
</div>
</div>
<div style="position: relative">
<p>direction: LTR | align-content: 'space-evenly'</p>
<div class="grid alignContentSpaceEvenly verticalLR" data-expected-width="400" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="48" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="firstRowSecondColumn" data-offset-x="48" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowFirstColumn" data-offset-x="136" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowSecondColumn" data-offset-x="136" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
<div class="thirdRowFirstColumn" data-offset-x="224" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="thirdRowSecondColumn" data-offset-x="224" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
<div class="fourthRowFirstColumn" data-offset-x="312" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="fourthRowSecondColumn" data-offset-x="312" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
</div>
</div>
<div style="position: relative">
<p>direction: LTR | align-content: 'stretch'</p>
<div class="grid stretchedGrid alignContentStretch verticalLR" data-expected-width="400" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="100" data-expected-height="20"></div>
<div class="firstRowSecondColumn" data-offset-x="0" data-offset-y="20" data-expected-width="100" data-expected-height="20"></div>
<div class="secondRowFirstColumn" data-offset-x="100" data-offset-y="0" data-expected-width="100" data-expected-height="20"></div>
<div class="secondRowSecondColumn" data-offset-x="100" data-offset-y="20" data-expected-width="100" data-expected-height="20"></div>
<div class="thirdRowFirstColumn" data-offset-x="200" data-offset-y="0" data-expected-width="100" data-expected-height="20"></div>
<div class="thirdRowSecondColumn" data-offset-x="200" data-offset-y="20" data-expected-width="100" data-expected-height="20"></div>
<div class="fourthRowFirstColumn" data-offset-x="300" data-offset-y="0" data-expected-width="100" data-expected-height="20"></div>
<div class="fourthRowSecondColumn" data-offset-x="300" data-offset-y="20" data-expected-width="100" data-expected-height="20"></div>
</div>
</div>
<!-- RTL direction. -->
<div style="position: relative">
<p>direction: RTL | align-content: 'space-between'</p>
<div class="grid alignContentSpaceBetween verticalLR directionRTL" data-expected-width="400" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="0" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="firstRowSecondColumn" data-offset-x="0" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowFirstColumn" data-offset-x="360" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowSecondColumn" data-offset-x="360" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
</div>
</div>
<div style="position: relative">
<p>direction: RTL | align-content: 'space-around'</p>
<div class="grid alignContentSpaceAround verticalLR directionRTL" data-expected-width="400" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="80" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="firstRowSecondColumn" data-offset-x="80" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowFirstColumn" data-offset-x="280" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowSecondColumn" data-offset-x="280" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
</div>
</div>
<div style="position: relative">
<p>direction: RTL | align-content: 'space-evenly'</p>
<div class="grid alignContentSpaceEvenly verticalLR directionRTL" data-expected-width="400" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="107" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="firstRowSecondColumn" data-offset-x="107" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowFirstColumn" data-offset-x="253" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowSecondColumn" data-offset-x="253" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
</div>
</div>
<div style="position: relative">
<p>direction: RTL | align-content: 'stretch'</p>
<div class="grid stretchedGrid alignContentStretch verticalLR directionRTL" data-expected-width="400" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="0" data-offset-y="280" data-expected-width="200" data-expected-height="20"></div>
<div class="firstRowSecondColumn" data-offset-x="0" data-offset-y="260" data-expected-width="200" data-expected-height="20"></div>
<div class="secondRowFirstColumn" data-offset-x="200" data-offset-y="280" data-expected-width="200" data-expected-height="20"></div>
<div class="secondRowSecondColumn" data-offset-x="200" data-offset-y="260" data-expected-width="200" data-expected-height="20"></div>
</div>
</div>
<div style="position: relative">
<p>direction: RTL | align-content: 'space-between'</p>
<div class="grid alignContentSpaceBetween verticalLR directionRTL" data-expected-width="400" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="0" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="firstRowSecondColumn" data-offset-x="0" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowFirstColumn" data-offset-x="180" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowSecondColumn" data-offset-x="180" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
<div class="thirdRowFirstColumn" data-offset-x="360" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="thirdRowSecondColumn" data-offset-x="360" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
</div>
</div>
<div style="position: relative">
<p>direction: RTL | align-content: 'space-around'</p>
<div class="grid alignContentSpaceAround verticalLR directionRTL" data-expected-width="400" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="47" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="firstRowSecondColumn" data-offset-x="47" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowFirstColumn" data-offset-x="180" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowSecondColumn" data-offset-x="180" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
<div class="thirdRowFirstColumn" data-offset-x="313" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="thirdRowSecondColumn" data-offset-x="313" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
</div>
</div>
<div style="position: relative">
<p>direction: RTL | align-content: 'space-evenly'</p>
<div class="grid alignContentSpaceEvenly verticalLR directionRTL" data-expected-width="400" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="70" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="firstRowSecondColumn" data-offset-x="70" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowFirstColumn" data-offset-x="180" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowSecondColumn" data-offset-x="180" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
<div class="thirdRowFirstColumn" data-offset-x="290" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="thirdRowSecondColumn" data-offset-x="290" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
</div>
</div>
<div style="position: relative">
<p>direction: RTL | align-content: 'stretch'</p>
<div class="grid stretchedGrid alignContentStretch verticalLR directionRTL" data-expected-width="400" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="0" data-offset-y="280" data-expected-width="133" data-expected-height="20"></div>
<div class="firstRowSecondColumn" data-offset-x="0" data-offset-y="260" data-expected-width="133" data-expected-height="20"></div>
<div class="secondRowFirstColumn" data-offset-x="133" data-offset-y="280" data-expected-width="133" data-expected-height="20"></div>
<div class="secondRowSecondColumn" data-offset-x="133" data-offset-y="260" data-expected-width="133" data-expected-height="20"></div>
<div class="thirdRowFirstColumn" data-offset-x="267" data-offset-y="280" data-expected-width="133" data-expected-height="20"></div>
<div class="thirdRowSecondColumn" data-offset-x="267" data-offset-y="260" data-expected-width="133" data-expected-height="20"></div>
</div>
</div>
<div style="position: relative">
<p>direction: RTL | align-content: 'space-between'</p>
<div class="grid alignContentSpaceBetween verticalLR directionRTL" data-expected-width="400" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="0" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="firstRowSecondColumn" data-offset-x="0" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowFirstColumn" data-offset-x="120" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowSecondColumn" data-offset-x="120" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
<div class="thirdRowFirstColumn" data-offset-x="240" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="thirdRowSecondColumn" data-offset-x="240" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
<div class="fourthRowFirstColumn" data-offset-x="360" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="fourthRowSecondColumn" data-offset-x="360" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
</div>
</div>
<div style="position: relative">
<p>direction: RTL | align-content: 'space-around'</p>
<div class="grid alignContentSpaceAround verticalLR directionRTL" data-expected-width="400" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="30" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="firstRowSecondColumn" data-offset-x="30" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowFirstColumn" data-offset-x="130" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowSecondColumn" data-offset-x="130" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
<div class="thirdRowFirstColumn" data-offset-x="230" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="thirdRowSecondColumn" data-offset-x="230" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
<div class="fourthRowFirstColumn" data-offset-x="330" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="fourthRowSecondColumn" data-offset-x="330" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
</div>
</div>
<div style="position: relative">
<p>direction: RTL | align-content: 'space-evenly'</p>
<div class="grid alignContentSpaceEvenly verticalLR directionRTL" data-expected-width="400" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="48" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="firstRowSecondColumn" data-offset-x="48" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowFirstColumn" data-offset-x="136" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowSecondColumn" data-offset-x="136" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
<div class="thirdRowFirstColumn" data-offset-x="224" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="thirdRowSecondColumn" data-offset-x="224" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
<div class="fourthRowFirstColumn" data-offset-x="312" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="fourthRowSecondColumn" data-offset-x="312" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
</div>
</div>
<div style="position: relative">
<p>direction: RTL | align-content: 'stretch'</p>
<div class="grid stretchedGrid alignContentStretch verticalLR directionRTL" data-expected-width="400" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="0" data-offset-y="280" data-expected-width="100" data-expected-height="20"></div>
<div class="firstRowSecondColumn" data-offset-x="0" data-offset-y="260" data-expected-width="100" data-expected-height="20"></div>
<div class="secondRowFirstColumn" data-offset-x="100" data-offset-y="280" data-expected-width="100" data-expected-height="20"></div>
<div class="secondRowSecondColumn" data-offset-x="100" data-offset-y="260" data-expected-width="100" data-expected-height="20"></div>
<div class="thirdRowFirstColumn" data-offset-x="200" data-offset-y="280" data-expected-width="100" data-expected-height="20"></div>
<div class="thirdRowSecondColumn" data-offset-x="200" data-offset-y="260" data-expected-width="100" data-expected-height="20"></div>
<div class="fourthRowFirstColumn" data-offset-x="300" data-offset-y="280" data-expected-width="100" data-expected-height="20"></div>
<div class="fourthRowSecondColumn" data-offset-x="300" data-offset-y="260" data-expected-width="100" data-expected-height="20"></div>
</div>
</div>
</body>

358
tests/wpt/web-platform-tests/css/css-grid/alignment/grid-align-content-distribution-vertical-rl.html
View file

@ -1,358 +0,0 @@
<meta charset="utf-8">
<title>CSS Grid Layout Test: aligned content distribution for vertical rl</title>
<link rel="author" title="Rossana Monteriso" href="mailto:rmonteriso@igalia.com">
<link rel="help" href="https://drafts.csswg.org/css-align-3/#distribution-values">
<meta name="assert" content="This test checks that the align-content property is applied correctly when using content-distribution values for the vertical-rl writing mode.">
<meta name="flags" content="ahem">
<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" />
<link rel="stylesheet" href="/css/support/grid.css">
<style>
.grid {
grid-auto-columns: 20px;
grid-auto-rows: 40px;
position: relative;
width: 400px;
height: 300px;
}
.stretchedGrid {
grid-auto-rows: auto;
}
.thirdRowFirstColumn {
background-color: green;
grid-column: 1;
grid-row: 3;
}
.fourthRowFirstColumn {
background-color: deepskyblue;
grid-column: 1;
grid-row: 4;
}
.fourthRowSecondColumn {
background-color: maroon;
grid-column: 2;
grid-row: 4;
}
.thirdRowFirstColumn {
background-color: green;
grid-column: 1;
grid-row: 3;
}
.fourthRowFirstColumn {
background-color: deepskyblue;
grid-column: 1;
grid-row: 4;
}
.fourthRowSecondColumn {
background-color: maroon;
grid-column: 2;
grid-row: 4;
}
</style>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/resources/check-layout-th.js"></script>
<body onload="checkLayout('.grid')">
<p>This test checks that the align-content property is applied correctly when using content-distribution values for vertical-rl mode.</p>
<div style="position: relative">
<p>direction: LTR | align-content: 'space-between'</p>
<div class="grid alignContentSpaceBetween verticalRL" data-expected-width="400" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="360" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="firstRowSecondColumn" data-offset-x="360" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowSecondColumn" data-offset-x="0" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
</div>
</div>
<div style="position: relative">
<p>direction: LTR | align-content: 'space-around'</p>
<div class="grid alignContentSpaceAround verticalRL" data-expected-width="400" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="280" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="firstRowSecondColumn" data-offset-x="280" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowFirstColumn" data-offset-x="80" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowSecondColumn" data-offset-x="80" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
</div>
</div>
<div style="position: relative">
<p>direction: LTR | align-content: 'space-evenly'</p>
<div class="grid alignContentSpaceEvenly verticalRL" data-expected-width="400" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="253" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="firstRowSecondColumn" data-offset-x="253" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowFirstColumn" data-offset-x="107" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowSecondColumn" data-offset-x="107" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
</div>
</div>
<div style="position: relative">
<p>direction: LTR | align-content: 'stretch'</p>
<div class="grid stretchedGrid alignContentStretch verticalRL" data-expected-width="400" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="200" data-offset-y="0" data-expected-width="200" data-expected-height="20"></div>
<div class="firstRowSecondColumn" data-offset-x="200" data-offset-y="20" data-expected-width="200" data-expected-height="20"></div>
<div class="secondRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="200" data-expected-height="20"></div>
<div class="secondRowSecondColumn" data-offset-x="0" data-offset-y="20" data-expected-width="200" data-expected-height="20"></div>
</div>
</div>
<div style="position: relative">
<p>direction: LTR | align-content: 'space-between'</p>
<div class="grid alignContentSpaceBetween verticalRL" data-expected-width="400" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="360" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="firstRowSecondColumn" data-offset-x="360" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowFirstColumn" data-offset-x="180" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowSecondColumn" data-offset-x="180" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
<div class="thirdRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="thirdRowSecondColumn" data-offset-x="0" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
</div>
</div>
<div style="position: relative">
<p>direction: LTR | align-content: 'space-around'</p>
<div class="grid alignContentSpaceAround verticalRL" data-expected-width="400" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="313" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="firstRowSecondColumn" data-offset-x="313" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowFirstColumn" data-offset-x="180" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowSecondColumn" data-offset-x="180" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
<div class="thirdRowFirstColumn" data-offset-x="47" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="thirdRowSecondColumn" data-offset-x="47" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
</div>
</div>
<div style="position: relative">
<p>direction: LTR | align-content: 'space-evenly'</p>
<div class="grid alignContentSpaceEvenly verticalRL" data-expected-width="400" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="290" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="firstRowSecondColumn" data-offset-x="290" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowFirstColumn" data-offset-x="180" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowSecondColumn" data-offset-x="180" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
<div class="thirdRowFirstColumn" data-offset-x="70" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="thirdRowSecondColumn" data-offset-x="70" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
</div>
</div>
<div style="position: relative">
<p>direction: LTR | align-content: 'stretch'</p>
<div class="grid stretchedGrid alignContentStretch verticalRL" data-expected-width="400" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="267" data-offset-y="0" data-expected-width="133" data-expected-height="20"></div>
<div class="firstRowSecondColumn" data-offset-x="267" data-offset-y="20" data-expected-width="133" data-expected-height="20"></div>
<div class="secondRowFirstColumn" data-offset-x="133" data-offset-y="0" data-expected-width="133" data-expected-height="20"></div>
<div class="secondRowSecondColumn" data-offset-x="133" data-offset-y="20" data-expected-width="133" data-expected-height="20"></div>
<div class="thirdRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="133" data-expected-height="20"></div>
<div class="thirdRowSecondColumn" data-offset-x="0" data-offset-y="20" data-expected-width="133" data-expected-height="20"></div>
</div>
</div>
<div style="position: relative">
<p>direction: LTR | align-content: 'space-between'</p>
<div class="grid alignContentSpaceBetween verticalRL" data-expected-width="400" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="360" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="firstRowSecondColumn" data-offset-x="360" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowFirstColumn" data-offset-x="240" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowSecondColumn" data-offset-x="240" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
<div class="thirdRowFirstColumn" data-offset-x="120" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="thirdRowSecondColumn" data-offset-x="120" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
<div class="fourthRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="fourthRowSecondColumn" data-offset-x="0" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
</div>
</div>
<div style="position: relative">
<p>direction: LTR | align-content: 'space-around'</p>
<div class="grid alignContentSpaceAround verticalRL" data-expected-width="400" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="330" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="firstRowSecondColumn" data-offset-x="330" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowFirstColumn" data-offset-x="230" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowSecondColumn" data-offset-x="230" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
<div class="thirdRowFirstColumn" data-offset-x="130" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="thirdRowSecondColumn" data-offset-x="130" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
<div class="fourthRowFirstColumn" data-offset-x="30" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="fourthRowSecondColumn" data-offset-x="30" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
</div>
</div>
<div style="position: relative">
<p>direction: LTR | align-content: 'space-evenly'</p>
<div class="grid alignContentSpaceEvenly verticalRL" data-expected-width="400" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="312" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="firstRowSecondColumn" data-offset-x="312" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowFirstColumn" data-offset-x="224" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowSecondColumn" data-offset-x="224" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
<div class="thirdRowFirstColumn" data-offset-x="136" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="thirdRowSecondColumn" data-offset-x="136" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
<div class="fourthRowFirstColumn" data-offset-x="48" data-offset-y="0" data-expected-width="40" data-expected-height="20"></div>
<div class="fourthRowSecondColumn" data-offset-x="48" data-offset-y="20" data-expected-width="40" data-expected-height="20"></div>
</div>
</div>
<div style="position: relative">
<p>direction: LTR | align-content: 'stretch'</p>
<div class="grid stretchedGrid alignContentStretch verticalRL" data-expected-width="400" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="300" data-offset-y="0" data-expected-width="100" data-expected-height="20"></div>
<div class="firstRowSecondColumn" data-offset-x="300" data-offset-y="20" data-expected-width="100" data-expected-height="20"></div>
<div class="secondRowFirstColumn" data-offset-x="200" data-offset-y="0" data-expected-width="100" data-expected-height="20"></div>
<div class="secondRowSecondColumn" data-offset-x="200" data-offset-y="20" data-expected-width="100" data-expected-height="20"></div>
<div class="thirdRowFirstColumn" data-offset-x="100" data-offset-y="0" data-expected-width="100" data-expected-height="20"></div>
<div class="thirdRowSecondColumn" data-offset-x="100" data-offset-y="20" data-expected-width="100" data-expected-height="20"></div>
<div class="fourthRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="100" data-expected-height="20"></div>
<div class="fourthRowSecondColumn" data-offset-x="0" data-offset-y="20" data-expected-width="100" data-expected-height="20"></div>
</div>
</div>
<!-- RTL direction. -->
<div style="position: relative">
<p>direction: RTL | align-content: 'space-between'</p>
<div class="grid alignContentSpaceBetween verticalRL directionRTL" data-expected-width="400" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="360" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="firstRowSecondColumn" data-offset-x="360" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowFirstColumn" data-offset-x="0" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowSecondColumn" data-offset-x="0" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
</div>
</div>
<div style="position: relative">
<p>direction: RTL | align-content: 'space-around'</p>
<div class="grid alignContentSpaceAround verticalRL directionRTL" data-expected-width="400" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="280" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="firstRowSecondColumn" data-offset-x="280" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowFirstColumn" data-offset-x="80" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowSecondColumn" data-offset-x="80" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
</div>
</div>
<div style="position: relative">
<p>direction: RTL | align-content: 'space-evenly'</p>
<div class="grid alignContentSpaceEvenly verticalRL directionRTL" data-expected-width="400" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="253" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="firstRowSecondColumn" data-offset-x="253" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowFirstColumn" data-offset-x="107" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowSecondColumn" data-offset-x="107" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
</div>
</div>
<div style="position: relative">
<p>direction: RTL | align-content: 'stretch'</p>
<div class="grid stretchedGrid alignContentStretch verticalRL directionRTL" data-expected-width="400" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="200" data-offset-y="280" data-expected-width="200" data-expected-height="20"></div>
<div class="firstRowSecondColumn" data-offset-x="200" data-offset-y="260" data-expected-width="200" data-expected-height="20"></div>
<div class="secondRowFirstColumn" data-offset-x="0" data-offset-y="280" data-expected-width="200" data-expected-height="20"></div>
<div class="secondRowSecondColumn" data-offset-x="0" data-offset-y="260" data-expected-width="200" data-expected-height="20"></div>
</div>
</div>
<div style="position: relative">
<p>direction: RTL | align-content: 'space-between'</p>
<div class="grid alignContentSpaceBetween verticalRL directionRTL" data-expected-width="400" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="360" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="firstRowSecondColumn" data-offset-x="360" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowFirstColumn" data-offset-x="180" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowSecondColumn" data-offset-x="180" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
<div class="thirdRowFirstColumn" data-offset-x="0" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="thirdRowSecondColumn" data-offset-x="0" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
</div>
</div>
<div style="position: relative">
<p>direction: RTL | align-content: 'space-around'</p>
<div class="grid alignContentSpaceAround verticalRL directionRTL" data-expected-width="400" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="313" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="firstRowSecondColumn" data-offset-x="313" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowFirstColumn" data-offset-x="180" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowSecondColumn" data-offset-x="180" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
<div class="thirdRowFirstColumn" data-offset-x="47" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="thirdRowSecondColumn" data-offset-x="47" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
</div>
</div>
<div style="position: relative">
<p>direction: RTL | align-content: 'space-evenly'</p>
<div class="grid alignContentSpaceEvenly verticalRL directionRTL" data-expected-width="400" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="290" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="firstRowSecondColumn" data-offset-x="290" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowFirstColumn" data-offset-x="180" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowSecondColumn" data-offset-x="180" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
<div class="thirdRowFirstColumn" data-offset-x="70" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="thirdRowSecondColumn" data-offset-x="70" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
</div>
</div>
<div style="position: relative">
<p>direction: RTL | align-content: 'stretch'</p>
<div class="grid stretchedGrid alignContentStretch verticalRL directionRTL" data-expected-width="400" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="267" data-offset-y="280" data-expected-width="133" data-expected-height="20"></div>
<div class="firstRowSecondColumn" data-offset-x="267" data-offset-y="260" data-expected-width="133" data-expected-height="20"></div>
<div class="secondRowFirstColumn" data-offset-x="133" data-offset-y="280" data-expected-width="133" data-expected-height="20"></div>
<div class="secondRowSecondColumn" data-offset-x="133" data-offset-y="260" data-expected-width="133" data-expected-height="20"></div>
<div class="thirdRowFirstColumn" data-offset-x="0" data-offset-y="280" data-expected-width="133" data-expected-height="20"></div>
<div class="thirdRowSecondColumn" data-offset-x="0" data-offset-y="260" data-expected-width="133" data-expected-height="20"></div>
</div>
</div>
<div style="position: relative">
<p>direction: RTL | align-content: 'space-between'</p>
<div class="grid alignContentSpaceBetween verticalRL directionRTL" data-expected-width="400" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="360" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="firstRowSecondColumn" data-offset-x="360" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowFirstColumn" data-offset-x="240" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowSecondColumn" data-offset-x="240" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
<div class="thirdRowFirstColumn" data-offset-x="120" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="thirdRowSecondColumn" data-offset-x="120" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
<div class="fourthRowFirstColumn" data-offset-x="0" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="fourthRowSecondColumn" data-offset-x="0" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
</div>
</div>
<div style="position: relative">
<p>direction: RTL | align-content: 'space-around'</p>
<div class="grid alignContentSpaceAround verticalRL directionRTL" data-expected-width="400" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="330" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="firstRowSecondColumn" data-offset-x="330" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowFirstColumn" data-offset-x="230" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowSecondColumn" data-offset-x="230" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
<div class="thirdRowFirstColumn" data-offset-x="130" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="thirdRowSecondColumn" data-offset-x="130" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
<div class="fourthRowFirstColumn" data-offset-x="30" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="fourthRowSecondColumn" data-offset-x="30" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
</div>
</div>
<div style="position: relative">
<p>direction: RTL | align-content: 'space-evenly'</p>
<div class="grid alignContentSpaceEvenly verticalRL directionRTL" data-expected-width="400" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="312" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="firstRowSecondColumn" data-offset-x="312" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowFirstColumn" data-offset-x="224" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="secondRowSecondColumn" data-offset-x="224" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
<div class="thirdRowFirstColumn" data-offset-x="136" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="thirdRowSecondColumn" data-offset-x="136" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
<div class="fourthRowFirstColumn" data-offset-x="48" data-offset-y="280" data-expected-width="40" data-expected-height="20"></div>
<div class="fourthRowSecondColumn" data-offset-x="48" data-offset-y="260" data-expected-width="40" data-expected-height="20"></div>
</div>
</div>
<div style="position: relative">
<p>direction: RTL | align-content: 'stretch'</p>
<div class="grid stretchedGrid alignContentStretch verticalRL directionRTL" data-expected-width="400" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="300" data-offset-y="280" data-expected-width="100" data-expected-height="20"></div>
<div class="firstRowSecondColumn" data-offset-x="300" data-offset-y="260" data-expected-width="100" data-expected-height="20"></div>
<div class="secondRowFirstColumn" data-offset-x="200" data-offset-y="280" data-expected-width="100" data-expected-height="20"></div>
<div class="secondRowSecondColumn" data-offset-x="200" data-offset-y="260" data-expected-width="100" data-expected-height="20"></div>
<div class="thirdRowFirstColumn" data-offset-x="100" data-offset-y="280" data-expected-width="100" data-expected-height="20"></div>
<div class="thirdRowSecondColumn" data-offset-x="100" data-offset-y="260" data-expected-width="100" data-expected-height="20"></div>
<div class="fourthRowFirstColumn" data-offset-x="0" data-offset-y="280" data-expected-width="100" data-expected-height="20"></div>
<div class="fourthRowSecondColumn" data-offset-x="0" data-offset-y="260" data-expected-width="100" data-expected-height="20"></div>
</div>
</div>
</body>

358
tests/wpt/web-platform-tests/css/css-grid/alignment/grid-align-content-distribution.html
View file

@ -1,358 +0,0 @@
<meta charset="utf-8">
<title>CSS Grid Layout Test: aligned content distribution</title>
<link rel="author" title="Rossana Monteriso" href="mailto:rmonteriso@igalia.com">
<link rel="help" href="https://drafts.csswg.org/css-align-3/#distribution-values">
<meta name="assert" content="This test checks that the align-content property is applied correctly when using content-distribution values.">
<meta name="flags" content="ahem">
<link rel="stylesheet" type="text/css" href="/fonts/ahem.css" />
<link rel="stylesheet" href="/css/support/grid.css">
<style>
.grid {
grid-auto-columns: 20px;
grid-auto-rows: 40px;
position: relative;
width: 200px;
height: 300px;
}
.stretchedGrid {
grid-auto-rows: auto;
}
.thirdRowFirstColumn {
background-color: green;
grid-column: 1;
grid-row: 3;
}
.fourthRowFirstColumn {
background-color: deepskyblue;
grid-column: 1;
grid-row: 4;
}
.fourthRowSecondColumn {
background-color: maroon;
grid-column: 2;
grid-row: 4;
}
.thirdRowFirstColumn {
background-color: green;
grid-column: 1;
grid-row: 3;
}
.fourthRowFirstColumn {
background-color: deepskyblue;
grid-column: 1;
grid-row: 4;
}
.fourthRowSecondColumn {
background-color: maroon;
grid-column: 2;
grid-row: 4;
}
</style>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/resources/check-layout-th.js"></script>
<body onload="checkLayout('.grid')">
<p>This test checks that the align-content property is applied correctly when using content-distribution values.</p>
<div style="position: relative">
<p>direction: LTR | align-content: 'space-between'</p>
<div class="grid alignContentSpaceBetween" data-expected-width="200" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="20" data-expected-height="40"></div>
<div class="firstRowSecondColumn" data-offset-x="20" data-offset-y="0" data-expected-width="20" data-expected-height="40"></div>
<div class="secondRowFirstColumn" data-offset-x="0" data-offset-y="260" data-expected-width="20" data-expected-height="40"></div>
<div class="secondRowSecondColumn" data-offset-x="20" data-offset-y="260" data-expected-width="20" data-expected-height="40"></div>
</div>
</div>
<div style="position: relative">
<p>direction: LTR | align-content: 'space-around'</p>
<div class="grid alignContentSpaceAround" data-expected-width="200" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="0" data-offset-y="55" data-expected-width="20" data-expected-height="40"></div>
<div class="firstRowSecondColumn" data-offset-x="20" data-offset-y="55" data-expected-width="20" data-expected-height="40"></div>
<div class="secondRowFirstColumn" data-offset-x="0" data-offset-y="205" data-expected-width="20" data-expected-height="40"></div>
<div class="secondRowSecondColumn" data-offset-x="20" data-offset-y="205" data-expected-width="20" data-expected-height="40"></div>
</div>
</div>
<div style="position: relative">
<p>direction: LTR | align-content: 'space-evenly'</p>
<div class="grid alignContentSpaceEvenly" data-expected-width="200" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="0" data-offset-y="73" data-expected-width="20" data-expected-height="40"></div>
<div class="firstRowSecondColumn" data-offset-x="20" data-offset-y="73" data-expected-width="20" data-expected-height="40"></div>
<div class="secondRowFirstColumn" data-offset-x="0" data-offset-y="187" data-expected-width="20" data-expected-height="40"></div>
<div class="secondRowSecondColumn" data-offset-x="20" data-offset-y="187" data-expected-width="20" data-expected-height="40"></div>
</div>
</div>
<div style="position: relative">
<p>direction: LTR | align-content: 'stretch'</p>
<div class="grid stretchedGrid alignContentStretch" data-expected-width="200" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="20" data-expected-height="150"></div>
<div class="firstRowSecondColumn" data-offset-x="20" data-offset-y="0" data-expected-width="20" data-expected-height="150"></div>
<div class="secondRowFirstColumn" data-offset-x="0" data-offset-y="150" data-expected-width="20" data-expected-height="150"></div>
<div class="secondRowSecondColumn" data-offset-x="20" data-offset-y="150" data-expected-width="20" data-expected-height="150"></div>
</div>
</div>
<div style="position: relative">
<p>direction: LTR | align-content: 'space-between'</p>
<div class="grid alignContentSpaceBetween" data-expected-width="200" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="20" data-expected-height="40"></div>
<div class="firstRowSecondColumn" data-offset-x="20" data-offset-y="0" data-expected-width="20" data-expected-height="40"></div>
<div class="secondRowFirstColumn" data-offset-x="0" data-offset-y="130" data-expected-width="20" data-expected-height="40"></div>
<div class="secondRowSecondColumn" data-offset-x="20" data-offset-y="130" data-expected-width="20" data-expected-height="40"></div>
<div class="thirdRowFirstColumn" data-offset-x="0" data-offset-y="260" data-expected-width="20" data-expected-height="40"></div>
<div class="thirdRowSecondColumn" data-offset-x="20" data-offset-y="260" data-expected-width="20" data-expected-height="40"></div>
</div>
</div>
<div style="position: relative">
<p>direction: LTR | align-content: 'space-around'</p>
<div class="grid alignContentSpaceAround" data-expected-width="200" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="0" data-offset-y="30" data-expected-width="20" data-expected-height="40"></div>
<div class="firstRowSecondColumn" data-offset-x="20" data-offset-y="30" data-expected-width="20" data-expected-height="40"></div>
<div class="secondRowFirstColumn" data-offset-x="0" data-offset-y="130" data-expected-width="20" data-expected-height="40"></div>
<div class="secondRowSecondColumn" data-offset-x="20" data-offset-y="130" data-expected-width="20" data-expected-height="40"></div>
<div class="thirdRowFirstColumn" data-offset-x="0" data-offset-y="230" data-expected-width="20" data-expected-height="40"></div>
<div class="thirdRowSecondColumn" data-offset-x="20" data-offset-y="230" data-expected-width="20" data-expected-height="40"></div>
</div>
</div>
<div style="position: relative">
<p>direction: LTR | align-content: 'space-evenly'</p>
<div class="grid alignContentSpaceEvenly" data-expected-width="200" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="0" data-offset-y="45" data-expected-width="20" data-expected-height="40"></div>
<div class="firstRowSecondColumn" data-offset-x="20" data-offset-y="45" data-expected-width="20" data-expected-height="40"></div>
<div class="secondRowFirstColumn" data-offset-x="0" data-offset-y="130" data-expected-width="20" data-expected-height="40"></div>
<div class="secondRowSecondColumn" data-offset-x="20" data-offset-y="130" data-expected-width="20" data-expected-height="40"></div>
<div class="thirdRowFirstColumn" data-offset-x="0" data-offset-y="215" data-expected-width="20" data-expected-height="40"></div>
<div class="thirdRowSecondColumn" data-offset-x="20" data-offset-y="215" data-expected-width="20" data-expected-height="40"></div>
</div>
</div>
<div style="position: relative">
<p>direction: LTR | align-content: 'stretch'</p>
<div class="grid stretchedGrid alignContentStretch" data-expected-width="200" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="20" data-expected-height="100"></div>
<div class="firstRowSecondColumn" data-offset-x="20" data-offset-y="0" data-expected-width="20" data-expected-height="100"></div>
<div class="secondRowFirstColumn" data-offset-x="0" data-offset-y="100" data-expected-width="20" data-expected-height="100"></div>
<div class="secondRowSecondColumn" data-offset-x="20" data-offset-y="100" data-expected-width="20" data-expected-height="100"></div>
<div class="thirdRowFirstColumn" data-offset-x="0" data-offset-y="200" data-expected-width="20" data-expected-height="100"></div>
<div class="thirdRowSecondColumn" data-offset-x="20" data-offset-y="200" data-expected-width="20" data-expected-height="100"></div>
</div>
</div>
<div style="position: relative">
<p>direction: LTR | align-content: 'space-between'</p>
<div class="grid alignContentSpaceBetween" data-expected-width="200" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="20" data-expected-height="40"></div>
<div class="firstRowSecondColumn" data-offset-x="20" data-offset-y="0" data-expected-width="20" data-expected-height="40"></div>
<div class="secondRowFirstColumn" data-offset-x="0" data-offset-y="87" data-expected-width="20" data-expected-height="40"></div>
<div class="secondRowSecondColumn" data-offset-x="20" data-offset-y="87" data-expected-width="20" data-expected-height="40"></div>
<div class="thirdRowFirstColumn" data-offset-x="0" data-offset-y="173" data-expected-width="20" data-expected-height="40"></div>
<div class="thirdRowSecondColumn" data-offset-x="20" data-offset-y="173" data-expected-width="20" data-expected-height="40"></div>
<div class="fourthRowFirstColumn" data-offset-x="0" data-offset-y="260" data-expected-width="20" data-expected-height="40"></div>
<div class="fourthRowSecondColumn" data-offset-x="20" data-offset-y="260" data-expected-width="20" data-expected-height="40"></div>
</div>
</div>
<div style="position: relative">
<p>direction: LTR | align-content: 'space-around'</p>
<div class="grid alignContentSpaceAround" data-expected-width="200" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="0" data-offset-y="18" data-expected-width="20" data-expected-height="40"></div>
<div class="firstRowSecondColumn" data-offset-x="20" data-offset-y="18" data-expected-width="20" data-expected-height="40"></div>
<div class="secondRowFirstColumn" data-offset-x="0" data-offset-y="93" data-expected-width="20" data-expected-height="40"></div>
<div class="secondRowSecondColumn" data-offset-x="20" data-offset-y="93" data-expected-width="20" data-expected-height="40"></div>
<div class="thirdRowFirstColumn" data-offset-x="0" data-offset-y="168" data-expected-width="20" data-expected-height="40"></div>
<div class="thirdRowSecondColumn" data-offset-x="20" data-offset-y="168" data-expected-width="20" data-expected-height="40"></div>
<div class="fourthRowFirstColumn" data-offset-x="0" data-offset-y="243" data-expected-width="20" data-expected-height="40"></div>
<div class="fourthRowSecondColumn" data-offset-x="20" data-offset-y="243" data-expected-width="20" data-expected-height="40"></div>
</div>
</div>
<div style="position: relative">
<p>direction: LTR | align-content: 'space-evenly'</p>
<div class="grid alignContentSpaceEvenly" data-expected-width="200" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="0" data-offset-y="28" data-expected-width="20" data-expected-height="40"></div>
<div class="firstRowSecondColumn" data-offset-x="20" data-offset-y="28" data-expected-width="20" data-expected-height="40"></div>
<div class="secondRowFirstColumn" data-offset-x="0" data-offset-y="96" data-expected-width="20" data-expected-height="40"></div>
<div class="secondRowSecondColumn" data-offset-x="20" data-offset-y="96" data-expected-width="20" data-expected-height="40"></div>
<div class="thirdRowFirstColumn" data-offset-x="0" data-offset-y="164" data-expected-width="20" data-expected-height="40"></div>
<div class="thirdRowSecondColumn" data-offset-x="20" data-offset-y="164" data-expected-width="20" data-expected-height="40"></div>
<div class="fourthRowFirstColumn" data-offset-x="0" data-offset-y="232" data-expected-width="20" data-expected-height="40"></div>
<div class="fourthRowSecondColumn" data-offset-x="20" data-offset-y="232" data-expected-width="20" data-expected-height="40"></div>
</div>
</div>
<div style="position: relative">
<p>direction: LTR | align-content: 'stretch'</p>
<div class="grid stretchedGrid alignContentStretch" data-expected-width="200" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="0" data-offset-y="0" data-expected-width="20" data-expected-height="75"></div>
<div class="firstRowSecondColumn" data-offset-x="20" data-offset-y="0" data-expected-width="20" data-expected-height="75"></div>
<div class="secondRowFirstColumn" data-offset-x="0" data-offset-y="75" data-expected-width="20" data-expected-height="75"></div>
<div class="secondRowSecondColumn" data-offset-x="20" data-offset-y="75" data-expected-width="20" data-expected-height="75"></div>
<div class="thirdRowFirstColumn" data-offset-x="0" data-offset-y="150" data-expected-width="20" data-expected-height="75"></div>
<div class="thirdRowSecondColumn" data-offset-x="20" data-offset-y="150" data-expected-width="20" data-expected-height="75"></div>
<div class="fourthRowFirstColumn" data-offset-x="0" data-offset-y="225" data-expected-width="20" data-expected-height="75"></div>
<div class="fourthRowSecondColumn" data-offset-x="20" data-offset-y="225" data-expected-width="20" data-expected-height="75"></div>
</div>
</div>
<!-- RTL direction. -->
<div style="position: relative">
<p>direction: RTL | align-content: 'space-between'</p>
<div class="grid alignContentSpaceBetween directionRTL" data-expected-width="200" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="180" data-offset-y="0" data-expected-width="20" data-expected-height="40"></div>
<div class="firstRowSecondColumn" data-offset-x="160" data-offset-y="0" data-expected-width="20" data-expected-height="40"></div>
<div class="secondRowFirstColumn" data-offset-x="180" data-offset-y="260" data-expected-width="20" data-expected-height="40"></div>
<div class="secondRowSecondColumn" data-offset-x="160" data-offset-y="260" data-expected-width="20" data-expected-height="40"></div>
</div>
</div>
<div style="position: relative">
<p>direction: RTL | align-content: 'space-around'</p>
<div class="grid alignContentSpaceAround directionRTL" data-expected-width="200" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="180" data-offset-y="55" data-expected-width="20" data-expected-height="40"></div>
<div class="firstRowSecondColumn" data-offset-x="160" data-offset-y="55" data-expected-width="20" data-expected-height="40"></div>
<div class="secondRowFirstColumn" data-offset-x="180" data-offset-y="205" data-expected-width="20" data-expected-height="40"></div>
<div class="secondRowSecondColumn" data-offset-x="160" data-offset-y="205" data-expected-width="20" data-expected-height="40"></div>
</div>
</div>
<div style="position: relative">
<p>direction: RTL | align-content: 'space-evenly'</p>
<div class="grid alignContentSpaceEvenly directionRTL" data-expected-width="200" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="180" data-offset-y="73" data-expected-width="20" data-expected-height="40"></div>
<div class="firstRowSecondColumn" data-offset-x="160" data-offset-y="73" data-expected-width="20" data-expected-height="40"></div>
<div class="secondRowFirstColumn" data-offset-x="180" data-offset-y="187" data-expected-width="20" data-expected-height="40"></div>
<div class="secondRowSecondColumn" data-offset-x="160" data-offset-y="187" data-expected-width="20" data-expected-height="40"></div>
</div>
</div>
<div style="position: relative">
<p>direction: RTL | align-content: 'stretch'</p>
<div class="grid stretchedGrid alignContentStretch directionRTL" data-expected-width="200" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="180" data-offset-y="0" data-expected-width="20" data-expected-height="150"></div>
<div class="firstRowSecondColumn" data-offset-x="160" data-offset-y="0" data-expected-width="20" data-expected-height="150"></div>
<div class="secondRowFirstColumn" data-offset-x="180" data-offset-y="150" data-expected-width="20" data-expected-height="150"></div>
<div class="secondRowSecondColumn" data-offset-x="160" data-offset-y="150" data-expected-width="20" data-expected-height="150"></div>
</div>
</div>
<div style="position: relative">
<p>direction: RTL | align-content: 'space-between'</p>
<div class="grid alignContentSpaceBetween directionRTL" data-expected-width="200" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="180" data-offset-y="0" data-expected-width="20" data-expected-height="40"></div>
<div class="firstRowSecondColumn" data-offset-x="160" data-offset-y="0" data-expected-width="20" data-expected-height="40"></div>
<div class="secondRowFirstColumn" data-offset-x="180" data-offset-y="130" data-expected-width="20" data-expected-height="40"></div>
<div class="secondRowSecondColumn" data-offset-x="160" data-offset-y="130" data-expected-width="20" data-expected-height="40"></div>
<div class="thirdRowFirstColumn" data-offset-x="180" data-offset-y="260" data-expected-width="20" data-expected-height="40"></div>
<div class="thirdRowSecondColumn" data-offset-x="160" data-offset-y="260" data-expected-width="20" data-expected-height="40"></div>
</div>
</div>
<div style="position: relative">
<p>direction: RTL | align-content: 'space-around'</p>
<div class="grid alignContentSpaceAround directionRTL" data-expected-width="200" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="180" data-offset-y="30" data-expected-width="20" data-expected-height="40"></div>
<div class="firstRowSecondColumn" data-offset-x="160" data-offset-y="30" data-expected-width="20" data-expected-height="40"></div>
<div class="secondRowFirstColumn" data-offset-x="180" data-offset-y="130" data-expected-width="20" data-expected-height="40"></div>
<div class="secondRowSecondColumn" data-offset-x="160" data-offset-y="130" data-expected-width="20" data-expected-height="40"></div>
<div class="thirdRowFirstColumn" data-offset-x="180" data-offset-y="230" data-expected-width="20" data-expected-height="40"></div>
<div class="thirdRowSecondColumn" data-offset-x="160" data-offset-y="230" data-expected-width="20" data-expected-height="40"></div>
</div>
</div>
<div style="position: relative">
<p>direction: RTL | align-content: 'space-evenly'</p>
<div class="grid alignContentSpaceEvenly directionRTL" data-expected-width="200" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="180" data-offset-y="45" data-expected-width="20" data-expected-height="40"></div>
<div class="firstRowSecondColumn" data-offset-x="160" data-offset-y="45" data-expected-width="20" data-expected-height="40"></div>
<div class="secondRowFirstColumn" data-offset-x="180" data-offset-y="130" data-expected-width="20" data-expected-height="40"></div>
<div class="secondRowSecondColumn" data-offset-x="160" data-offset-y="130" data-expected-width="20" data-expected-height="40"></div>
<div class="thirdRowFirstColumn" data-offset-x="180" data-offset-y="215" data-expected-width="20" data-expected-height="40"></div>
<div class="thirdRowSecondColumn" data-offset-x="160" data-offset-y="215" data-expected-width="20" data-expected-height="40"></div>
</div>
</div>
<div style="position: relative">
<p>direction: RTL | align-content: 'stretch'</p>
<div class="grid stretchedGrid alignContentStretch directionRTL" data-expected-width="200" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="180" data-offset-y="0" data-expected-width="20" data-expected-height="100"></div>
<div class="firstRowSecondColumn" data-offset-x="160" data-offset-y="0" data-expected-width="20" data-expected-height="100"></div>
<div class="secondRowFirstColumn" data-offset-x="180" data-offset-y="100" data-expected-width="20" data-expected-height="100"></div>
<div class="secondRowSecondColumn" data-offset-x="160" data-offset-y="100" data-expected-width="20" data-expected-height="100"></div>
<div class="thirdRowFirstColumn" data-offset-x="180" data-offset-y="200" data-expected-width="20" data-expected-height="100"></div>
<div class="thirdRowSecondColumn" data-offset-x="160" data-offset-y="200" data-expected-width="20" data-expected-height="100"></div>
</div>
</div>
<div style="position: relative">
<p>direction: RTL | align-content: 'space-between'</p>
<div class="grid alignContentSpaceBetween directionRTL" data-expected-width="200" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="180" data-offset-y="0" data-expected-width="20" data-expected-height="40"></div>
<div class="firstRowSecondColumn" data-offset-x="160" data-offset-y="0" data-expected-width="20" data-expected-height="40"></div>
<div class="secondRowFirstColumn" data-offset-x="180" data-offset-y="87" data-expected-width="20" data-expected-height="40"></div>
<div class="secondRowSecondColumn" data-offset-x="160" data-offset-y="87" data-expected-width="20" data-expected-height="40"></div>
<div class="thirdRowFirstColumn" data-offset-x="180" data-offset-y="173" data-expected-width="20" data-expected-height="40"></div>
<div class="thirdRowSecondColumn" data-offset-x="160" data-offset-y="173" data-expected-width="20" data-expected-height="40"></div>
<div class="fourthRowFirstColumn" data-offset-x="180" data-offset-y="260" data-expected-width="20" data-expected-height="40"></div>
<div class="fourthRowSecondColumn" data-offset-x="160" data-offset-y="260" data-expected-width="20" data-expected-height="40"></div>
</div>
</div>
<div style="position: relative">
<p>direction: RTL | align-content: 'space-around'</p>
<div class="grid alignContentSpaceAround directionRTL" data-expected-width="200" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="180" data-offset-y="18" data-expected-width="20" data-expected-height="40"></div>
<div class="firstRowSecondColumn" data-offset-x="160" data-offset-y="18" data-expected-width="20" data-expected-height="40"></div>
<div class="secondRowFirstColumn" data-offset-x="180" data-offset-y="93" data-expected-width="20" data-expected-height="40"></div>
<div class="secondRowSecondColumn" data-offset-x="160" data-offset-y="93" data-expected-width="20" data-expected-height="40"></div>
<div class="thirdRowFirstColumn" data-offset-x="180" data-offset-y="168" data-expected-width="20" data-expected-height="40"></div>
<div class="thirdRowSecondColumn" data-offset-x="160" data-offset-y="168" data-expected-width="20" data-expected-height="40"></div>
<div class="fourthRowFirstColumn" data-offset-x="180" data-offset-y="243" data-expected-width="20" data-expected-height="40"></div>
<div class="fourthRowSecondColumn" data-offset-x="160" data-offset-y="243" data-expected-width="20" data-expected-height="40"></div>
</div>
</div>
<div style="position: relative">
<p>direction: RTL | align-content: 'space-evenly'</p>
<div class="grid alignContentSpaceEvenly directionRTL" data-expected-width="200" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="180" data-offset-y="28" data-expected-width="20" data-expected-height="40"></div>
<div class="firstRowSecondColumn" data-offset-x="160" data-offset-y="28" data-expected-width="20" data-expected-height="40"></div>
<div class="secondRowFirstColumn" data-offset-x="180" data-offset-y="96" data-expected-width="20" data-expected-height="40"></div>
<div class="secondRowSecondColumn" data-offset-x="160" data-offset-y="96" data-expected-width="20" data-expected-height="40"></div>
<div class="thirdRowFirstColumn" data-offset-x="180" data-offset-y="164" data-expected-width="20" data-expected-height="40"></div>
<div class="thirdRowSecondColumn" data-offset-x="160" data-offset-y="164" data-expected-width="20" data-expected-height="40"></div>
<div class="fourthRowFirstColumn" data-offset-x="180" data-offset-y="232" data-expected-width="20" data-expected-height="40"></div>
<div class="fourthRowSecondColumn" data-offset-x="160" data-offset-y="232" data-expected-width="20" data-expected-height="40"></div>
</div>
</div>
<div style="position: relative">
<p>direction: RTL | align-content: 'stretch'</p>
<div class="grid stretchedGrid alignContentStretch directionRTL" data-expected-width="200" data-expected-height="300">
<div class="firstRowFirstColumn" data-offset-x="180" data-offset-y="0" data-expected-width="20" data-expected-height="75"></div>
<div class="firstRowSecondColumn" data-offset-x="160" data-offset-y="0" data-expected-width="20" data-expected-height="75"></div>
<div class="secondRowFirstColumn" data-offset-x="180" data-offset-y="75" data-expected-width="20" data-expected-height="75"></div>
<div class="secondRowSecondColumn" data-offset-x="160" data-offset-y="75" data-expected-width="20" data-expected-height="75"></div>
<div class="thirdRowFirstColumn" data-offset-x="180" data-offset-y="150" data-expected-width="20" data-expected-height="75"></div>
<div class="thirdRowSecondColumn" data-offset-x="160" data-offset-y="150" data-expected-width="20" data-expected-height="75"></div>
<div class="fourthRowFirstColumn" data-offset-x="180" data-offset-y="225" data-expected-width="20" data-expected-height="75"></div>
<div class="fourthRowSecondColumn" data-offset-x="160" data-offset-y="225" data-expected-width="20" data-expected-height="75"></div>
</div>
</div>
</body>

158
tests/wpt/web-platform-tests/css/css-images/animations/object-position-interpolation.html
View file

@ -1,158 +0,0 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>object-position-interpolation</title>
<link rel="help" href="https://drafts.csswg.org/css-images-3/#the-object-position">
<meta name="assert" content="object-position supports animation by computation">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/interpolation-testcommon.js"></script>
<style>
.parent {
object-position: 30px 10px;
}
.target {
position: relative;
width: 100px;
height: 100px;
background-color: black;
display: inline-block;
margin: 20px 0px 20px 0px;
object-fit: fill;
object-position: 10px 30px;
}
.expected {
background-color: green;
}
</style>
<body>
</body>
<script>
test_interpolation({
property: 'object-position',
from: neutralKeyframe,
to: '20px 20px',
}, [
{at: -0.3, expect: '7px 33px'},
{at: 0, expect: '10px 30px'},
{at: 0.5, expect: '15px 25px'},
{at: 1, expect: '20px 20px'},
{at: 1.5, expect: '25px 15px'},
]);
test_interpolation({
property: 'object-position',
from: 'initial',
to: '20px 20px',
}, [
{at: -0.3, expect: 'calc(-6px + 65%) calc(-6px + 65%)'},
{at: 0, expect: '50% 50%'},
{at: 0.5, expect: 'calc(10px + 25%) calc(10px + 25%)'},
{at: 1, expect: 'calc(20px + 0%) calc(20px + 0%)'},
{at: 1.5, expect: 'calc(30px + -25%) calc(30px + -25%)'},
]);
test_interpolation({
property: 'object-position',
from: 'inherit',
to: '20px 20px',
}, [
{at: -0.3, expect: '33px 7px'},
{at: 0, expect: '30px 10px'},
{at: 0.5, expect: '25px 15px'},
{at: 1, expect: '20px 20px'},
{at: 1.5, expect: '15px 25px'},
]);
test_interpolation({
property: 'object-position',
from: 'unset',
to: '20px 20px',
}, [
{at: -0.3, expect: 'calc(-6px + 65%) calc(-6px + 65%)'},
{at: 0, expect: '50% 50%'},
{at: 0.5, expect: 'calc(10px + 25%) calc(10px + 25%)'},
{at: 1, expect: 'calc(20px + 0%) calc(20px + 0%)'},
{at: 1.5, expect: 'calc(30px + -25%) calc(30px + -25%)'},
]);
test_interpolation({
property: 'object-position',
from: '50% 50%',
to: '100% 100%'
}, [
{at: -0.3, expect: '35% 35%'},
{at: 0, expect: '50% 50%'},
{at: 0.5, expect: '75% 75%'},
{at: 1, expect: '100% 100%'},
{at: 1.5, expect: '125% 125%'}
]);
test_interpolation({
property: 'object-position',
from: '100px 200px',
to: '0px 0px'
}, [
{at: -0.3, expect: '130px 260px'},
{at: 0, expect: '100px 200px'},
{at: 0.5, expect: '50px 100px'},
{at: 1, expect: '0px 0px'},
{at: 1.5, expect: '-50px -100px'}
]);
// Zero seem to be a special case in the old implementation
test_interpolation({
property: 'object-position',
from: '50% 100%',
to: '0px 0px'
}, [
{at: -0.3, expect: '65% 130%'},
{at: 0, expect: '50% 100%'},
{at: 0.5, expect: '25% 50%'},
{at: 1, expect: '0px 0px'},
{at: 1.5, expect: '-25% -50%'}
]);
test_interpolation({
property: 'object-position',
from: '50% 100%',
to: '50px 100px'
}, [
{at: -0.3, expect: 'calc(65% + -15px) calc(130% + -30px)'},
{at: 0, expect: '50% 100%'},
{at: 0.5, expect: 'calc(25% + 25px) calc(50% + 50px)'},
{at: 1, expect: 'calc(0% + 50px) calc(0% + 100px)'},
{at: 1.5, expect: 'calc(-25% + 75px) calc(-50% + 150px)'}
]);
test_interpolation({
property: 'object-position',
from: 'center',
to: 'top right'
}, [
{at: -0.3, expect: '35% 65%'},
{at: 0, expect: '50% 50%'},
{at: 0.5, expect: '75% 25%'},
{at: 1, expect: '100% 0%'},
{at: 1.5, expect: '125% -25%'}
]);
test_interpolation({
property: 'object-position',
from: 'center',
to: 'right 0% bottom 50%',
}, [
{at: -0.5, expect: '25% 50%'},
{at: 0, expect: 'center'},
{at: 0.3, expect: '65% 50%'},
{at: 0.5, expect: '75% 50%'},
{at: 0.9, expect: '95% 50%'},
{at: 1, expect: '100% 50%'},
{at: 1.5, expect: '125% 50%'},
{at: 2, expect: '150% 50%'},
]);
</script>

189
tests/wpt/web-platform-tests/css/css-masking/animations/clip-path-composition.html Normal file
View file

@ -0,0 +1,189 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>clip-path composition</title>
<link rel="help" href="https://drafts.fxtf.org/css-masking-1/#the-clip-path">
<meta name="assert" content="clip-path supports animation">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/interpolation-testcommon.js"></script>
<body>
<script>
test_composition({
property: 'clip-path',
underlying: 'circle(100px at 25px 25%)',
addFrom: 'circle(10px at 25px 75%)',
addTo: 'circle(50px at 50px center)',
}, [
{at: -0.3, expect: 'circle(98px at 42.5px 107.5%)'},
{at: 0, expect: 'circle(110px at 50px 100%)'},
{at: 0.3, expect: 'circle(122px at 57.5px 92.5%)'},
{at: 0.6, expect: 'circle(134px at 65px 85%)'},
{at: 1, expect: 'circle(150px at 75px 75%)'},
{at: 1.5, expect: 'circle(170px at 87.5px 62.5%)'},
]);
test_composition({
property: 'clip-path',
underlying: 'circle(100px at 20px 20%)',
addFrom: 'circle(50px at 50px 50%)',
replaceTo: 'circle(50% at 150px 150%)',
}, [
{at: -0.3, expect: 'circle(calc(195px + -15%) at 46px 46%)'},
{at: 0, expect: 'circle(calc(150px + 0%) at 70px 70%)'},
{at: 0.3, expect: 'circle(calc(105px + 15%) at 94px 94%)'},
{at: 0.6, expect: 'circle(calc(60px + 30%) at 118px 118%)'},
{at: 1, expect: 'circle(50% at 150px 150%)'},
{at: 1.5, expect: 'circle(calc(-75px + 75%) at 190px 190%)'},
]);
test_composition({
property: 'clip-path',
underlying: 'circle(farthest-side at 25px 75%)',
addFrom: 'circle(farthest-side at 25px 75%)',
addTo: 'circle(farthest-side at 50px center)',
}, [
{at: 0.25, expect: 'circle(farthest-side at 25px 75%)'},
{at: 0.75, expect: 'circle(farthest-side at 50px 50%)'},
]);
test_composition({
property: 'clip-path',
underlying: 'circle(50px at 10px 20px)',
addFrom: 'circle(50px at 10px 20px)',
addTo: 'circle(farthest-side at 30px 40px)',
}, [
{at: 0.25, expect: 'circle(100px at 20px 40px)'},
{at: 0.75, expect: 'circle(farthest-side at 30px 40px)'},
]);
test_composition({
property: 'clip-path',
underlying: 'ellipse(10px 20px at 30px 40px)',
addFrom: 'ellipse(40px 30px at 20px 10px)',
addTo: 'ellipse(140px 130px at 120px 110px)',
}, [
{at: -0.3, expect: 'ellipse(20px 20px at 20px 20px)'},
{at: 0, expect: 'ellipse(50px 50px at 50px 50px)'},
{at: 0.3, expect: 'ellipse(80px 80px at 80px 80px)'},
{at: 0.6, expect: 'ellipse(110px 110px at 110px 110px)'},
{at: 1, expect: 'ellipse(150px 150px at 150px 150px)'},
{at: 1.5, expect: 'ellipse(200px 200px at 200px 200px)'},
]);
test_composition({
property: 'clip-path',
underlying: 'ellipse(10px 20px at 30px 40px)',
replaceFrom: 'ellipse(40px 30px at 20px 10px)',
addTo: 'ellipse(40px 30px at 20px 10px)',
}, [
{at: -0.3, expect: 'ellipse(37px 24px at 11px -2px)'},
{at: 0, expect: 'ellipse(40px 30px at 20px 10px)'},
{at: 0.3, expect: 'ellipse(43px 36px at 29px 22px)'},
{at: 0.6, expect: 'ellipse(46px 42px at 38px 34px)'},
{at: 1, expect: 'ellipse(50px 50px at 50px 50px)'},
{at: 1.5, expect: 'ellipse(55px 60px at 65px 70px)'},
]);
test_composition({
property: 'clip-path',
underlying: 'ellipse(25px 75%)',
addFrom: 'ellipse()',
addTo: 'ellipse(closest-side farthest-side)',
}, [
{at: 0.25, expect: 'ellipse(at 50% 50%)'},
{at: 0.75, expect: 'ellipse(closest-side farthest-side at 50% 50%)'},
]);
test_composition({
property: 'clip-path',
underlying: 'inset(20px)',
addFrom: 'inset(20px)',
addTo: 'inset(40%)',
}, [
{at: -0.3, expect: 'inset(calc(46px + -12%))'},
{at: 0, expect: 'inset(calc(40px + 0%))'},
{at: 0.3, expect: 'inset(calc(34px + 12%))'},
{at: 0.6, expect: 'inset(calc(28px + 24%))'},
{at: 1, expect: 'inset(calc(20px + 40%))'},
{at: 1.5, expect: 'inset(calc(10px + 60%))'},
]);
test_composition({
property: 'clip-path',
underlying: 'inset(1px 2px 3px 4px round 10px 20px 30px 40px / 50px 60px 70px 80px)',
addFrom: 'inset(1px 2px 3px 4px round 10px 20px 30px 40px / 50px 60px 70px 80px)',
replaceTo: 'inset(102px 104px 106px 108px round 120px 140px 160px 180px / 200px 220px 240px 260px)',
}, [
{at: -0.3, expect: 'inset(-28px -26px -24px -22px round 0px 10px 30px 50px / 70px 90px 110px 130px)'},
{at: 0, expect: 'inset(2px 4px 6px 8px round 20px 40px 60px 80px / 100px 120px 140px 160px)'},
{at: 0.25, expect: 'inset(27px 29px 31px 33px round 45px 65px 85px 105px / 125px 145px 165px 185px)'},
{at: 0.75, expect: 'inset(77px 79px 81px 83px round 95px 115px 135px 155px / 175px 195px 215px 235px)'},
{at: 1, expect: 'inset(102px 104px 106px 108px round 120px 140px 160px 180px / 200px 220px 240px 260px)'},
{at: 1.5, expect: 'inset(152px 154px 156px 158px round 170px 190px 210px 230px / 250px 270px 290px 310px)'},
]);
test_composition({
property: 'clip-path',
underlying: 'inset(1px 2px round 100px 200px)',
addFrom: 'inset(1px 2px round 100px 200px)',
addTo: 'inset(101px 102px 101px 102px)',
}, [
{at: -0.3, expect: 'inset(-28px -26px round 230px 460px)'},
{at: 0, expect: 'inset(2px 4px round 200px 400px)'},
{at: 0.3, expect: 'inset(32px 34px round 170px 340px)'},
{at: 0.6, expect: 'inset(62px 64px round 140px 280px)'},
{at: 1, expect: 'inset(102px 104px round 100px 200px)'},
{at: 1.5, expect: 'inset(152px 154px round 50px 100px)'},
]);
test_composition({
property: 'clip-path',
underlying: 'polygon(10px 20%, 30px 40%)',
addFrom: 'polygon(10px 20%, 30px 40%)',
addTo: 'polygon(110px 120%, 130px 140%)',
}, [
{at: -0.3, expect: 'polygon(-10px 10%, 30px 50%)'},
{at: 0, expect: 'polygon(20px 40%, 60px 80%)'},
{at: 0.3, expect: 'polygon(50px 70%, 90px 110%)'},
{at: 0.6, expect: 'polygon(80px 100%, 120px 140%)'},
{at: 1, expect: 'polygon(120px 140%, 160px 180%)'},
{at: 1.5, expect: 'polygon(170px 190%, 210px 230%)'},
]);
test_composition({
property: 'clip-path',
underlying: 'polygon(evenodd, 10px 20px)',
addFrom: 'polygon(evenodd, 10px 20px)',
addTo: 'polygon(evenodd, 110px 120px)',
}, [
{at: -0.3, expect: 'polygon(evenodd, -10px 10px)'},
{at: 0, expect: 'polygon(evenodd, 20px 40px)'},
{at: 0.3, expect: 'polygon(evenodd, 50px 70px)'},
{at: 0.6, expect: 'polygon(evenodd, 80px 100px)'},
{at: 1, expect: 'polygon(evenodd, 120px 140px)'},
{at: 1.5, expect: 'polygon(evenodd, 170px 190px)'},
]);
test_composition({
property: 'clip-path',
underlying: 'polygon(evenodd, 10px 20px)',
addFrom: 'polygon(evenodd, 10px 20px)',
addTo: 'polygon(nonzero, 30px 40px)',
}, [
{at: 0.25, expect: 'polygon(evenodd, 20px 40px)'},
{at: 0.75, expect: 'polygon(30px 40px)'},
]);
test_composition({
property: 'clip-path',
underlying: 'polygon(10px 20px, 30px 40px)',
addFrom: 'polygon(10px 20px, 30px 40px)',
addTo: 'polygon(30px 40px)',
}, [
{at: 0.25, expect: 'polygon(20px 40px, 60px 80px)'},
{at: 0.75, expect: 'polygon(30px 40px)'},
]);
</script>
</body>

78
tests/wpt/web-platform-tests/css/css-position/animations/bottom-composition.html Normal file
View file

@ -0,0 +1,78 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>bottom composition</title>
<link rel="help" href="https://drafts.csswg.org/css-position-3/#propdef-bottom">
<meta name="assert" content="bottom support animation">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/interpolation-testcommon.js"></script>
<body>
<script>
test_composition({
property: 'bottom',
underlying: '50px',
addFrom: '100px',
addTo: '200px',
}, [
{at: -0.3, expect: '120px'},
{at: 0, expect: '150px'},
{at: 0.5, expect: '200px'},
{at: 1, expect: '250px'},
{at: 1.5, expect: '300px'},
]);
test_composition({
property: 'bottom',
underlying: '100px',
addFrom: '10px',
addTo: '2px',
}, [
{at: -0.5, expect: '114px'},
{at: 0, expect: '110px'},
{at: 0.5, expect: '106px'},
{at: 1, expect: '102px'},
{at: 1.5, expect: '98px'},
]);
test_composition({
property: 'bottom',
underlying: '10%',
addFrom: '100px',
addTo: '20%',
}, [
{at: -0.3, expect: 'calc(130px + 4%)'},
{at: 0, expect: 'calc(100px + 10%)'},
{at: 0.5, expect: 'calc(50px + 20%)'},
{at: 1, expect: '30%'},
{at: 1.5, expect: 'calc(-50px + 40%)'},
]);
test_composition({
property: 'bottom',
underlying: '50px',
addFrom: '100px',
replaceTo: '200px',
}, [
{at: -0.3, expect: '135px'},
{at: 0, expect: '150px'},
{at: 0.5, expect: '175px'},
{at: 1, expect: '200px'},
{at: 1.5, expect: '225px'},
]);
test_composition({
property: 'bottom',
underlying: '100px',
addFrom: '100px',
addTo: 'auto',
}, [
{at: -0.3, expect: '200px'},
{at: 0, expect: '200px'},
{at: 0.5, expect: 'auto'},
{at: 1, expect: 'auto'},
{at: 1.5, expect: 'auto'},
]);
</script>
</body>

91
tests/wpt/web-platform-tests/css/css-position/animations/left-composition.html Normal file
View file

@ -0,0 +1,91 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>left composition</title>
<link rel="help" href="https://drafts.csswg.org/css-position-3/#propdef-left">
<meta name="assert" content="left support animation">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/interpolation-testcommon.js"></script>
<body>
<script>
test_composition({
property: 'left',
underlying: '50px',
addFrom: '100px',
addTo: '200px',
}, [
{at: -0.3, expect: '120px'},
{at: 0, expect: '150px'},
{at: 0.5, expect: '200px'},
{at: 1, expect: '250px'},
{at: 1.5, expect: '300px'},
]);
test_composition({
property: 'left',
underlying: '100px',
addFrom: '10px',
addTo: '2px',
}, [
{at: -0.5, expect: '114px'},
{at: 0, expect: '110px'},
{at: 0.5, expect: '106px'},
{at: 1, expect: '102px'},
{at: 1.5, expect: '98px'},
]);
test_composition({
property: 'left',
underlying: '10%',
addFrom: '100px',
addTo: '20%',
}, [
{at: -0.3, expect: 'calc(130px + 4%)'},
{at: 0, expect: 'calc(100px + 10%)'},
{at: 0.5, expect: 'calc(50px + 20%)'},
{at: 1, expect: '30%'},
{at: 1.5, expect: 'calc(-50px + 40%)'},
]);
test_composition({
property: 'left',
underlying: '10%',
addFrom: '100px',
addTo: '-10%',
}, [
{at: -0.3, expect: 'calc(130px + 13%)'},
{at: 0, expect: 'calc(100px + 10%)'},
{at: 0.5, expect: 'calc(50px + 5%)'},
{at: 1, expect: '0%'},
{at: 1.5, expect: 'calc(-50px - 5%)'},
]);
test_composition({
property: 'left',
underlying: '50px',
addFrom: '100px',
replaceTo: '200px',
}, [
{at: -0.3, expect: '135px'},
{at: 0, expect: '150px'},
{at: 0.5, expect: '175px'},
{at: 1, expect: '200px'},
{at: 1.5, expect: '225px'},
]);
test_composition({
property: 'left',
underlying: '100px',
addFrom: '100px',
addTo: 'auto',
}, [
{at: -0.3, expect: '200px'},
{at: 0, expect: '200px'},
{at: 0.5, expect: 'auto'},
{at: 1, expect: 'auto'},
{at: 1.5, expect: 'auto'},
]);
</script>
</body>

0
tests/wpt/web-platform-tests/css/css-position/animation/position-interpolation.html → tests/wpt/web-platform-tests/css/css-position/animations/position-interpolation.html
View file

78
tests/wpt/web-platform-tests/css/css-position/animations/right-composition.html Normal file
View file

@ -0,0 +1,78 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>right composition</title>
<link rel="help" href="https://drafts.csswg.org/css-position-3/#propdef-right">
<meta name="assert" content="right support animation">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/interpolation-testcommon.js"></script>
<body>
<script>
test_composition({
property: 'right',
underlying: '50px',
addFrom: '100px',
addTo: '200px',
}, [
{at: -0.3, expect: '120px'},
{at: 0, expect: '150px'},
{at: 0.5, expect: '200px'},
{at: 1, expect: '250px'},
{at: 1.5, expect: '300px'},
]);
test_composition({
property: 'right',
underlying: '100px',
addFrom: '10px',
addTo: '2px',
}, [
{at: -0.5, expect: '114px'},
{at: 0, expect: '110px'},
{at: 0.5, expect: '106px'},
{at: 1, expect: '102px'},
{at: 1.5, expect: '98px'},
]);
test_composition({
property: 'right',
underlying: '10%',
addFrom: '100px',
addTo: '20%',
}, [
{at: -0.3, expect: 'calc(130px + 4%)'},
{at: 0, expect: 'calc(100px + 10%)'},
{at: 0.5, expect: 'calc(50px + 20%)'},
{at: 1, expect: '30%'},
{at: 1.5, expect: 'calc(-50px + 40%)'},
]);
test_composition({
property: 'right',
underlying: '50px',
addFrom: '100px',
replaceTo: '200px',
}, [
{at: -0.3, expect: '135px'},
{at: 0, expect: '150px'},
{at: 0.5, expect: '175px'},
{at: 1, expect: '200px'},
{at: 1.5, expect: '225px'},
]);
test_composition({
property: 'right',
underlying: '100px',
addFrom: '100px',
addTo: 'auto',
}, [
{at: -0.3, expect: '200px'},
{at: 0, expect: '200px'},
{at: 0.5, expect: 'auto'},
{at: 1, expect: 'auto'},
{at: 1.5, expect: 'auto'},
]);
</script>
</body>

78
tests/wpt/web-platform-tests/css/css-position/animations/top-composition.html Normal file
View file

@ -0,0 +1,78 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>top composition</title>
<link rel="help" href="https://drafts.csswg.org/css-position-3/#propdef-top">
<meta name="assert" content="top support animation">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/interpolation-testcommon.js"></script>
<body>
<script>
test_composition({
property: 'top',
underlying: '50px',
addFrom: '100px',
addTo: '200px',
}, [
{at: -0.3, expect: '120px'},
{at: 0, expect: '150px'},
{at: 0.5, expect: '200px'},
{at: 1, expect: '250px'},
{at: 1.5, expect: '300px'},
]);
test_composition({
property: 'top',
underlying: '100px',
addFrom: '10px',
addTo: '2px',
}, [
{at: -0.5, expect: '114px'},
{at: 0, expect: '110px'},
{at: 0.5, expect: '106px'},
{at: 1, expect: '102px'},
{at: 1.5, expect: '98px'},
]);
test_composition({
property: 'top',
underlying: '10%',
addFrom: '100px',
addTo: '20%',
}, [
{at: -0.3, expect: 'calc(130px + 4%)'},
{at: 0, expect: 'calc(100px + 10%)'},
{at: 0.5, expect: 'calc(50px + 20%)'},
{at: 1, expect: '30%'},
{at: 1.5, expect: 'calc(-50px + 40%)'},
]);
test_composition({
property: 'top',
underlying: '50px',
addFrom: '100px',
replaceTo: '200px',
}, [
{at: -0.3, expect: '135px'},
{at: 0, expect: '150px'},
{at: 0.5, expect: '175px'},
{at: 1, expect: '200px'},
{at: 1.5, expect: '225px'},
]);
test_composition({
property: 'top',
underlying: '100px',
addFrom: '100px',
addTo: 'auto',
}, [
{at: -0.3, expect: '200px'},
{at: 0, expect: '200px'},
{at: 0.5, expect: 'auto'},
{at: 1, expect: 'auto'},
{at: 1.5, expect: 'auto'},
]);
</script>
</body>

121
tests/wpt/web-platform-tests/css/css-scroll-snap/snap-after-relayout/changing-scroll-snap-align.html Normal file
View file

@ -0,0 +1,121 @@
<!DOCTYPE html>
<title>
Updating the snap alignment of a snap container's content should make the snap
container resnap accordingly.
</title>
<link rel="help" href="https://drafts.csswg.org/css-scroll-snap/#re-snap" />
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<style>
div {
position: absolute;
margin: 0;
}
#scroller {
height: 200px;
width: 200px;
overflow: hidden;
scroll-snap-type: both mandatory;
}
#initial-target {
width: 300px;
height: 300px;
top: 100px;
left: 100px;
background-color: green;
scroll-snap-align: start;
}
#other-target {
width: 300px;
height: 300px;
top: 300px;
left: 300px;
background-color: red;
scroll-snap-align: start;
}
.area {
width: 2000px;
height: 2000px;
}
.snap-area {
scroll-snap-align: start !important;
}
</style>
<div id="scroller">
<div class="area"></div>
<div id="initial-target"></div>
<div id="other-target"></div>
</div>
<script>
const initial_target = document.getElementById("initial-target");
const other_target = document.getElementById("other-target");
const scroller = document.getElementById("scroller");
function cleanup() {
initial_target.style.setProperty("scroll-snap-align", "start");
other_target.style.setProperty("scroll-snap-align", "start");
initial_target.removeAttribute("class");
}
test(t => {
t.add_cleanup(cleanup);
scroller.scrollTo(0,0);
assert_equals(scroller.scrollTop, 100);
assert_equals(scroller.scrollLeft, 100);
initial_target.style.setProperty("scroll-snap-align", "end");
// target.top + target.height - scroller.height
assert_equals(scroller.scrollTop, 200);
assert_equals(scroller.scrollLeft, 200);
}, "Changing the current target's snap alignment should make the scroller"
+ " resnap to it even if another snap position is closer to the current offset");
test(t => {
t.add_cleanup(cleanup);
scroller.scrollTo(0,0);
assert_equals(scroller.scrollTop, 100);
assert_equals(scroller.scrollLeft, 100);
initial_target.style.setProperty("scroll-snap-align", "none");
assert_equals(scroller.scrollTop, 300);
assert_equals(scroller.scrollLeft, 300);
}, "Removing the current target's snap alignment should make the scroller"
+ " resnap to a new snap area.");
test(t => {
t.add_cleanup(cleanup);
initial_target.style.setProperty("scroll-snap-align", "none");
other_target.style.setProperty("scroll-snap-align", "none");
scroller.scrollTo(0,0);
assert_equals(scroller.scrollTop, 0);
assert_equals(scroller.scrollLeft, 0);
initial_target.style.setProperty("scroll-snap-align", "start");
assert_equals(scroller.scrollTop, 100);
assert_equals(scroller.scrollLeft, 100);
}, "Changing an element snap alignment from none to start should make the"
+ "scroller resnap.");
test(t => {
t.add_cleanup(cleanup);
initial_target.style.setProperty("scroll-snap-align", "none");
other_target.style.setProperty("scroll-snap-align", "none");
scroller.scrollTo(0,0);
assert_equals(scroller.scrollTop, 0);
assert_equals(scroller.scrollLeft, 0);
initial_target.classList.add("snap-area");
assert_equals(scroller.scrollTop, 100);
assert_equals(scroller.scrollLeft, 100);
}, "Changing an element snap alignment from none to start by adding a class"
+ " should make the scroller resnap.");
</script>

96
tests/wpt/web-platform-tests/css/css-scroll-snap/snap-after-relayout/changing-scroll-snap-type.html Normal file
View file

@ -0,0 +1,96 @@
<!DOCTYPE html>
<title>
Updating the scroll-snap-type of a snap container should make it resnap accordingly.
</title>
<link rel="help" href="https://drafts.csswg.org/css-scroll-snap/#re-snap" />
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<style>
div {
position: absolute;
margin: 0;
}
#scroller {
height: 500px;
width: 500px;
overflow: hidden;
scroll-snap-type: none;
}
#y-target {
width: 300px;
height: 300px;
top: 100px;
left: 0;
background-color: green;
scroll-snap-align: start none;
}
#x-target {
width: 300px;
height: 300px;
top: 0;
left: 100px;
background-color: red;
scroll-snap-align: none start;
}
.area {
width: 2000px;
height: 2000px;
}
</style>
<div id="scroller">
<div class="area"></div>
<div id="x-target"></div>
<div id="y-target"></div>
</div>
<script>
const x_target = document.getElementById("x_target");
const y_target = document.getElementById("y_target");
const scroller = document.getElementById("scroller");
function cleanup() {
scroller.style.setProperty("scroll-snap-type", "none");
}
test(t => {
t.add_cleanup(cleanup);
scroller.scrollTo(0,0);
assert_equals(scroller.scrollTop, 0);
assert_equals(scroller.scrollLeft, 0);
scroller.style.setProperty("scroll-snap-type", "y mandatory");
assert_equals(scroller.scrollTop, 100);
assert_equals(scroller.scrollLeft, 0);
}, "Changing the scroller's snap type to y should make it resnap on the y-axis.");
test(t => {
t.add_cleanup(cleanup);
scroller.scrollTo(0,0);
assert_equals(scroller.scrollTop, 0);
assert_equals(scroller.scrollLeft, 0);
scroller.style.setProperty("scroll-snap-type", "x mandatory");
assert_equals(scroller.scrollLeft, 100);
assert_equals(scroller.scrollTop, 0);
}, "Changing the scroller's snap type to x should make it resnap on the x-axis.");
test(t => {
t.add_cleanup(cleanup);
scroller.scrollTo(0,0);
assert_equals(scroller.scrollTop, 0);
assert_equals(scroller.scrollLeft, 0);
scroller.style.setProperty("scroll-snap-type", "x mandatory");
assert_equals(scroller.scrollLeft, 100);
assert_equals(scroller.scrollTop, 0);
scroller.style.setProperty("scroll-snap-type", "y mandatory");
assert_equals(scroller.scrollTop, 100);
}, "Changing the scroller's snap type axis should make it resnap.");
</script>

65
tests/wpt/web-platform-tests/css/css-transforms/animation/perspective-composition.html Normal file
View file

@ -0,0 +1,65 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title> perspective composition</title>
<link rel="help" href="https://drafts.csswg.org/css-transforms-2/#propdef-perspective">
<meta name="assert" content="perspective supports animation">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/interpolation-testcommon.js"></script>
<body>
<script>
test_composition({
property: 'perspective',
underlying: '50px',
addFrom: '100px',
addTo: '200px',
}, [
{at: -0.3, expect: '120px'},
{at: 0, expect: '150px'},
{at: 0.5, expect: '200px'},
{at: 1, expect: '250px'},
{at: 1.5, expect: '300px'},
]);
test_composition({
property: 'perspective',
underlying: '100px',
addFrom: '10px',
addTo: '2px',
}, [
{at: -0.5, expect: '114px'},
{at: 0, expect: '110px'},
{at: 0.5, expect: '106px'},
{at: 1, expect: '102px'},
{at: 1.5, expect: '98px'}, // Value clamping should happen after composition.
]);
test_composition({
property: 'perspective',
underlying: '50px',
addFrom: '100px',
replaceTo: '200px',
}, [
{at: -0.3, expect: '135px'},
{at: 0, expect: '150px'},
{at: 0.5, expect: '175px'},
{at: 1, expect: '200px'},
{at: 1.5, expect: '225px'},
]);
test_composition({
property: 'perspective',
underlying: '100px',
addFrom: '100px',
addTo: 'none',
}, [
{at: -0.3, expect: '200px'},
{at: 0, expect: '200px'},
{at: 0.5, expect: 'none'},
{at: 1, expect: 'none'},
{at: 1.5, expect: 'none'},
]);
</script>
</body>

167
tests/wpt/web-platform-tests/css/css-transforms/animation/rotate-composition.html Normal file
View file

@ -0,0 +1,167 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title> rotate composition</title>
<link rel="help" href="https://drafts.csswg.org/css-transforms-2/#propdef-rotate">
<meta name="assert" content="rotate supports animation">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/interpolation-testcommon.js"></script>
<body>
<script>
test_composition({
property: 'rotate',
underlying: '100deg',
addFrom: '10deg',
addTo: '30deg',
}, [
{at: -1, expect: '90deg'},
{at: 0, expect: '110deg'},
{at: 0.25, expect: '115deg'},
{at: 0.75, expect: '125deg'},
{at: 1, expect: '130deg'},
{at: 2, expect: '150deg'},
]);
test_composition({
property: 'rotate',
underlying: '1 0 0 200deg',
addFrom: '1 0 0 -100deg',
replaceTo: '1 0 0 40deg',
}, [
{at: -1, expect: '1 0 0 160deg'},
{at: 0, expect: '1 0 0 100deg'},
{at: 0.25, expect: '1 0 0 85deg'},
{at: 0.75, expect: '1 0 0 55deg'},
{at: 1, expect: '1 0 0 40deg'},
{at: 2, expect: '1 0 0 -20deg'},
]);
test_composition({
property: 'rotate',
underlying: '0 1 0 -40deg',
replaceFrom: '0 1 0 50deg',
addTo: '0 1 0 10deg',
}, [
{at: -1, expect: '0 1 0 130deg'},
{at: 0, expect: '0 1 0 50deg'},
{at: 0.25, expect: '0 1 0 30deg'},
{at: 0.75, expect: '0 1 0 -10deg'},
{at: 1, expect: '0 1 0 -30deg'},
{at: 2, expect: '0 1 0 -110deg'},
]);
test_composition({
property: 'rotate',
underlying: '1 2 3 40deg',
addFrom: '2 4 6 10deg',
addTo: '3 6 9 50deg',
}, [
{at: -1, expect: '1 2 3 10deg'},
{at: 0, expect: '1 2 3 50deg'},
{at: 0.25, expect: '1 2 3 60deg'},
{at: 0.75, expect: '1 2 3 80deg'},
{at: 1, expect: '1 2 3 90deg'},
{at: 2, expect: '1 2 3 130deg'},
]);
test_composition({
property: 'rotate',
underlying: '1 2 3 270deg',
addFrom: '1 2 3 90deg',
replaceTo: '0 1 0 100deg',
}, [
{at: -1, expect: '-5.49276e-17 -1 -1.64783e-16 100deg'},
{at: 0, expect: '1 2 3 360deg'},
{at: 0.25, expect: '-1.20172e-16 1 -3.60516e-16 25deg'},
{at: 0.75, expect: '-1.51909e-17 1 -4.55726e-17 75deg'},
{at: 1, expect: '0 1 0 100deg'},
{at: 2, expect: '-3.3235e-17 -1 -9.97049e-17 160deg'},
]);
test_composition({
property: 'rotate',
underlying: '1 2 3 90deg',
addFrom: '2 4 6 270deg',
replaceTo: '0 1 0 100deg',
}, [
{at: -1, expect: '-5.49276e-17 -1 -1.64783e-16 100deg'},
{at: 0, expect: '1 2 3 360deg'},
{at: 0.25, expect: '-1.20172e-16 1 -3.60516e-16 25deg'},
{at: 0.75, expect: '-1.51909e-17 1 -4.55726e-17 75deg'},
{at: 1, expect: '0 1 0 100deg'},
{at: 2, expect: '-3.3235e-17 -1 -9.97049e-17 160deg'},
]);
test_composition({
property: 'rotate',
underlying: '1 0 0 90deg',
addFrom: '0 1 0 180deg',
replaceTo: '0 0 1 90deg',
}, [
{at: -1, expect: '-6.12323e-17 -1 1.57009e-16 90deg'},
{at: 0, expect: '-4.32978e-17 -0.707107 -0.707107 180deg'},
{at: 0.25, expect: '-1.48952e-16 -0.894427 -0.447214 131.81deg'},
{at: 0.75, expect: '-2.94392e-17 -0.707107 0.707107 70.5288deg'},
{at: 1, expect: '90deg'},
{at: 2, expect: '-6.12323e-17 -1 -4.71028e-16 90deg'},
]);
test_composition({
property: 'rotate',
underlying: 'none',
addFrom: 'none',
replaceTo: '0 1 0 100deg',
}, [
{at: -1, expect: '0 1 0 -100deg'},
{at: 0, expect: 'none'},
{at: 0.25, expect: '0 1 0 25deg'},
{at: 0.75, expect: '0 1 0 75deg'},
{at: 1, expect: '0 1 0 100deg'},
{at: 2, expect: '0 1 0 200deg'},
]);
test_composition({
property: 'rotate',
underlying: 'none',
addFrom: '2 4 6 270deg',
replaceTo: 'none',
}, [
{at: -1, expect: '2 4 6 540deg'},
{at: 0, expect: '2 4 6 270deg'},
{at: 0.25, expect: '2 4 6 202.5deg'},
{at: 0.75, expect: '2 4 6 67.5deg'},
{at: 1, expect: 'none'},
{at: 2, expect: '2 4 6 -270deg'},
]);
test_composition({
property: 'rotate',
underlying: '1 2 3 90deg',
addFrom: 'none',
replaceTo: '0 1 0 100deg',
}, [
{at: -1, expect: '0.31 -0.22 0.92 131.66deg'},
{at: 0, expect: '1 2 3 90deg'},
{at: 0.25, expect: '0.21 0.73 0.64 86.72deg'},
{at: 0.75, expect: '0.07 0.97 0.21 92.05deg'},
{at: 1, expect: '0 1 0 100deg'},
{at: 2, expect: '-0.2 0.79 -0.59 151.11deg'},
]);
test_composition({
property: 'rotate',
underlying: '1 2 3 90deg',
addFrom: '2 4 6 270deg',
replaceTo: 'none',
}, [
{at: -1, expect: '1 2 3 720deg'},
{at: 0, expect: '1 2 3 360deg'},
{at: 0.25, expect: '1 2 3 270deg'},
{at: 0.75, expect: '1 2 3 90deg'},
{at: 1, expect: 'none'},
{at: 2, expect: '1 2 3 -360deg'},
]);
</script>
</body>

101
tests/wpt/web-platform-tests/css/css-transforms/animation/scale-composition.html Normal file
View file

@ -0,0 +1,101 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>scale composition</title>
<link rel="help" href="https://drafts.csswg.org/css-transforms-2/#propdef-scale">
<meta name="assert" content="scale supports animation.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/interpolation-testcommon.js"></script>
<body>
<script>
test_composition({
property: 'scale',
underlying: '2 1',
addFrom: '3 1',
addTo: '4 1',
}, [
{at: -0.5, expect: '5 1'},
{at: 0, expect: '6 1'},
{at: 0.25, expect: '6.5 1'},
{at: 0.5, expect: '7 1'},
{at: 0.75, expect: '7.5 1'},
{at: 1, expect: '8 1'},
{at: 1.5, expect: '9 1'},
]);
test_composition({
property: 'scale',
underlying: '1 2 3',
addFrom: '4 5 6',
replaceTo: '7 8 9',
}, [
{at: -0.5, expect: '2.5 11 22.5'},
{at: 0, expect: '4 10 18'},
{at: 0.25, expect: '4.75 9.5 15.75'},
{at: 0.5, expect: '5.5 9 13.5'},
{at: 0.75, expect: '6.25 8.5 11.25'},
{at: 1, expect: '7 8 9'},
{at: 1.5, expect: '8.5 7 4.5'},
]);
test_composition({
property: 'scale',
underlying: 'none',
addFrom: 'none',
replaceTo: '1.5 1',
}, [
{at: -1, expect: '0.5 1'},
{at: 0, expect: '1'},
{at: 0.25, expect: '1.125 1'},
{at: 0.75, expect: '1.375 1'},
{at: 1, expect: '1.5 1'},
{at: 2, expect: '2 1'},
]);
test_composition({
property: 'scale',
underlying: 'none',
addFrom: '4 5 6',
replaceTo: 'none',
}, [
{at: -1, expect: '7 9 11'},
{at: 0, expect: '4 5 6'},
{at: 0.25, expect: '3.25 4 4.75'},
{at: 0.75, expect: '1.75 2 2.25'},
{at: 1, expect: 'none'},
{at: 2, expect: '-2 -3 -4'},
]);
test_composition({
property: 'scale',
underlying: '1 2 3',
addFrom: 'none',
replaceTo: '7 8 9',
}, [
{at: -0.5, expect: '-2 -1 0'},
{at: 0, expect: '1 2 3'},
{at: 0.25, expect: '2.5 3.5 4.5'},
{at: 0.5, expect: '4 5 6'},
{at: 0.75, expect: '5.5 6.5 7.5'},
{at: 1, expect: '7 8 9'},
{at: 1.5, expect: '10 11 12'},
]);
test_composition({
property: 'scale',
underlying: '1 2 3',
addFrom: '4 5 6',
replaceTo: 'none',
}, [
{at: -0.5, expect: '5.5 14.5 26.5'},
{at: 0, expect: '4 10 18'},
{at: 0.25, expect: '3.25 7.75 13.75'},
{at: 0.5, expect: '2.5 5.5 9.5'},
{at: 0.75, expect: '1.75 3.25 5.25'},
{at: 1, expect: 'none'},
{at: 1.5, expect: '-0.5 -3.5 -7.5'},
]);
</script>
</body>

86
tests/wpt/web-platform-tests/css/css-transforms/animation/transform-composition.html Normal file
View file

@ -0,0 +1,86 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>transform composition</title>
<link rel="help" href="https://drafts.csswg.org/css-transforms/#transform-property">
<meta name="assert" content="transform supports animation as a transform list">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/interpolation-testcommon.js"></script>
<body>
<script>
// This file contains tests for the composition behavior of transforms that is
// unrelated to the individual transform functions. For the transform functions
// themselves, see the transform-*-composition.html subtests.
// ------------------ Addition -----------------
test_composition({
property: 'transform',
underlying: 'rotateX(100deg) rotateY(100deg)',
addFrom: 'translate(10px, 20px)',
replaceTo: 'rotateX(200deg) rotateY(200deg) translate(110px, 220px)',
}, [
{at: -0.5, expect: 'rotateX(50deg) rotateY(50deg) translate(-40px, -80px)'},
{at: 0, expect: 'rotateX(100deg) rotateY(100deg) translate(10px, 20px)'},
{at: 0.25, expect: 'rotateX(125deg) rotateY(125deg) translate(35px, 70px)'},
{at: 0.5, expect: 'rotateX(150deg) rotateY(150deg) translate(60px, 120px)'},
{at: 0.75, expect: 'rotateX(175deg) rotateY(175deg) translate(85px, 170px)'},
{at: 1, expect: 'rotateX(200deg) rotateY(200deg) translate(110px, 220px)'},
{at: 1.5, expect: 'rotateX(250deg) rotateY(250deg) translate(160px, 320px)'},
]);
// Shorter list is extended with corresponding identity transforms for pairwise
// interpolation.
test_composition({
property: 'transform',
underlying: 'rotateX(45deg)',
addFrom: 'none',
addTo: 'rotateY(360deg)',
}, [
{at: -0.5, expect: 'rotateX(45deg) rotateY(-180deg)'},
{at: 0, expect: 'rotateX(45deg) rotateY(0deg)'},
{at: 0.25, expect: 'rotateX(45deg) rotateY(90deg)'},
{at: 0.5, expect: 'rotateX(45deg) rotateY(180deg)'},
{at: 0.75, expect: 'rotateX(45deg) rotateY(270deg)'},
{at: 1, expect: 'rotateX(45deg) rotateY(360deg)'},
{at: 1.5, expect: 'rotateX(45deg) rotateY(540deg)'},
]);
// Matrix decomposition cases
test_composition({
property: 'transform',
underlying: 'rotateX(90deg)',
addFrom: 'translate(100px, 100px)',
addTo: 'scale(2)',
}, [
{at: -0.5, expect: 'matrix3d(0.5, 0, 0, 0, 0, 1.11022e-16, 0.5, 0, 0, -1, 2.22045e-16, 0, 150, 9.18485e-15, 150, 1)'},
{at: 0, expect: 'matrix3d(1, 0, 0, 0, 0, 6.12323e-17, 1, 0, 0, -1, 6.12323e-17, 0, 100, 6.12323e-15, 100, 1)'},
{at: 0.25, expect: 'matrix3d(1.25, 0, 0, 0, 0, 2.77556e-16, 1.25, 0, 0, -1, 2.22045e-16, 0, 75, 4.59243e-15, 75, 1)'},
{at: 0.5, expect: 'matrix3d(1.5, 0, 0, 0, 0, 3.33067e-16, 1.5, 0, 0, -1, 2.22045e-16, 0, 50, 3.06162e-15, 50, 1)'},
{at: 0.75, expect: 'matrix3d(1.75, 0, 0, 0, 0, 3.88578e-16, 1.75, 0, 0, -1, 2.22045e-16, 0, 25, 1.53081e-15, 25, 1)'},
{at: 1, expect: 'matrix3d(2, 0, 0, 0, 0, 1.22465e-16, 2, 0, 0, -1, 6.12323e-17, 0, 0, 0, 0, 1)'},
{at: 1.5, expect: 'matrix3d(2.5, 0, 0, 0, 0, 5.55112e-16, 2.5, 0, 0, -1, 2.22045e-16, 0, -50, -3.06162e-15, -50, 1)'},
]);
// Force a fallback to matrix interpolation.
test_composition({
property: 'transform',
underlying: 'rotateX(45deg)',
addFrom: 'scaleX(1)',
addTo: 'rotateY(360deg)',
}, [
{at: -0.5, expect: 'rotateX(45deg)'},
{at: 0, expect: 'rotateX(45deg)'},
{at: 0.25, expect: 'rotateX(45deg)'},
{at: 0.5, expect: 'rotateX(45deg)'},
{at: 0.75, expect: 'rotateX(45deg)'},
{at: 1, expect: 'rotateX(45deg)'},
{at: 1.5, expect: 'rotateX(45deg)'},
]);
// ------------------ Accumulation -----------------
// TODO(smcgruer): Add tests for accumulation behaviors.
</script>
</body>

208
tests/wpt/web-platform-tests/css/css-transforms/animation/transform-matrix-composition.html Normal file
View file

@ -0,0 +1,208 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>transform-matrix composition</title>
<link rel="help" href="https://drafts.csswg.org/css-transforms-2/#ctm">
<meta name="assert" content="transform-matrix supports animation as a transform list">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/interpolation-testcommon.js"></script>
<body>
<script>
// For matrix and matrix3d, addition is defined as concatenation whilst
// accumulation works by decomposing the matrix and then accumulating the
// decomposed functions. We can therefore test the difference between the
// two by mixing functions such that a naive multiplication would look
// different than the accumulation behavior.
//
// Note that due to the complexities of decomposition the test space here is
// huge; we cover some basic cases and hope that the tests for the individual
// functions provide a lot of the remaining coverage.
// Creates a matrix3d function, encoding the passed rotation and translation.
// Note that the translate will not be affected by the rotation.
function create3dMatrix(x, y, z, radians, translateX) {
// Normalize the rotation axes.
const length = Math.sqrt(x*x + y*y + z*z);
x /= length;
y /= length;
z /= length;
const sc = Math.sin(radians / 2) * Math.cos(radians / 2);
const sq = Math.sin(radians / 2) * Math.sin(radians / 2);
// https://drafts.csswg.org/css-transforms-2/#Rotate3dDefined
// https://drafts.csswg.org/css-transforms-2/#Translate3dDefined
return 'matrix3d(' + [
1 - 2 * (y*y + z*z) * sq,
2 * (x * y * sq + z * sc),
2 * (x * z * sq - y * sc),
0,
2 * (x * y * sq - z * sc),
1 - 2 * (x*x + z*z) * sq,
2 * (y * z * sq + x * sc),
0,
2 * (x * z * sq + y * sc),
2 * (y * z * sq - x * sc),
1 - 2 * (x*x + y*y) * sq,
0,
translateX, 0, 0, 1].join() + ')';
}
// ------------ Addition tests --------------
test_composition({
property: 'transform',
// translateX(100px) rotate(90deg)
underlying: 'matrix(0, 1, -1, 0, 100, 0)',
// translateX(100px)
addFrom: 'matrix(1, 0, 0, 1, 100, 0)',
// translateX(200px)
addTo: 'matrix(1, 0, 0, 1, 200, 0)',
}, [
{at: -0.5, expect: 'matrix(0, 1, -1, 0, 100, 50)'},
{at: 0, expect: 'matrix(0, 1, -1, 0, 100, 100)'},
{at: 0.25, expect: 'matrix(0, 1, -1, 0, 100, 125)'},
{at: 0.5, expect: 'matrix(0, 1, -1, 0, 100, 150)'},
{at: 0.75, expect: 'matrix(0, 1, -1, 0, 100, 175)'},
{at: 1, expect: 'matrix(0, 1, -1, 0, 100, 200)'},
{at: 1.5, expect: 'matrix(0, 1, -1, 0, 100, 250)'},
]);
test_composition({
property: 'transform',
// translateX(100px) rotate3d(1, 1, 0, 45deg)
underlying: create3dMatrix(1, 1, 0, Math.PI / 4, 100),
// translateX(100px)
addFrom: 'matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 100, 0, 0, 1)',
// translateX(200px)
addTo: 'matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 200, 0, 0, 1)',
}, [
// matrix3ds are hard to read; these are the decomposed forms for clarity
{at: -0.5, expect: 'translateX(100px) rotate3d(1, 1, 0, 45deg) translateX(50px)'},
{at: 0, expect: 'translateX(100px) rotate3d(1, 1, 0, 45deg) translateX(100px)'},
{at: 0.25, expect: 'translateX(100px) rotate3d(1, 1, 0, 45deg) translateX(125px)'},
{at: 0.5, expect: 'translateX(100px) rotate3d(1, 1, 0, 45deg) translateX(150px)'},
{at: 0.75, expect: 'translateX(100px) rotate3d(1, 1, 0, 45deg) translateX(175px)'},
{at: 1, expect: 'translateX(100px) rotate3d(1, 1, 0, 45deg) translateX(200px)'},
{at: 1.5, expect: 'translateX(100px) rotate3d(1, 1, 0, 45deg) translateX(250px)'},
]);
// Addition of non-invertible matrices is still defined as concatenation so
// includes the underlying value.
test_composition({
property: 'transform',
// Non-invertible.
underlying: 'matrix(1, 1, 0, 0, 0, 100)',
// translateX(100px)
addFrom: 'matrix(1, 0, 0, 1, 100, 0)',
// translateX(200px)
addTo: 'matrix(1, 0, 0, 1, 200, 0)',
}, [
{at: -0.5, expect: 'matrix(1, 1, 0, 0, 100, 200)'},
{at: 0, expect: 'matrix(1, 1, 0, 0, 100, 200)'},
{at: 0.25, expect: 'matrix(1, 1, 0, 0, 100, 200)'},
{at: 0.5, expect: 'matrix(1, 1, 0, 0, 200, 300)'},
{at: 0.75, expect: 'matrix(1, 1, 0, 0, 200, 300)'},
{at: 1, expect: 'matrix(1, 1, 0, 0, 200, 300)'},
{at: 1.5, expect: 'matrix(1, 1, 0, 0, 200, 300)'},
]);
test_composition({
property: 'transform',
// translateX(100px)
underlying: 'matrix(1, 0, 0, 1, 100, 0)',
// Non-invertible
addFrom: 'matrix(1, 1, 0, 0, 0, 100)',
// translateX(200px)
addTo: 'matrix(1, 0, 0, 1, 200, 0)',
}, [
{at: -0.5, expect: 'matrix(1, 1, 0, 0, 100, 100)'},
{at: 0, expect: 'matrix(1, 1, 0, 0, 100, 100)'},
{at: 0.25, expect: 'matrix(1, 1, 0, 0, 100, 100)'},
{at: 0.5, expect: 'matrix(1, 0, 0, 1, 300, 0)'},
{at: 0.75, expect: 'matrix(1, 0, 0, 1, 300, 0)'},
{at: 1, expect: 'matrix(1, 0, 0, 1, 300, 0)'},
{at: 1.5, expect: 'matrix(1, 0, 0, 1, 300, 0)'},
]);
// ------------ Accumulation tests --------------
test_composition({
property: 'transform',
// translateX(100px) rotate(90deg)
underlying: 'matrix(0, 1, -1, 0, 100, 0)',
// translateX(100px)
accumulateFrom: 'matrix(1, 0, 0, 1, 100, 0)',
// translateX(200px)
accumulateTo: 'matrix(1, 0, 0, 1, 200, 0)',
}, [
{at: -0.5, expect: 'matrix(0, 1, -1, 0, 150, 0)'},
{at: 0, expect: 'matrix(0, 1, -1, 0, 200, 0)'},
{at: 0.25, expect: 'matrix(0, 1, -1, 0, 225, 0)'},
{at: 0.5, expect: 'matrix(0, 1, -1, 0, 250, 0)'},
{at: 0.75, expect: 'matrix(0, 1, -1, 0, 275, 0)'},
{at: 1, expect: 'matrix(0, 1, -1, 0, 300, 0)'},
{at: 1.5, expect: 'matrix(0, 1, -1, 0, 350, 0)'},
]);
test_composition({
property: 'transform',
// translateX(100px) rotate3d(1, 1, 0, 45deg)
underlying: create3dMatrix(1, 1, 0, Math.PI / 4, 100),
// translateX(100px)
accumulateFrom: 'matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 100, 0, 0, 1)',
// translateX(200px)
accumulateTo: 'matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 200, 0, 0, 1)',
}, [
// matrix3ds are hard to read; these are the decomposed forms for clarity
{at: -0.5, expect: 'translateX(150px) rotate3d(1, 1, 0, 45deg)'},
{at: 0, expect: 'translateX(200px) rotate3d(1, 1, 0, 45deg)'},
{at: 0.25, expect: 'translateX(225px) rotate3d(1, 1, 0, 45deg)'},
{at: 0.5, expect: 'translateX(250px) rotate3d(1, 1, 0, 45deg)'},
{at: 0.75, expect: 'translateX(275px) rotate3d(1, 1, 0, 45deg)'},
{at: 1, expect: 'translateX(300px) rotate3d(1, 1, 0, 45deg)'},
{at: 1.5, expect: 'translateX(350px) rotate3d(1, 1, 0, 45deg)'},
]);
// Accumulation of non-invertible matrices falls back to replace behavior.
test_composition({
property: 'transform',
// Non-invertible.
underlying: 'matrix(1, 1, 0, 0, 0, 100)',
// translateX(100px)
accumulateFrom: 'matrix(1, 0, 0, 1, 100, 0)',
// translateX(200px)
accumulateTo: 'matrix(1, 0, 0, 1, 200, 0)',
}, [
{at: -0.5, expect: 'matrix(1, 0, 0, 1, 50, 0)'},
{at: 0, expect: 'matrix(1, 0, 0, 1, 100, 0)'},
{at: 0.25, expect: 'matrix(1, 0, 0, 1, 125, 0)'},
{at: 0.5, expect: 'matrix(1, 0, 0, 1, 150, 0)'},
{at: 0.75, expect: 'matrix(1, 0, 0, 1, 175, 0)'},
{at: 1, expect: 'matrix(1, 0, 0, 1, 200, 0)'},
{at: 1.5, expect: 'matrix(1, 0, 0, 1, 250, 0)'},
]);
test_composition({
property: 'transform',
// translateX(100px)
underlying: 'matrix(1, 0, 0, 1, 100, 0)',
// Non-invertible
accumulateFrom: 'matrix(1, 1, 0, 0, 0, 100)',
// translateX(200px)
accumulateTo: 'matrix(1, 0, 0, 1, 200, 0)',
}, [
{at: -0.5, expect: 'matrix(1, 1, 0, 0, 0, 100)'},
{at: 0, expect: 'matrix(1, 1, 0, 0, 0, 100)'},
{at: 0.25, expect: 'matrix(1, 1, 0, 0, 0, 100)'},
{at: 0.5, expect: 'matrix(1, 0, 0, 1, 300, 0)'},
{at: 0.75, expect: 'matrix(1, 0, 0, 1, 300, 0)'},
{at: 1, expect: 'matrix(1, 0, 0, 1, 300, 0)'},
{at: 1.5, expect: 'matrix(1, 0, 0, 1, 300, 0)'},
]);
</script>
</body>

67
tests/wpt/web-platform-tests/css/css-transforms/animation/transform-perspective-composition.html Normal file
View file

@ -0,0 +1,67 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>transform-perspective composition</title>
<link rel="help" href="https://drafts.csswg.org/css-transforms-2/#three-d-transform-functions">
<meta name="assert" content="transform-perspective supports animation as a transform list">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/interpolation-testcommon.js"></script>
<body>
<script>
// Addition and accumulation of perspective values are very similar, but not
// identical. We can test the difference by constructing a scenario where a
// perspective parameter would go negative in one case (and thus be clamped
// to 0), and would not go negative in the other case.
//
// In the test below, the values differ at 1.5 progress. The reason for this
// is that at 1.5 progress, the addition case (which uses concatenation)
// computes to:
//
// perspective(10px) perspective(-50px)
//
// Since perspective cannot go negative, this is clamped to:
//
// perspective(10px) identity
//
// The accumulation case, on the other hand, combines the components
// and so ends up blending from perspective(5px) to perspective(8.33...px) at
// 1.5 progress, which results in perspective(12.5px) - this is what you would
// get with addition too, if not for the clamping behavior.
// ------------ Addition tests --------------
test_composition({
property: 'transform',
underlying: 'perspective(10px)',
addFrom: 'perspective(10px)',
addTo: 'perspective(50px)',
}, [
{at: -0.5, expect: 'perspective(4.12px)'},
{at: 0, expect: 'perspective(5px)'},
{at: 0.25, expect: 'perspective(5.45px)'},
{at: 0.5, expect: 'perspective(6.15px)'},
{at: 0.75, expect: 'perspective(7.06px)'},
{at: 1, expect: 'perspective(8.33px)'},
{at: 1.5, expect: 'perspective(10px)'},
]);
// ------------ Accumulation tests --------------
test_composition({
property: 'transform',
underlying: 'perspective(10px)',
accumulateFrom: 'perspective(10px)',
accumulateTo: 'perspective(50px)',
}, [
{at: -0.5, expect: 'perspective(4.12px)'},
{at: 0, expect: 'perspective(5px)'},
{at: 0.25, expect: 'perspective(5.45px)'},
{at: 0.5, expect: 'perspective(6.15px)'},
{at: 0.75, expect: 'perspective(7.06px)'},
{at: 1, expect: 'perspective(8.33px)'},
{at: 1.5, expect: 'perspective(12.5px)'},
]);
</script>
</body>

164
tests/wpt/web-platform-tests/css/css-transforms/animation/transform-rotate-composition.html Normal file
View file

@ -0,0 +1,164 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>transform-rotate composition</title>
<link rel="help" href="https://drafts.csswg.org/css-transforms/#funcdef-transform-rotate">
<meta name="assert" content="transform-rotate supports animation as a transform list">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/interpolation-testcommon.js"></script>
<body>
<script>
// ------------ Addition tests --------------
test_composition({
property: 'transform',
underlying: 'rotateX(20deg)',
addFrom: 'rotateX(40deg)',
addTo: 'rotateX(60deg)',
}, [
{at: -0.5, expect: 'rotateX(50deg)'},
{at: 0, expect: 'rotateX(60deg)'},
{at: 0.25, expect: 'rotateX(65deg)'},
{at: 0.5, expect: 'rotateX(70deg)'},
{at: 0.75, expect: 'rotateX(75deg)'},
{at: 1, expect: 'rotateX(80deg)'},
{at: 1.5, expect: 'rotateX(90deg)'},
]);
test_composition({
property: 'transform',
underlying: 'rotateY(20deg)',
addFrom: 'rotateY(40deg)',
addTo: 'rotateY(60deg)',
}, [
{at: -0.5, expect: 'rotateY(50deg)'},
{at: 0, expect: 'rotateY(60deg)'},
{at: 0.25, expect: 'rotateY(65deg)'},
{at: 0.5, expect: 'rotateY(70deg)'},
{at: 0.75, expect: 'rotateY(75deg)'},
{at: 1, expect: 'rotateY(80deg)'},
{at: 1.5, expect: 'rotateY(90deg)'},
]);
test_composition({
property: 'transform',
underlying: 'rotateZ(20deg)',
addFrom: 'rotateZ(40deg)',
addTo: 'rotateZ(60deg)',
}, [
{at: -0.5, expect: 'rotateZ(50deg)'},
{at: 0, expect: 'rotateZ(60deg)'},
{at: 0.25, expect: 'rotateZ(65deg)'},
{at: 0.5, expect: 'rotateZ(70deg)'},
{at: 0.75, expect: 'rotateZ(75deg)'},
{at: 1, expect: 'rotateZ(80deg)'},
{at: 1.5, expect: 'rotateZ(90deg)'},
]);
// When testing rotate functions in isolation, the additive and accumulation
// behaviors are functionally identical. This test includes a skew to ensure
// both methods are implemented; add should append the from/to after the skew.
test_composition({
property: 'transform',
underlying: 'rotate(45deg) skew(10deg, 20deg)',
addFrom: 'rotate(45deg)',
addTo: 'rotate(225deg)',
}, [
{at: -0.5, expect: 'rotate(45deg) skew(10deg, 20deg) rotate(-45deg)'},
{at: 0, expect: 'rotate(45deg) skew(10deg, 20deg) rotate(45deg)'},
{at: 0.25, expect: 'rotate(45deg) skew(10deg, 20deg) rotate(90deg)'},
{at: 0.5, expect: 'rotate(45deg) skew(10deg, 20deg) rotate(135deg)'},
{at: 0.75, expect: 'rotate(45deg) skew(10deg, 20deg) rotate(180deg)'},
{at: 1, expect: 'rotate(45deg) skew(10deg, 20deg) rotate(225deg)'},
{at: 1.5, expect: 'rotate(45deg) skew(10deg, 20deg) rotate(315deg)'},
]);
// ------------ Accumulation tests --------------
test_composition({
property: 'transform',
underlying: 'rotateX(20deg)',
accumulateFrom: 'rotateX(40deg)',
accumulateTo: 'rotateX(60deg)',
}, [
{at: -0.5, expect: 'rotateX(50deg)'},
{at: 0, expect: 'rotateX(60deg)'},
{at: 0.25, expect: 'rotateX(65deg)'},
{at: 0.5, expect: 'rotateX(70deg)'},
{at: 0.75, expect: 'rotateX(75deg)'},
{at: 1, expect: 'rotateX(80deg)'},
{at: 1.5, expect: 'rotateX(90deg)'},
]);
test_composition({
property: 'transform',
underlying: 'rotateY(20deg)',
accumulateFrom: 'rotateY(40deg)',
accumulateTo: 'rotateY(60deg)',
}, [
{at: -0.5, expect: 'rotateY(50deg)'},
{at: 0, expect: 'rotateY(60deg)'},
{at: 0.25, expect: 'rotateY(65deg)'},
{at: 0.5, expect: 'rotateY(70deg)'},
{at: 0.75, expect: 'rotateY(75deg)'},
{at: 1, expect: 'rotateY(80deg)'},
{at: 1.5, expect: 'rotateY(90deg)'},
]);
test_composition({
property: 'transform',
underlying: 'rotateZ(20deg)',
accumulateFrom: 'rotateZ(40deg)',
accumulateTo: 'rotateZ(60deg)',
}, [
{at: -0.5, expect: 'rotateZ(50deg)'},
{at: 0, expect: 'rotateZ(60deg)'},
{at: 0.25, expect: 'rotateZ(65deg)'},
{at: 0.5, expect: 'rotateZ(70deg)'},
{at: 0.75, expect: 'rotateZ(75deg)'},
{at: 1, expect: 'rotateZ(80deg)'},
{at: 1.5, expect: 'rotateZ(90deg)'},
]);
// The rotate functions all share the same primitive type (rotate3d), so can be
// accumulated between. If primitive type matching is not properly being
// performed, this test would likely fail with a fallback to replace behavior.
test_composition({
property: 'transform',
underlying: 'rotateX(45deg)',
accumulateFrom: 'rotateY(30deg)',
accumulateTo: 'rotateY(70deg)',
}, [
// Due to how rotation is accumulated (addition of underlying angles), the
// behavior is identical to concatenating the components. The expectations
// are expressed as concatenations for readability.
{at: -0.5, expect: 'rotateX(45deg) rotateY(10deg)'},
{at: 0, expect: 'rotateX(45deg) rotateY(30deg)'},
{at: 0.25, expect: 'rotateX(45deg) rotateY(40deg)'},
{at: 0.5, expect: 'rotateX(45deg) rotateY(50deg)'},
{at: 0.75, expect: 'rotateX(45deg) rotateY(60deg)'},
{at: 1, expect: 'rotateX(45deg) rotateY(70deg)'},
{at: 1.5, expect: 'rotateX(45deg) rotateY(90deg)'},
]);
// When testing rotate functions in isolation, the additive and accumulation
// behaviors are functionally identical. This test includes a skew to ensure
// both methods are implemented; accumulate should combine the rotate before
// the skew.
test_composition({
property: 'transform',
underlying: 'rotate(45deg) skew(10deg, 20deg)',
accumulateFrom: 'rotate(45deg)',
accumulateTo: 'rotate(225deg)',
}, [
{at: -0.5, expect: 'rotate(0deg) skew(10deg, 20deg)'},
{at: 0, expect: 'rotate(90deg) skew(10deg, 20deg)'},
{at: 0.25, expect: 'rotate(135deg) skew(10deg, 20deg)'},
{at: 0.5, expect: 'rotate(180deg) skew(10deg, 20deg)'},
{at: 0.75, expect: 'rotate(225deg) skew(10deg, 20deg)'},
{at: 1, expect: 'rotate(270deg) skew(10deg, 20deg)'},
{at: 1.5, expect: 'rotate(360deg) skew(10deg, 20deg)'},
]);
</script>
</body>

129
tests/wpt/web-platform-tests/css/css-transforms/animation/transform-scale-composition.html Normal file
View file

@ -0,0 +1,129 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>transform-scale composition</title>
<link rel="help" href="https://drafts.csswg.org/css-transforms/#two-d-transform-functions">
<meta name="assert" content="transform-scale supports animation as a transform list">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/interpolation-testcommon.js"></script>
<body>
<script>
// Addition (aka concatenation) of scale functions results in multiplying their
// values (scale(2) scale(3) == scale(6)), whereas accumulation does a 1-based
// sum of the components (accumulate(scale(2), scale(3)) == scale(2 + 3 - 1) ==
// scale(4)).
// ------------ Addition tests --------------
test_composition({
property: 'transform',
underlying: 'scaleX(2)',
addFrom: 'scaleX(3)',
addTo: 'scaleX(4)',
}, [
{at: -0.5, expect: 'scaleX(5)'},
{at: 0, expect: 'scaleX(6)'},
{at: 0.25, expect: 'scaleX(6.5)'},
{at: 0.5, expect: 'scaleX(7)'},
{at: 0.75, expect: 'scaleX(7.5)'},
{at: 1, expect: 'scaleX(8)'},
{at: 1.5, expect: 'scaleX(9)'},
]);
test_composition({
property: 'transform',
underlying: 'scaleY(2)',
addFrom: 'scaleY(3)',
addTo: 'scaleY(4)',
}, [
{at: -0.5, expect: 'scaleY(5)'},
{at: 0, expect: 'scaleY(6)'},
{at: 0.25, expect: 'scaleY(6.5)'},
{at: 0.5, expect: 'scaleY(7)'},
{at: 0.75, expect: 'scaleY(7.5)'},
{at: 1, expect: 'scaleY(8)'},
{at: 1.5, expect: 'scaleY(9)'},
]);
test_composition({
property: 'transform',
underlying: 'scaleZ(2)',
addFrom: 'scaleZ(3)',
addTo: 'scaleZ(4)',
}, [
{at: -0.5, expect: 'scaleZ(5)'},
{at: 0, expect: 'scaleZ(6)'},
{at: 0.25, expect: 'scaleZ(6.5)'},
{at: 0.5, expect: 'scaleZ(7)'},
{at: 0.75, expect: 'scaleZ(7.5)'},
{at: 1, expect: 'scaleZ(8)'},
{at: 1.5, expect: 'scaleZ(9)'},
]);
// ------------ Accumulation tests --------------
test_composition({
property: 'transform',
underlying: 'scaleX(2)',
accumulateFrom: 'scaleX(3)',
accumulateTo: 'scaleX(4)',
}, [
{at: -0.5, expect: 'scaleX(3.5)'},
{at: 0, expect: 'scaleX(4)'},
{at: 0.25, expect: 'scaleX(4.25)'},
{at: 0.5, expect: 'scaleX(4.5)'},
{at: 0.75, expect: 'scaleX(4.75)'},
{at: 1, expect: 'scaleX(5)'},
{at: 1.5, expect: 'scaleX(5.5)'},
]);
test_composition({
property: 'transform',
underlying: 'scaleY(2)',
accumulateFrom: 'scaleY(3)',
accumulateTo: 'scaleY(4)',
}, [
{at: -0.5, expect: 'scaleY(3.5)'},
{at: 0, expect: 'scaleY(4)'},
{at: 0.25, expect: 'scaleY(4.25)'},
{at: 0.5, expect: 'scaleY(4.5)'},
{at: 0.75, expect: 'scaleY(4.75)'},
{at: 1, expect: 'scaleY(5)'},
{at: 1.5, expect: 'scaleY(5.5)'},
]);
test_composition({
property: 'transform',
underlying: 'scaleZ(2)',
accumulateFrom: 'scaleZ(3)',
accumulateTo: 'scaleZ(4)',
}, [
{at: -0.5, expect: 'scaleZ(3.5)'},
{at: 0, expect: 'scaleZ(4)'},
{at: 0.25, expect: 'scaleZ(4.25)'},
{at: 0.5, expect: 'scaleZ(4.5)'},
{at: 0.75, expect: 'scaleZ(4.75)'},
{at: 1, expect: 'scaleZ(5)'},
{at: 1.5, expect: 'scaleZ(5.5)'},
]);
// The scale functions all share the same primitive type (scale3d), so can be
// accumulated between.
test_composition({
property: 'transform',
underlying: 'scale(2, 4)',
accumulateFrom: 'scaleZ(3)',
accumulateTo: 'scaleZ(4)',
}, [
{at: -0.5, expect: 'scale3d(2, 4, 2.5)'},
{at: 0, expect: 'scale3d(2, 4, 3)'},
{at: 0.25, expect: 'scale3d(2, 4, 3.25)'},
{at: 0.5, expect: 'scale3d(2, 4, 3.5)'},
{at: 0.75, expect: 'scale3d(2, 4, 3.75)'},
{at: 1, expect: 'scale3d(2, 4, 4)'},
{at: 1.5, expect: 'scale3d(2, 4, 4.5)'},
]);
</script>
</body>

124
tests/wpt/web-platform-tests/css/css-transforms/animation/transform-skew-composition.html Normal file
View file

@ -0,0 +1,124 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>transform-skew composition</title>
<link rel="help" href="https://drafts.csswg.org/css-transforms/#two-d-transform-functions">
<meta name="assert" content="transform-skew supports animation as a transform list">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/interpolation-testcommon.js"></script>
<body>
<script>
// Addition (aka concatenation) of two skew functions skew(a) and skew(b)
// results in computing tan(a) + tan(b), whereas accumulation results in summing
// the components to get tan(a + b).
// ------------ Addition tests --------------
test_composition({
property: 'transform',
underlying: 'skewX(10deg)',
addFrom: 'skewX(30deg)',
addTo: 'skewX(50deg)',
}, [
{at: -0.5, expect: 'skewX(10deg) skewX(20deg)'},
{at: 0, expect: 'skewX(10deg) skewX(30deg)'},
{at: 0.25, expect: 'skewX(10deg) skewX(35deg)'},
{at: 0.5, expect: 'skewX(10deg) skewX(40deg)'},
{at: 0.75, expect: 'skewX(10deg) skewX(45deg)'},
{at: 1, expect: 'skewX(10deg) skewX(50deg)'},
{at: 1.5, expect: 'skewX(10deg) skewX(60deg)'},
]);
test_composition({
property: 'transform',
underlying: 'skewY(10deg)',
addFrom: 'skewY(30deg)',
addTo: 'skewY(50deg)',
}, [
{at: -0.5, expect: 'skewY(10deg) skewY(20deg)'},
{at: 0, expect: 'skewY(10deg) skewY(30deg)'},
{at: 0.25, expect: 'skewY(10deg) skewY(35deg)'},
{at: 0.5, expect: 'skewY(10deg) skewY(40deg)'},
{at: 0.75, expect: 'skewY(10deg) skewY(45deg)'},
{at: 1, expect: 'skewY(10deg) skewY(50deg)'},
{at: 1.5, expect: 'skewY(10deg) skewY(60deg)'},
]);
test_composition({
property: 'transform',
underlying: 'skew(10deg, 20deg)',
addFrom: 'skew(30deg, 10deg)',
addTo: 'skew(50deg, 50deg)',
}, [
{at: -0.5, expect: 'skew(10deg, 20deg) skew(20deg, -10deg)'},
{at: 0, expect: 'skew(10deg, 20deg) skew(30deg, 10deg)'},
{at: 0.25, expect: 'skew(10deg, 20deg) skew(35deg, 20deg)'},
{at: 0.5, expect: 'skew(10deg, 20deg) skew(40deg, 30deg)'},
{at: 0.75, expect: 'skew(10deg, 20deg) skew(45deg, 40deg)'},
{at: 1, expect: 'skew(10deg, 20deg) skew(50deg, 50deg)'},
{at: 1.5, expect: 'skew(10deg, 20deg) skew(60deg, 70deg)'},
]);
// ------------ Accumulation tests --------------
test_composition({
property: 'transform',
underlying: 'skewX(45deg)',
accumulateFrom: 'skewX(30deg)',
accumulateTo: 'skewX(70deg)',
}, [
{at: -0.5, expect: 'skewX(55deg)'},
{at: 0, expect: 'skewX(75deg)'},
{at: 0.25, expect: 'skewX(85deg)'},
{at: 0.5, expect: 'skewX(95deg)'},
{at: 0.75, expect: 'skewX(105deg)'},
{at: 1, expect: 'skewX(115deg)'},
{at: 1.5, expect: 'skewX(135deg)'},
]);
test_composition({
property: 'transform',
underlying: 'skewY(45deg)',
accumulateFrom: 'skewY(30deg)',
accumulateTo: 'skewY(70deg)',
}, [
{at: -0.5, expect: 'skewY(55deg)'},
{at: 0, expect: 'skewY(75deg)'},
{at: 0.25, expect: 'skewY(85deg)'},
{at: 0.5, expect: 'skewY(95deg)'},
{at: 0.75, expect: 'skewY(105deg)'},
{at: 1, expect: 'skewY(115deg)'},
{at: 1.5, expect: 'skewY(135deg)'},
]);
test_composition({
property: 'transform',
underlying: 'skew(10deg, 45deg)',
accumulateFrom: 'skew(20deg, 30deg)',
accumulateTo: 'skew(40deg, 70deg)',
}, [
{at: -0.5, expect: 'skew(20deg, 55deg)'},
{at: 0, expect: 'skew(30deg, 75deg)'},
{at: 0.25, expect: 'skew(35deg, 85deg)'},
{at: 0.5, expect: 'skew(40deg, 95deg)'},
{at: 0.75, expect: 'skew(45deg, 105deg)'},
{at: 1, expect: 'skew(50deg, 115deg)'},
{at: 1.5, expect: 'skew(60deg, 135deg)'},
]);
// The skew{X,Y} functions DO NOT share the same primitive type, so cannot be
// accumlated between directly. Instead, they fall back to matrix accumulation,
// which this tests for.
test_composition({
property: 'transform',
underlying: 'skewX(45deg)',
accumulateFrom: 'skewY(45deg)',
accumulateTo: 'skewY(45deg)',
}, [
// Note that this is not equivalent to any form of combined skews.
{at: 0.5, expect: 'matrix(1, 1, 0.5, 1.5, 0, 0)'},
]);
</script>
</body>

147
tests/wpt/web-platform-tests/css/css-transforms/animation/transform-translate-composition.html Normal file
View file

@ -0,0 +1,147 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>transform-translate composition</title>
<link rel="help" href="https://drafts.csswg.org/css-transforms/#two-d-transform-functions">
<meta name="assert" content="transform-translate supports animation as a transform list">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/interpolation-testcommon.js"></script>
<body>
<script src="../interpolation/resources/interpolation-test.js"></script>
<script>
// ------------ Addition tests --------------
test_composition({
property: 'transform',
underlying: 'translate(10px, 20px)',
addFrom: 'translate(100px, 200px)',
addTo: 'translate(200px, 400px)',
}, [
{at: -0.5, expect: 'translate(60px, 120px)'},
{at: 0, expect: 'translate(110px, 220px)'},
{at: 0.25, expect: 'translate(135px, 270px)'},
{at: 0.5, expect: 'translate(160px, 320px)'},
{at: 0.75, expect: 'translate(185px, 370px)'},
{at: 1, expect: 'translate(210px, 420px)'},
{at: 1.5, expect: 'translate(260px, 520px)'},
]);
test_composition({
property: 'transform',
underlying: 'translate(10px, 20px)',
addFrom: 'translate(100px, 200px)',
replaceTo: 'translate(210px, 420px)',
}, [
{at: -0.5, expect: 'translate(60px, 120px)'},
{at: 0, expect: 'translate(110px, 220px)'},
{at: 0.25, expect: 'translate(135px, 270px)'},
{at: 0.5, expect: 'translate(160px, 320px)'},
{at: 0.75, expect: 'translate(185px, 370px)'},
{at: 1, expect: 'translate(210px, 420px)'},
{at: 1.5, expect: 'translate(260px, 520px)'},
]);
// When testing translate functions in isolation, the additive and accumulation
// behaviors are functionally identical. This test includes a rotate to ensure
// both methods are implemented; add should append the from/to after the rotate.
test_composition({
property: 'transform',
underlying: 'translateX(100px) rotate(90deg)',
addFrom: 'translateX(100px)',
addTo: 'translateX(200px)',
}, [
{at: -0.5, expect: 'translateX(100px) rotate(90deg) translateX(50px)'},
{at: 0, expect: 'translateX(100px) rotate(90deg) translateX(100px)'},
{at: 0.25, expect: 'translateX(100px) rotate(90deg) translateX(125px)'},
{at: 0.5, expect: 'translateX(100px) rotate(90deg) translateX(150px)'},
{at: 0.75, expect: 'translateX(100px) rotate(90deg) translateX(175px)'},
{at: 1, expect: 'translateX(100px) rotate(90deg) translateX(200px)'},
{at: 1.5, expect: 'translateX(100px) rotate(90deg) translateX(250px)'},
]);
// ------------ Accumulation tests --------------
test_composition({
property: 'transform',
underlying: 'translateX(100px)',
accumulateFrom: 'translateX(50px)',
accumulateTo: 'translateX(250px)',
}, [
{at: -0.5, expect: 'translateX(50px)'},
{at: 0, expect: 'translateX(150px)'},
{at: 0.25, expect: 'translateX(200px)'},
{at: 0.5, expect: 'translateX(250px)'},
{at: 0.75, expect: 'translateX(300px)'},
{at: 1, expect: 'translateX(350px)'},
{at: 1.5, expect: 'translateX(450px)'},
]);
test_composition({
property: 'transform',
underlying: 'translateY(100px)',
accumulateFrom: 'translateY(50px)',
accumulateTo: 'translateY(250px)',
}, [
{at: -0.5, expect: 'translateY(50px)'},
{at: 0, expect: 'translateY(150px)'},
{at: 0.25, expect: 'translateY(200px)'},
{at: 0.5, expect: 'translateY(250px)'},
{at: 0.75, expect: 'translateY(300px)'},
{at: 1, expect: 'translateY(350px)'},
{at: 1.5, expect: 'translateY(450px)'},
]);
test_composition({
property: 'transform',
underlying: 'translateZ(100px)',
accumulateFrom: 'translateZ(50px)',
accumulateTo: 'translateZ(250px)',
}, [
{at: -0.5, expect: 'translateZ(50px)'},
{at: 0, expect: 'translateZ(150px)'},
{at: 0.25, expect: 'translateZ(200px)'},
{at: 0.5, expect: 'translateZ(250px)'},
{at: 0.75, expect: 'translateZ(300px)'},
{at: 1, expect: 'translateZ(350px)'},
{at: 1.5, expect: 'translateZ(450px)'},
]);
// The translate functions all share the same primitive type (translate3d), so
// can be accumulated between.
test_composition({
property: 'transform',
underlying: 'translate(100px, 50px)',
accumulateFrom: 'translateZ(50px)',
accumulateTo: 'translateZ(250px)',
}, [
{at: -0.5, expect: 'translate3d(100px, 50px, -50px)'},
{at: 0, expect: 'translate3d(100px, 50px, 50px)'},
{at: 0.25, expect: 'translate3d(100px, 50px, 100px)'},
{at: 0.5, expect: 'translate3d(100px, 50px, 150px)'},
{at: 0.75, expect: 'translate3d(100px, 50px, 200px)'},
{at: 1, expect: 'translate3d(100px, 50px, 250px)'},
{at: 1.5, expect: 'translate3d(100px, 50px, 350px)'},
]);
// When testing translate functions in isolation, the additive and accumulation
// behaviors are functionally identical. This test includes a rotate to ensure
// both methods are implemented; accumulate should combine the transform before
// the rotate.
test_composition({
property: 'transform',
underlying: 'translateX(100px) rotate(90deg)',
accumulateFrom: 'translateX(100px)',
accumulateTo: 'translateX(200px)',
}, [
{at: -0.5, expect: 'translateX(150px) rotate(90deg)'},
{at: 0, expect: 'translateX(200px) rotate(90deg)'},
{at: 0.25, expect: 'translateX(225px) rotate(90deg)'},
{at: 0.5, expect: 'translateX(250px) rotate(90deg)'},
{at: 0.75, expect: 'translateX(275px) rotate(90deg)'},
{at: 1, expect: 'translateX(300px) rotate(90deg)'},
{at: 1.5, expect: 'translateX(350px) rotate(90deg)'},
]);
</script>
</body>

147
tests/wpt/web-platform-tests/css/css-transforms/animation/translate-composition.html Normal file
View file

@ -0,0 +1,147 @@
<!DOCTYPE html>
<meta charset="utf-8">
<title>translate composition</title>
<link rel="help" href="https://drafts.csswg.org/css-transforms-2/#propdef-translate">
<meta name="assert" content="translate supports <length> and <percentage> animation.">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/interpolation-testcommon.js"></script>
<body>
<style>
.target {
width: 100px;
height: 100px;
}
</style>
<script>
test_composition({
property: 'translate',
underlying: '100px 200px 300px',
addFrom: '-50px 50%',
addTo: '100%',
}, [
{at: -1, expect: '-100% calc(200px + 100%) 300px'},
{at: 0, expect: 'calc(50px + 0%) calc(200px + 50%) 300px'},
{at: 0.25, expect: 'calc(62.5px + 25%) calc(200px + 37.5%) 300px'},
{at: 0.75, expect: 'calc(87.5px + 75%) calc(200px + 12.5%) 300px'},
{at: 1, expect: 'calc(100px + 100%) calc(200px + 0%) 300px'},
{at: 2, expect: 'calc(150px + 200%) calc(200px - 50%) 300px'},
]);
test_composition({
property: 'translate',
underlying: '100px 200px 300px',
addFrom: '50% 100px',
replaceTo: '200px 50% 100px',
}, [
{at: -1, expect: '100% calc(600px - 50%) 500px'},
{at: 0, expect: 'calc(100px + 50%) calc(300px + 0%) 300px'},
{at: 0.25, expect: 'calc(125px + 37.5%) calc(225px + 12.5%) 250px'},
{at: 0.75, expect: 'calc(175px + 12.5%) calc(75px + 37.5%) 150px'},
{at: 1, expect: 'calc(200px + 0%) 50% 100px'},
{at: 2, expect: 'calc(300px - 50%) calc(-300px + 100%) -100px'},
]);
test_composition({
property: 'translate',
underlying: '100px 200px 300px',
replaceFrom: '50% 100px',
addTo: '200px 50% 100px',
}, [
{at: -1, expect: 'calc(-300px + 100%) -50% -400px'},
{at: 0, expect: '50% calc(100px + 0%)'},
{at: 0.25, expect: 'calc(75px + 37.5%) calc(125px + 12.5%) 100px'},
{at: 0.75, expect: 'calc(225px + 12.5%) calc(175px + 37.5%) 300px'},
{at: 1, expect: 'calc(300px + 0%) calc(200px + 50%) 400px'},
{at: 2, expect: 'calc(600px - 50%) calc(300px + 100%) 800px'},
]);
test_composition({
property: 'translate',
underlying: 'none',
replaceFrom: 'none',
addTo: '100px',
}, [
{at: -1, expect: '-100px'},
{at: 0, expect: 'none'},
{at: 0.25, expect: '25px'},
{at: 0.75, expect: '75px'},
{at: 1, expect: '100px'},
{at: 2, expect: '200px'},
]);
test_composition({
property: 'translate',
underlying: 'none',
addFrom: 'none',
addTo: '100px',
}, [
{at: -1, expect: '-100px'},
{at: 0, expect: 'none'},
{at: 0.25, expect: '25px'},
{at: 0.75, expect: '75px'},
{at: 1, expect: '100px'},
{at: 2, expect: '200px'},
]);
test_composition({
property: 'translate',
underlying: 'none',
replaceFrom: '0px 40px 60px',
replaceTo: 'none',
}, [
{at: -1, expect: '0px 80px 120px'},
{at: 0, expect: '0px 40px 60px'},
{at: 0.25, expect: '0px 30px 45px'},
{at: 0.75, expect: '0px 10px 15px'},
{at: 1, expect: 'none'},
{at: 2, expect: '0px -40px -60px'},
]);
test_composition({
property: 'translate',
underlying: 'none',
replaceFrom: '0px 40px 60px',
addTo: 'none',
}, [
{at: -1, expect: '0px 80px 120px'},
{at: 0, expect: '0px 40px 60px'},
{at: 0.25, expect: '0px 30px 45px'},
{at: 0.75, expect: '0px 10px 15px'},
{at: 1, expect: 'none'},
{at: 2, expect: '0px -40px -60px'},
]);
test_composition({
property: 'translate',
underlying: '80px 20px',
addFrom: 'none',
replaceTo: '0px 40px 60px',
}, [
{at: -1, expect: '160px 0px -60px'},
{at: 0, expect: '80px 20px'},
{at: 0.25, expect: '60px 25px 15px'},
{at: 0.5, expect: '40px 30px 30px'},
{at: 0.75, expect: '20px 35px 45px'},
{at: 1, expect: '0px 40px 60px'},
{at: 2, expect: '-80px 60px 120px'},
]);
test_composition({
property: 'translate',
underlying: '80px 20px',
addFrom: '0px 40px 60px',
replaceTo: 'none',
}, [
{at: -1, expect: '160px 120px 120px'},
{at: 0, expect: '80px 60px 60px'},
{at: 0.25, expect: '60px 45px 45px'},
{at: 0.5, expect: '40px 30px 30px'},
{at: 0.75, expect: '20px 15px 15px'},
{at: 1, expect: 'none'},
{at: 2, expect: '-80px -60px -60px'},
]);
</script>
</body>

65
tests/wpt/web-platform-tests/css/css-transitions/animations/vertical-align-composition.html Normal file
View file

@ -0,0 +1,65 @@
<!DOCTYPE html>
<meta charset="UTF-8">
<title>vertical-align composition</title>
<link rel="help" href="https://www.w3.org/TR/CSS2/visudet.html#propdef-vertical-align">
<meta name="assert" content="vertical-align supports animation">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/interpolation-testcommon.js"></script>
<body>
<script>
test_composition({
property: 'vertical-align',
underlying: '50px',
addFrom: '100px',
addTo: '200px',
}, [
{at: -0.3, expect: '120px'},
{at: 0, expect: '150px'},
{at: 0.5, expect: '200px'},
{at: 1, expect: '250px'},
{at: 1.5, expect: '300px'},
]);
test_composition({
property: 'vertical-align',
underlying: '100px',
addFrom: '10px',
addTo: '2px',
}, [
{at: -0.5, expect: '114px'},
{at: 0, expect: '110px'},
{at: 0.5, expect: '106px'},
{at: 1, expect: '102px'},
{at: 1.5, expect: '98px'},
]);
test_composition({
property: 'vertical-align',
underlying: '10%',
addFrom: '100px',
addTo: '20%',
}, [
{at: -0.3, expect: 'calc(130px + 4%)'},
{at: 0, expect: 'calc(100px + 10%)'},
{at: 0.5, expect: 'calc(50px + 20%)'},
{at: 1, expect: '30%'},
{at: 1.5, expect: 'calc(-50px + 40%)'},
]);
test_composition({
property: 'vertical-align',
underlying: '50px',
addFrom: '100px',
replaceTo: '200px',
}, [
{at: -0.3, expect: '135px'},
{at: 0, expect: '150px'},
{at: 0.5, expect: '175px'},
{at: 1, expect: '200px'},
{at: 1.5, expect: '225px'},
]);
</script>
</body>

34
tests/wpt/web-platform-tests/fetch/metadata/appcache.tentative.https.sub.html
View file

@ -1,34 +0,0 @@
<!DOCTYPE html>
<html manifest="/fetch/metadata/resources/record-header.py?file=appcache-manifest{{$id:uuid()}}">
<meta name="timeout" content="long">
<script src=/resources/testharness.js></script>
<script src=/resources/testharnessreport.js></script>
<script src=/fetch/metadata/resources/helper.js></script>
<script src=/common/utils.js></script>
<body></body>
<script>
async_test(t => {
const expected = {"site": "same-origin", "user": "", "mode": "no-cors", "dest": "empty"};
window.applicationCache.oncached = window.applicationCache.onnoupdate = window.applicationCache.onerror = t.step_func(async e => {
try {
let response = await fetch(
"/fetch/metadata/resources/record-header.py?retrieve=true&file=appcache-manifest{{$id}}");
let text = await response.text();
assert_header_equals(text, expected, "Appcache manifest");
response = await fetch(
"/fetch/metadata/resources/record-header.py?retrieve=true&file=appcache-resource{{$id}}");
text = await response.text();
assert_header_equals(text, expected, "Appcache resource");
} catch (e) {
t.step(e => {
if (e instanceof AssertionError) {
throw e;
}
assert_unreached(`Unhandled rejection with value: ${e}`);
});
}
t.done();
});
}, "Appcache!");
</script>

6
tests/wpt/web-platform-tests/fetch/metadata/portal.tentative.https.sub.html
View file

@ -30,20 +30,20 @@
"site": "same-origin",
"user": "",
"mode": "navigate",
"dest": "document"
"dest": "iframe"
});
create_test("{{hosts[][www]}}:{{ports[https][0]}}", {
"site": "same-site",
"user": "",
"mode": "navigate",
"dest": "document"
"dest": "iframe"
});
create_test("{{hosts[alt][www]}}:{{ports[https][0]}}", {
"site": "cross-site",
"user": "",
"mode": "navigate",
"dest": "document"
"dest": "iframe"
});
</script>

9
tests/wpt/web-platform-tests/fetch/metadata/resources/record-header.py
View file

@ -99,8 +99,13 @@ def main(request, response):
file.close()
return video
## Return a valid style content and Content-Type ##
if key.startswith("style") or key.startswith("embed") or key.startswith("object"):
## Return valid style content and Content-Type ##
if key.startswith("style"):
response.headers.set("Content-Type", "text/css")
return "div { }"
## Return a valid embed/object content and Content-Type ##
if key.startswith("embed") or key.startswith("object"):
response.headers.set("Content-Type", "text/html")
return "<html>EMBED!</html>"

14
tests/wpt/web-platform-tests/html/cross-origin-opener-policy/coep-navigate-popup.https.html
View file

@ -32,14 +32,14 @@
"opener": false
},
{
"title": "coop unsafe-inherit/coep",
"coop": "unsafe-inherit",
"title": "coop unsafe-none/coep",
"coop": "unsafe-none",
"coep": "require-corp",
"opener": true
},
{
"title": "coop unsafe-inherit/no coep",
"coop": "unsafe-inherit",
"title": "coop unsafe-none/no coep",
"coop": "unsafe-none",
"coep": "",
"opener": false
}
@ -53,9 +53,9 @@
async_test(t => {
// For each test we open a COOP: same-origin/COEP: require-corp document in a popup and then
// navigate that to either a same-origin or same-site document whose COOP and COEP are set as
// per the top-most array. We then verify that this document has the correct opener for its
// specific setup.
// navigate that to either a same-origin (site=="same-origin") or same-site (site=="same-site")
// document whose COOP and COEP are set as per the top-most array. We then verify that this
// document has the correct opener for its specific setup.
url_test(t, `${SAME_ORIGIN.origin}/html/cross-origin-opener-policy/resources/coop-coep.py?coop=same-origin&coep=require-corp&navigate=${encodeURIComponent(navigateURL)}`, channel, opener);
}, title);
});

11
tests/wpt/web-platform-tests/html/cross-origin-opener-policy/coep-redirect.https.html
View file

@ -1,5 +1,6 @@
<!doctype html>
<title>Cross-Origin-Opener-Policy and Cross-Origin-Embedder-Policy: redirects</title>
<meta content=timeout value=long>
<script src=/resources/testharness.js></script>
<script src=/resources/testharnessreport.js></script>
<script src="/common/get-host-info.sub.js"></script>
@ -41,18 +42,18 @@ const coopCOEPPath = new URL("resources/coop-coep.py", window.location).pathname
"opener": false
},
{
"title": "coop unsafe-inherit/coep to coop/coep",
"redirectCOOP": "unsafe-inherit",
"title": "coop unsafe-none/coep to coop/coep",
"redirectCOOP": "unsafe-none",
"redirectCOEP": "require-corp",
"coop": "same-origin",
"coep": "require-corp",
"opener": true
},
{
"title": "coop unsafe-inherit/coep to coop unsafe-inherit/coep",
"redirectCOOP": "unsafe-inherit",
"title": "coop unsafe-none/coep to coop unsafe-inherit/coep",
"redirectCOOP": "unsafe-none",
"redirectCOEP": "require-corp",
"coop": "unsafe-inherit",
"coop": "unsafe-none",
"coep": "require-corp",
"opener": true
}

13
tests/wpt/web-platform-tests/html/cross-origin-opener-policy/coep.https.html
View file

@ -1,5 +1,6 @@
<!doctype html>
<title>Cross-Origin-Opener-Policy and Cross-Origin-Embedder-Policy</title>
<meta content=timeout value=long>
<script src=/resources/testharness.js></script>
<script src=/resources/testharnessreport.js></script>
<script src="/common/get-host-info.sub.js"></script>
@ -13,14 +14,14 @@
"opener": true
},
{
"title": "popup with coop unsafe-inherit/coep",
"coop": "unsafe-inherit",
"title": "popup with coop unsafe-none/coep",
"coop": "unsafe-none",
"coep": "require-corp",
"opener": true
},
{
"title": "popup with coop unsafe-inherit without coep",
"coop": "unsafe-inherit",
"title": "popup with coop unsafe-none without coep",
"coop": "unsafe-none",
"coep": "",
"opener": false
},
@ -35,10 +36,10 @@
coop_coep_test(t, SAME_ORIGIN, variant.coop, variant.coep, variant.title.replace(/ /g,"-"), variant.opener);
}, `Same-origin ${variant.title}`);
// This seems useful to test, CROSS_SITE is probably too redundant though.
// "same-site" is a historical value, equivalent to "unsafe-none"
async_test(t => {
coop_coep_test(t, SAME_SITE, variant.coop, variant.coep, `same-site-${variant.title.replace(/ /g,"-")}`, false);
}, `Same-site ${variant.title}`);
}, `historical: "same-site" ${variant.title}`);
});
test(() => {

2
tests/wpt/web-platform-tests/html/cross-origin-opener-policy/coop-navigated-popup.https.html
View file

@ -1,7 +1,7 @@
<!doctype html>
<title>Cross-Origin-Opener-Policy: a navigated popup</title>
<!-- In particular this is different from coep-navigate-popup.https.html as this document initiates
the navigation (and uses unsafe-allow-outgoing and no COEP as without that it cannot be
the navigation (and uses same-origin-allow-popups and no COEP as without that it cannot be
observed). COOP should work identically, but implementations might have used the wrong
authority. -->
<script src=/resources/testharness.js></script>

2
tests/wpt/web-platform-tests/html/cross-origin-opener-policy/coop-navigated-popup.https.html.headers
View file

@ -1 +1 @@
Cross-Origin-Opener-Policy: same-origin unsafe-allow-outgoing
Cross-Origin-Opener-Policy: same-origin-allow-popups

8
tests/wpt/web-platform-tests/html/cross-origin-opener-policy/coop-sandbox.https.html
View file

@ -15,8 +15,10 @@ async_test(t => {
const popup = window.open("resources/coop-coep.py?coop=same-origin&coep=&channel=${channel.name}");
<\/script>`;
document.body.append(frame);
t.step_timeout(() => {
t.done()
}, 500);
window.onload = t.step_func(() => {
t.step_timeout(() => {
t.done()
}, 1500);
});
});
</script>

39
tests/wpt/web-platform-tests/html/cross-origin-opener-policy/historical/coep-navigate-popup-unsafe-inherit.https.html Normal file
View file

@ -0,0 +1,39 @@
<!doctype html>
<title>Historical: Cross-Origin-Opener-Policy and Cross-Origin-Embedder-Policy: a navigating popup</title>
<meta content=timeout value=long>
<script src=/resources/testharness.js></script>
<script src=/resources/testharnessreport.js></script>
<script src="/common/get-host-info.sub.js"></script>
<script src="../resources/common.js"></script>
<script>
[
{
"title": "coop unsafe-inherit/coep",
"coop": "unsafe-inherit", // historical value, equivalent to "unsafe-none"
"coep": "require-corp",
"opener": true
},
{
"title": "coop unsafe-inherit/no coep",
"coop": "unsafe-inherit", // historical value, equivalent to "unsafe-none"
"coep": "",
"opener": false
}
].forEach(variant => {
["same-origin", "same-site"].forEach(site => {
const title = `Popup navigating to ${site} with ${variant.title}`;
const channel = title.replace(/ /g,"-");
const navigateHost = site === "same-origin" ? SAME_ORIGIN : SAME_SITE;
const navigateURL = `${navigateHost.origin}/html/cross-origin-opener-policy/resources/coop-coep.py?coop=${variant.coop}&coep=${variant.coep}&channel=${channel}`;
const opener = site === "same-origin" ? variant.opener : false;
async_test(t => {
// For each test we open a COOP: same-origin/COEP: require-corp document in a popup and then
// navigate that to either a document with same origin (site=="same-origin") or
// not-same-origin (site=="same-site") whose COOP and COEP are set as per the top-most array.
// We then verify that this document has the correct opener for its specific setup.
url_test(t, `${SAME_ORIGIN.origin}/html/cross-origin-opener-policy/resources/coop-coep.py?coop=same-origin&coep=require-corp&navigate=${encodeURIComponent(navigateURL)}`, channel, opener);
}, title);
});
});
</script>

26
tests/wpt/web-platform-tests/html/cross-origin-opener-policy/historical/popup-same-origin-unsafe-allow-outgoing-with-cross-origin.https.html Normal file
View file

@ -0,0 +1,26 @@
<!doctype html>
<meta charset=utf-8>
<meta content=timeout value=long>
<script src=/resources/testharness.js></script>
<script src=/resources/testharnessreport.js></script>
<script src="/common/get-host-info.sub.js"></script>
<script src="../resources/common.js"></script>
<div id=log></div>
<script>
let tests = [
// popup Origin, popup COOP, expect opener
[CROSS_ORIGIN, "", true],
[CROSS_ORIGIN, "unsafe-none", true],
[CROSS_ORIGIN, "jibberish", true],
[CROSS_ORIGIN, "same-site", true], // historical value, equivalent to "unsafe-none"
[CROSS_ORIGIN, "same-site unsafe-allow-outgoing", true], // historical value, equivalent to "unsafe-none"
[CROSS_ORIGIN, "same-origin unsafe-allow-outgoing", true], // historical value, equivalent to "unsafe-none"
[CROSS_ORIGIN, "same-origin", false],
[CROSS_ORIGIN, "same-origin-allow-popups", false],
];
run_coop_tests("same-origin unsafe-allow-outgoing", tests); // historical value, equivalent to "unsafe-none"
</script>

0
tests/wpt/web-platform-tests/html/cross-origin-opener-policy/popup-same-origin-unsafe-allow-outgoing.https.html.headers → tests/wpt/web-platform-tests/html/cross-origin-opener-policy/historical/popup-same-origin-unsafe-allow-outgoing-with-cross-origin.https.html.headers
View file

26
tests/wpt/web-platform-tests/html/cross-origin-opener-policy/historical/popup-same-origin-unsafe-allow-outgoing-with-same-origin.https.html Normal file
View file

@ -0,0 +1,26 @@
<!doctype html>
<meta charset=utf-8>
<meta content=timeout value=long>
<script src=/resources/testharness.js></script>
<script src=/resources/testharnessreport.js></script>
<script src="/common/get-host-info.sub.js"></script>
<script src="../resources/common.js"></script>
<div id=log></div>
<script>
let tests = [
// popup Origin, popup COOP, expect opener
[SAME_ORIGIN, "", true],
[SAME_ORIGIN, "unsafe-none", true],
[SAME_ORIGIN, "jibberish", true],
[SAME_ORIGIN, "same-site", true], // historical value, equivalent to "unsafe-none"
[SAME_ORIGIN, "same-site unsafe-allow-outgoing", true], // historical value, equivalent to "unsafe-none"
[SAME_ORIGIN, "same-origin unsafe-allow-outgoing", true], // historical value, equivalent to "unsafe-none"
[SAME_ORIGIN, "same-origin", false],
[SAME_ORIGIN, "same-origin-allow-popups", false],
];
run_coop_tests("same-origin unsafe-allow-outgoing", tests); // historical value, equivalent to "unsafe-none"
</script>

1
tests/wpt/web-platform-tests/html/cross-origin-opener-policy/historical/popup-same-origin-unsafe-allow-outgoing-with-same-origin.https.html.headers Normal file
View file

@ -0,0 +1 @@
Cross-Origin-Opener-Policy: same-origin unsafe-allow-outgoing

26
tests/wpt/web-platform-tests/html/cross-origin-opener-policy/historical/popup-same-origin-unsafe-allow-outgoing-with-same-site.https.html Normal file
View file

@ -0,0 +1,26 @@
<!doctype html>
<meta charset=utf-8>
<meta content=timeout value=long>
<script src=/resources/testharness.js></script>
<script src=/resources/testharnessreport.js></script>
<script src="/common/get-host-info.sub.js"></script>
<script src="../resources/common.js"></script>
<div id=log></div>
<script>
let tests = [
// popup Origin, popup COOP, expect opener
[SAME_SITE, "", true],
[SAME_SITE, "unsafe-none", true],
[SAME_SITE, "jibberish", true],
[SAME_SITE, "same-site", true], // historical value, equivalent to "unsafe-none"
[SAME_SITE, "same-site unsafe-allow-outgoing", true], // historical value, equivalent to "unsafe-none"
[SAME_SITE, "same-origin unsafe-allow-outgoing", true], // historical value, equivalent to "unsafe-none"
[SAME_SITE, "same-origin", false],
[SAME_SITE, "same-origin-allow-popups", false],
];
run_coop_tests("same-origin unsafe-allow-outgoing", tests); // historical value, equivalent to "unsafe-none"
</script>

1
tests/wpt/web-platform-tests/html/cross-origin-opener-policy/historical/popup-same-origin-unsafe-allow-outgoing-with-same-site.https.html.headers Normal file
View file

@ -0,0 +1 @@
Cross-Origin-Opener-Policy: same-origin unsafe-allow-outgoing

26
tests/wpt/web-platform-tests/html/cross-origin-opener-policy/historical/popup-same-site-unsafe-allow-outgoing-with-cross-origin.https.html Normal file
View file

@ -0,0 +1,26 @@
<!doctype html>
<meta charset=utf-8>
<meta content=timeout value=long>
<script src=/resources/testharness.js></script>
<script src=/resources/testharnessreport.js></script>
<script src="/common/get-host-info.sub.js"></script>
<script src="../resources/common.js"></script>
<div id=log></div>
<script>
let tests = [
// popup Origin, popup COOP, expect opener
[CROSS_ORIGIN, "", true],
[CROSS_ORIGIN, "unsafe-none", true],
[CROSS_ORIGIN, "jibberish", true],
[CROSS_ORIGIN, "same-site", true], // historical value, equivalent to "unsafe-none"
[CROSS_ORIGIN, "same-site unsafe-allow-outgoing", true], // historical value, equivalent to "unsafe-none"
[CROSS_ORIGIN, "same-origin unsafe-allow-outgoing", true], // historical value, equivalent to "unsafe-none"
[CROSS_ORIGIN, "same-origin", false],
[CROSS_ORIGIN, "same-origin-allow-popups", false],
];
run_coop_tests("same-site unsafe-allow-outgoing", tests); // historical value, equivalent to "unsafe-none"
</script>

Some files were not shown because too many files have changed in this diff Show more