Skip to content

GitLab

T
tangled
Commit 25797c4b authored by Stephen McGruer's avatar Stephen McGruer Committed by Commit Bot
Browse files
Options

Port some css-fonts-{3,4} interpolation tests to WPT 

Bug: 900581
Change-Id: Ib27f3df1a5aeb76ba8e24b5b1040a75efb7a1f6b
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1760139Reviewed-by: default avatarXida Chen <xidachen@chromium.org>
Commit-Queue: Stephen McGruer <smcgruer@chromium.org>
Cr-Commit-Position: refs/heads/master@{#688144}
parent a06c2de7
Hide whitespace changes
Inline Side-by-side
Showing with 454 additions and 0 deletions
third_party/blink/web_tests/animations/interpolation/font-size-adjust-interpolation.html → third_party/blink/web_tests/external/wpt/css/css-fonts/animations/font-size-adjust-interpolation.html
View file @ 25797c4b
<!DOCTYPE html> <!DOCTYPE html>
<meta charset="UTF-8">
<title>font-size-adjust interpolation</title>
<link rel="help" href="https://drafts.csswg.org/css-fonts-3/#propdef-font-size-adjust">
<meta name="assert" content="font-size-adjust supports animation as a number">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/interpolation-testcommon.js"></script>
<style type="text/css"> <style type="text/css">
.container { .container {
font-size: 20px; font-size: 20px;
line-height: 1; line-height: 1;
} }
@font-face {
font-family : 'testFont';
src : url('../../resources/opensans/OpenSans-Regular.woff') format("woff");
}
.parent { .parent {
font-size-adjust: 3; font-size-adjust: 3;
} }
.target { .target {
display: inline-block; display: inline-block;
font-family: testFont;
font-size-adjust: 1; font-size-adjust: 1;
} }
...@@ -26,93 +29,95 @@ ...@@ -26,93 +29,95 @@
} }
</style> </style>
<body>
<template id="target-template"> <template id="target-template">
<span class="container"> <span class="container">
<div class="target">x</span> <div class="target">x</span>
</div> </div>
</template> </template>
<script src="resources/interpolation-test.js"></script> </body>
<script> <script>
assertInterpolation({ test_interpolation({
property: 'font-size-adjust', property: 'font-size-adjust',
from: neutralKeyframe, from: neutralKeyframe,
to: '2', to: '2',
}, [ }, [
{at: -2, is: '0'}, {at: -2, expect: '0'},
{at: -0.3, is: '0.7'}, {at: -0.3, expect: '0.7'},
{at: 0, is: '1'}, {at: 0, expect: '1'},
{at: 0.3, is: '1.3'}, {at: 0.3, expect: '1.3'},
{at: 0.6, is: '1.6'}, {at: 0.6, expect: '1.6'},
{at: 1, is: '2'}, {at: 1, expect: '2'},
{at: 1.5, is: '2.5'}, {at: 1.5, expect: '2.5'},
]); ]);
assertNoInterpolation({ test_no_interpolation({
property: 'font-size-adjust', property: 'font-size-adjust',
from: 'initial', from: 'initial',
to: '2', to: '2',
}); });
assertInterpolation({ test_interpolation({
property: 'font-size-adjust', property: 'font-size-adjust',
from: 'inherit', from: 'inherit',
to: '2', to: '2',
}, [ }, [
{at: -2, is: '5'}, {at: -2, expect: '5'},
{at: -0.3, is: '3.3'}, {at: -0.3, expect: '3.3'},
{at: 0, is: '3'}, {at: 0, expect: '3'},
{at: 0.3, is: '2.7'}, {at: 0.3, expect: '2.7'},
{at: 0.6, is: '2.4'}, {at: 0.6, expect: '2.4'},
{at: 1, is: '2'}, {at: 1, expect: '2'},
{at: 1.5, is: '1.5'}, {at: 1.5, expect: '1.5'},
]); ]);
assertInterpolation({ test_interpolation({
property: 'font-size-adjust', property: 'font-size-adjust',
from: 'unset', from: 'unset',
to: '2', to: '2',
}, [ }, [
{at: -2, is: '5'}, {at: -2, expect: '5'},
{at: -0.3, is: '3.3'}, {at: -0.3, expect: '3.3'},
{at: 0, is: '3'}, {at: 0, expect: '3'},
{at: 0.3, is: '2.7'}, {at: 0.3, expect: '2.7'},
{at: 0.6, is: '2.4'}, {at: 0.6, expect: '2.4'},
{at: 1, is: '2'}, {at: 1, expect: '2'},
{at: 1.5, is: '1.5'}, {at: 1.5, expect: '1.5'},
]); ]);
assertInterpolation({ test_interpolation({
property: 'font-size-adjust', property: 'font-size-adjust',
from: '0', from: '0',
to: '1.2' to: '1.2'
}, [ }, [
{at: -2, is: '0'}, {at: -2, expect: '0'},
{at: -0.3, is: '0'}, {at: -0.3, expect: '0'},
{at: 0, is: '0'}, {at: 0, expect: '0'},
{at: 0.3, is: '0.36'}, {at: 0.3, expect: '0.36'},
{at: 0.6, is: '0.72'}, {at: 0.6, expect: '0.72'},
{at: 1, is: '1.2'}, {at: 1, expect: '1.2'},
{at: 1.5, is: '1.8'}, {at: 1.5, expect: '1.8'},
]); ]);
assertNoInterpolation({ test_no_interpolation({
property: 'font-size-adjust', property: 'font-size-adjust',
from: 'none', from: 'none',
to: '1.2' to: '1.2'
}); });
assertInterpolation({ test_interpolation({
property: 'font-size-adjust', property: 'font-size-adjust',
from: '0.2', from: '0.2',
to: '1.2' to: '1.2'
}, [ }, [
{at: -2, is: '0'}, // CSS font-size-adjust can't be negative. {at: -2, expect: '0'}, // CSS font-size-adjust can't be negative.
{at: -0.3, is: '0'}, {at: -0.3, expect: '0'},
{at: 0, is: '0.2'}, {at: 0, expect: '0.2'},
{at: 0.3, is: '0.5'}, {at: 0.3, expect: '0.5'},
{at: 0.6, is: '0.8'}, {at: 0.6, expect: '0.8'},
{at: 1, is: '1.2'}, {at: 1, expect: '1.2'},
{at: 1.5, is: '1.7'}, {at: 1.5, expect: '1.7'},
]); ]);
</script> </script>
third_party/blink/web_tests/animations/interpolation/font-size-interpolation.html → third_party/blink/web_tests/external/wpt/css/css-fonts/animations/font-size-interpolation-001.html
View file @ 25797c4b
<!DOCTYPE html> <!DOCTYPE html>
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>font-size interpolation</title>
<link rel="help" href="https://drafts.csswg.org/css-fonts-3/#propdef-font-size">
<meta name="assert" content="font-size supports animation as length">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/interpolation-testcommon.js"></script>
<style> <style>
.parent { .parent {
font-size: 30px; font-size: 30px;
...@@ -13,82 +21,83 @@ ...@@ -13,82 +21,83 @@
margin-right: 30px; margin-right: 30px;
} }
</style> </style>
<body> <body>
<template id="target-template"> <template id="target-template">
<span> <span>
<div class="target">Test Text</div> <div class="target">Test Text</div>
</span> </span>
</template> </template>
<script src="resources/interpolation-test.js"></script> </body>
<script> <script>
assertInterpolation({ test_interpolation({
property: 'font-size', property: 'font-size',
from: neutralKeyframe, from: neutralKeyframe,
to: '20px', to: '20px',
}, [ }, [
{at: -2, is: '0px'}, {at: -2, expect: '0px'},
{at: -0.3, is: '7px'}, {at: -0.3, expect: '7px'},
{at: 0, is: '10px'}, {at: 0, expect: '10px'},
{at: 0.3, is: '13px'}, {at: 0.3, expect: '13px'},
{at: 0.6, is: '16px'}, {at: 0.6, expect: '16px'},
{at: 1, is: '20px'}, {at: 1, expect: '20px'},
{at: 1.5, is: '25px'}, {at: 1.5, expect: '25px'},
]); ]);
assertInterpolation({ test_interpolation({
property: 'font-size', property: 'font-size',
from: 'initial', from: 'initial',
to: '20px', to: '20px',
}, [ }, [
{at: -2, is: '8px'}, {at: -2, expect: '8px'},
{at: -0.3, is: '14.8px'}, {at: -0.3, expect: '14.8px'},
{at: 0, is: '16px'}, {at: 0, expect: '16px'},
{at: 0.3, is: '17.2px'}, {at: 0.3, expect: '17.2px'},
{at: 0.6, is: '18.4px'}, {at: 0.6, expect: '18.4px'},
{at: 1, is: '20px'}, {at: 1, expect: '20px'},
{at: 1.5, is: '22px'}, {at: 1.5, expect: '22px'},
]); ]);
assertInterpolation({ test_interpolation({
property: 'font-size', property: 'font-size',
from: 'inherit', from: 'inherit',
to: '20px', to: '20px',
}, [ }, [
{at: -2, is: '50px'}, {at: -2, expect: '50px'},
{at: -0.3, is: '33px'}, {at: -0.3, expect: '33px'},
{at: 0, is: '30px'}, {at: 0, expect: '30px'},
{at: 0.3, is: '27px'}, {at: 0.3, expect: '27px'},
{at: 0.6, is: '24px'}, {at: 0.6, expect: '24px'},
{at: 1, is: '20px'}, {at: 1, expect: '20px'},
{at: 1.5, is: '15px'}, {at: 1.5, expect: '15px'},
]); ]);
assertInterpolation({ test_interpolation({
property: 'font-size', property: 'font-size',
from: 'unset', from: 'unset',
to: '20px', to: '20px',
}, [ }, [
{at: -2, is: '50px'}, {at: -2, expect: '50px'},
{at: -0.3, is: '33px'}, {at: -0.3, expect: '33px'},
{at: 0, is: '30px'}, {at: 0, expect: '30px'},
{at: 0.3, is: '27px'}, {at: 0.3, expect: '27px'},
{at: 0.6, is: '24px'}, {at: 0.6, expect: '24px'},
{at: 1, is: '20px'}, {at: 1, expect: '20px'},
{at: 1.5, is: '15px'}, {at: 1.5, expect: '15px'},
]); ]);
assertInterpolation({ test_interpolation({
property: 'font-size', property: 'font-size',
from: '4px', from: '4px',
to: '14px' to: '14px'
}, [ }, [
{at: -2, is: '0px'}, // CSS font-size can't be negative. {at: -2, expect: '0px'}, // CSS font-size can't be negative.
{at: -0.3, is: '1px'}, {at: -0.3, expect: '1px'},
{at: 0, is: '4px'}, {at: 0, expect: '4px'},
{at: 0.3, is: '7px'}, {at: 0.3, expect: '7px'},
{at: 0.6, is: '10px'}, {at: 0.6, expect: '10px'},
{at: 1, is: '14px'}, {at: 1, expect: '14px'},
{at: 1.5, is: '19px'}, {at: 1.5, expect: '19px'},
]); ]);
</script> </script>
</body>
third_party/blink/web_tests/animations/interpolation/font-size-interpolation-unset.html → third_party/blink/web_tests/external/wpt/css/css-fonts/animations/font-size-interpolation-002.html
View file @ 25797c4b
<!DOCTYPE html> <!DOCTYPE html>
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>font-size interpolation</title>
<link rel="help" href="https://drafts.csswg.org/css-fonts-3/#propdef-font-size">
<meta name="assert" content="font-size supports animation as length">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/interpolation-testcommon.js"></script>
<style> <style>
.container { .container {
font-size: 10px; font-size: 10px;
...@@ -14,26 +22,28 @@ ...@@ -14,26 +22,28 @@
margin-right: 30px; margin-right: 30px;
} }
</style> </style>
<body> <body>
<template id="target-template"> <template id="target-template">
<span class="container"> <span class="container">
<div class="target">TT</div> <div class="target">TT</div>
</span> </span>
</template> </template>
<script src="resources/interpolation-test.js"></script> </body>
<script> <script>
assertInterpolation({ // Test the 'unset' case.
test_interpolation({
property: 'font-size', property: 'font-size',
from: 'unset', from: 'unset',
to: '20px' to: '20px'
}, [ }, [
{at: -2, is: '0px'}, // CSS font-size can't be negative. {at: -2, expect: '0px'}, // CSS font-size can't be negative.
{at: -0.3, is: '7px'}, {at: -0.3, expect: '7px'},
{at: 0, is: '10px'}, {at: 0, expect: '10px'},
{at: 0.3, is: '13px'}, {at: 0.3, expect: '13px'},
{at: 0.6, is: '16px'}, {at: 0.6, expect: '16px'},
{at: 1, is: '20px'}, {at: 1, expect: '20px'},
{at: 1.5, is: '25px'}, {at: 1.5, expect: '25px'},
]); ]);
</script> </script>
</body>
third_party/blink/web_tests/animations/interpolation/font-size-zoom-interpolation.html → third_party/blink/web_tests/external/wpt/css/css-fonts/animations/font-size-interpolation-003.html
View file @ 25797c4b
<!DOCTYPE html> <!DOCTYPE html>
<meta charset="UTF-8">
<title>font-size interpolation with zoom</title>
<link rel="help" href="https://drafts.csswg.org/css-fonts-3/#propdef-font-size">
<meta name="assert" content="font-size supports animation as a length, respecting zoom">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/interpolation-testcommon.js"></script>
<style> <style>
.container { .container {
zoom: 2; zoom: 2;
...@@ -11,24 +20,28 @@ ...@@ -11,24 +20,28 @@
margin-right: 30px; margin-right: 30px;
} }
</style> </style>
<body>
<template id="target-template"> <template id="target-template">
<span class="container"> <span class="container">
<div class="target">TT</div> <div class="target">TT</div>
</span> </span>
</template> </template>
<script src="resources/interpolation-test.js"></script> </body>
<script> <script>
assertInterpolation({ // The container has zoom: 2 applied to it.
test_interpolation({
property: 'font-size', property: 'font-size',
from: '10px', from: '10px',
to: '20px' to: '20px'
}, [ }, [
{at: -2, is: '0px'}, // CSS font-size can't be negative. {at: -2, expect: '0px'}, // CSS font-size can't be negative.
{at: -0.3, is: '7px'}, {at: -0.3, expect: '7px'},
{at: 0, is: '10px'}, {at: 0, expect: '10px'},
{at: 0.3, is: '13px'}, {at: 0.3, expect: '13px'},
{at: 0.6, is: '16px'}, {at: 0.6, expect: '16px'},
{at: 1, is: '20px'}, {at: 1, expect: '20px'},
{at: 1.5, is: '25px'}, {at: 1.5, expect: '25px'},
]); ]);
</script> </script>
third_party/blink/web_tests/animations/interpolation/font-variation-settings-interpolation.html → third_party/blink/web_tests/external/wpt/css/css-fonts/animations/font-variation-settings-interpolation.html
View file @ 25797c4b
<!DOCTYPE html> <!DOCTYPE html>
<body> <meta charset="UTF-8">
<title>font-variation-settings interpolation</title>
<link rel="help" href="https://drafts.csswg.org/css-fonts-4/#propdef-font-variation-settings">
<meta name="assert" content="font-variation-settings supports animation pairwise by 'like' properties">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/css/support/interpolation-testcommon.js"></script>
<style> <style>
.parent { .parent {
font-variation-settings: "test" 30; font-variation-settings: "test" 30;
...@@ -8,115 +16,117 @@ ...@@ -8,115 +16,117 @@
font-variation-settings: "test" 10; font-variation-settings: "test" 10;
} }
</style> </style>
<script src="resources/interpolation-test.js"></script>
<body></body>
<script> <script>
assertInterpolation({ test_interpolation({
property: 'font-variation-settings', property: 'font-variation-settings',
from: neutralKeyframe, from: neutralKeyframe,
to: '"test" 20', to: '"test" 20',
}, [ }, [
{at: -0.5, is: "'test' 5"}, {at: -0.5, expect: "'test' 5"},
{at: 0, is: "'test' 10"}, {at: 0, expect: "'test' 10"},
{at: 0.3, is: "'test' 13"}, {at: 0.3, expect: "'test' 13"},
{at: 0.7, is: "'test' 17"}, {at: 0.7, expect: "'test' 17"},
{at: 1, is: "'test' 20"}, {at: 1, expect: "'test' 20"},
{at: 1.5, is: "'test' 25"}, {at: 1.5, expect: "'test' 25"},
]); ]);
assertNoInterpolation({ test_no_interpolation({
property: 'font-variation-settings', property: 'font-variation-settings',
from: 'initial', from: 'initial',
to: "'test' 50", to: "'test' 50",
}); });
assertInterpolation({ test_interpolation({
property: 'font-variation-settings', property: 'font-variation-settings',
from: 'inherit', from: 'inherit',
to: "'test' 20", to: "'test' 20",
}, [ }, [
{at: -0.5, is: "'test' 35"}, {at: -0.5, expect: "'test' 35"},
{at: 0, is: "'test' 30"}, {at: 0, expect: "'test' 30"},
{at: 0.3, is: "'test' 27"}, {at: 0.3, expect: "'test' 27"},
{at: 0.7, is: "'test' 23"}, {at: 0.7, expect: "'test' 23"},
{at: 1, is: "'test' 20"}, {at: 1, expect: "'test' 20"},
{at: 1.5, is: "'test' 15"}, {at: 1.5, expect: "'test' 15"},
]); ]);
assertInterpolation({ test_interpolation({
property: 'font-variation-settings', property: 'font-variation-settings',
from: 'unset', from: 'unset',
to: "'test' 20", to: "'test' 20",
}, [ }, [
{at: -0.5, is: "'test' 35"}, {at: -0.5, expect: "'test' 35"},
{at: 0, is: "'test' 30"}, {at: 0, expect: "'test' 30"},
{at: 0.3, is: "'test' 27"}, {at: 0.3, expect: "'test' 27"},
{at: 0.7, is: "'test' 23"}, {at: 0.7, expect: "'test' 23"},
{at: 1, is: "'test' 20"}, {at: 1, expect: "'test' 20"},
{at: 1.5, is: "'test' 15"}, {at: 1.5, expect: "'test' 15"},
]); ]);
assertNoInterpolation({ test_no_interpolation({
property: 'font-variation-settings', property: 'font-variation-settings',
from: "'test' 20", from: "'test' 20",
to: "normal", to: "normal",
}); });
assertInterpolation({ test_interpolation({
property: 'font-variation-settings', property: 'font-variation-settings',
from: "'test' 20", from: "'test' 20",
to: "'test' 30", to: "'test' 30",
}, [ }, [
{at: -0.5, is: "'test' 15"}, {at: -0.5, expect: "'test' 15"},
{at: 0, is: "'test' 20"}, {at: 0, expect: "'test' 20"},
{at: 0.3, is: "'test' 23"}, {at: 0.3, expect: "'test' 23"},
{at: 0.7, is: "'test' 27"}, {at: 0.7, expect: "'test' 27"},
{at: 1, is: "'test' 30"}, {at: 1, expect: "'test' 30"},
{at: 1.5, is: "'test' 35"}, {at: 1.5, expect: "'test' 35"},
]); ]);
assertInterpolation({ test_interpolation({
property: 'font-variation-settings', property: 'font-variation-settings',
from: "'aaaa' 0, 'bbbb' 10, 'cccc' 20", from: "'aaaa' 0, 'bbbb' 10, 'cccc' 20",
to: "'aaaa' 10, 'bbbb' 20, 'cccc' 30", to: "'aaaa' 10, 'bbbb' 20, 'cccc' 30",
}, [ }, [
{at: -0.5, is: "'aaaa' -5, 'bbbb' 5, 'cccc' 15"}, {at: -0.5, expect: "'aaaa' -5, 'bbbb' 5, 'cccc' 15"},
{at: 0, is: "'aaaa' 0, 'bbbb' 10, 'cccc' 20"}, {at: 0, expect: "'aaaa' 0, 'bbbb' 10, 'cccc' 20"},
{at: 0.3, is: "'aaaa' 3, 'bbbb' 13, 'cccc' 23"}, {at: 0.3, expect: "'aaaa' 3, 'bbbb' 13, 'cccc' 23"},
{at: 0.7, is: "'aaaa' 7, 'bbbb' 17, 'cccc' 27"}, {at: 0.7, expect: "'aaaa' 7, 'bbbb' 17, 'cccc' 27"},
{at: 1, is: "'aaaa' 10, 'bbbb' 20, 'cccc' 30"}, {at: 1, expect: "'aaaa' 10, 'bbbb' 20, 'cccc' 30"},
{at: 1.5, is: "'aaaa' 15, 'bbbb' 25, 'cccc' 35"}, {at: 1.5, expect: "'aaaa' 15, 'bbbb' 25, 'cccc' 35"},
]); ]);
assertNoInterpolation({ test_no_interpolation({
property: 'font-variation-settings', property: 'font-variation-settings',
from: "'aaaa' 0, 'bbbb' 10", from: "'aaaa' 0, 'bbbb' 10",
to: "'aaaa' 10, 'bbbb' 20, 'cccc' 30", to: "'aaaa' 10, 'bbbb' 20, 'cccc' 30",
}); });
assertNoInterpolation({ test_no_interpolation({
property: 'font-variation-settings', property: 'font-variation-settings',
from: "'aaaa' 10, 'bbbb' 20, 'cccc' 30", from: "'aaaa' 10, 'bbbb' 20, 'cccc' 30",
to: "'aaaa' 0, 'bbbb' 10", to: "'aaaa' 0, 'bbbb' 10",
}); });
assertNoInterpolation({ test_no_interpolation({
property: 'font-variation-settings', property: 'font-variation-settings',
from: "'aaaa' 0, 'bbbb' 10, 'cccc' 20", from: "'aaaa' 0, 'bbbb' 10, 'cccc' 20",
to: "'cccc' 10, 'bbbb' 20, 'aaaa' 30", to: "'cccc' 10, 'bbbb' 20, 'aaaa' 30",
}); });
assertNoInterpolation({ test_no_interpolation({
property: 'font-variation-settings', property: 'font-variation-settings',
from: "'aaaa' 0, 'bbbb' 10, 'cccc' 20", from: "'aaaa' 0, 'bbbb' 10, 'cccc' 20",
to: "'dddd' 10, 'eeee' 20, 'ffff' 30", to: "'dddd' 10, 'eeee' 20, 'ffff' 30",
}); });
// crbug.com/910118: Test that ApplyStandardPropertyValue doesn't overflow. // crbug.com/910118: Test that ApplyStandardPropertyValue doesn't overflow.
assertInterpolation({ test_interpolation({
property: 'font-variation-settings', property: 'font-variation-settings',
from: "'aaaa' 30, 'bbbb' 20", from: "'aaaa' 30, 'bbbb' 20",
to: "'aaaa' 20, 'bbbb' 30", to: "'aaaa' 20, 'bbbb' 30",
}, [ }, [
{at: 3.40282e+38, is: "'aaaa' -3.40282e+38, 'bbbb' 3.40282e+38"}, {at: 3.40282e+38, expect: "'aaaa' -3.40282e+38, 'bbbb' 3.40282e+38"},
]); ]);
</script> </script>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment