Skip to content

Commit e154212

Browse files
committed
Tests: Import WPT coverage for caret-color
A couple of these fail. Importing them now so that we can measure our progress.
1 parent 421b909 commit e154212

10 files changed

Lines changed: 244 additions & 0 deletions

File tree

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
Harness status: OK
2+
3+
Found 3 tests
4+
5+
3 Pass
6+
Pass Check the resolved value of 'auto'
7+
Pass Check the resolved value of 'currentcolor'
8+
Pass Check the resolved value of 'initial'
Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
Harness status: OK
2+
3+
Found 1 tests
4+
5+
1 Pass
6+
Pass The caret-color property is animatable
Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
Harness status: OK
2+
3+
Found 1 tests
4+
5+
1 Pass
6+
Pass caret-color: auto is not interpolable
Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
Harness status: OK
2+
3+
Found 1 tests
4+
5+
1 Fail
6+
Fail caret-color: currentcolor is interpolable
Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
Harness status: OK
2+
3+
Found 1 tests
4+
5+
1 Fail
6+
Fail Default caret-color is not interpolable
Lines changed: 49 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,49 @@
1+
<!DOCTYPE html>
2+
<meta charset="utf-8">
3+
<title>CSS Basic User Interface Test: caret-color computed values</title>
4+
<link rel="author" title="Florian Rivoal" href="mailto:florian@rivoal.net">
5+
<link rel="help" href="http://www.w3.org/TR/css3-ui/#caret-color">
6+
<link rel="help" href="https://drafts.csswg.org/css-color-4/#currentcolor-color">
7+
<meta name="flags" content="dom">
8+
<meta name="assert" content="Test checks that the resolved value of auto, currentcolor and initial for caret-color property, is the used value.">
9+
<script src="../../resources/testharness.js"></script>
10+
<script src="../../resources/testharnessreport.js"></script>
11+
<style>
12+
#d1 {
13+
color: lime;
14+
caret-color: auto;
15+
}
16+
#d2 {
17+
color: cyan;
18+
caret-color: currentcolor;
19+
}
20+
#d3 {
21+
color: magenta;
22+
caret-color: initial;
23+
}
24+
</style>
25+
<body>
26+
<div id=d1></div>
27+
<div id=d2></div>
28+
<div id=d3></div>
29+
<div id=log></div>
30+
31+
<script>
32+
test(
33+
function(){
34+
var d1 = document.getElementById("d1");
35+
assert_equals(window.getComputedStyle(d1)["caret-color"], "rgb(0, 255, 0)");
36+
}, "Check the resolved value of 'auto'");
37+
test(
38+
function(){
39+
var d2 = document.getElementById("d2");
40+
assert_equals(window.getComputedStyle(d2)["caret-color"], "rgb(0, 255, 255)");
41+
}, "Check the resolved value of 'currentcolor'");
42+
test(
43+
function(){
44+
var d3 = document.getElementById("d3");
45+
assert_equals(window.getComputedStyle(d3)["caret-color"], "rgb(255, 0, 255)");
46+
}, "Check the resolved value of 'initial'");
47+
</script>
48+
</body>
49+
</html>
Lines changed: 45 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
<!DOCTYPE html>
2+
<meta charset="utf-8">
3+
<title>CSS Basic User Interface Test: caret-color test animation</title>
4+
<link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com">
5+
<link rel="help" href="http://www.w3.org/TR/css3-ui/#caret-color">
6+
<link rel="help" href="https://www.w3.org/TR/web-animations-1/#dom-animatable-animate">
7+
<link rel="help" href="https://www.w3.org/TR/css3-color/#color0">
8+
<meta name="assert" content="Test checks that caret-color is animatable as a color, and that the computed values during the animation are the expected ones.">
9+
<script src="../../resources/testharness.js"></script>
10+
<script src="../../resources/testharnessreport.js"></script>
11+
<style>
12+
textarea {
13+
caret-color: red;
14+
}
15+
</style>
16+
<body>
17+
<textarea id="textarea"></textarea>
18+
<div id=log></div>
19+
20+
<script>
21+
test(
22+
function(){
23+
var textarea = document.getElementById("textarea");
24+
assert_equals(getComputedStyle(textarea).caretColor, 'rgb(255, 0, 0)');
25+
26+
var keyframes = [
27+
{ caretColor: 'magenta' },
28+
{ caretColor: 'lime' }
29+
];
30+
var options = {
31+
duration: 10,
32+
fill: "forwards"
33+
};
34+
35+
var player = textarea.animate(keyframes, options);
36+
player.pause();
37+
player.currentTime = 0;
38+
assert_equals(getComputedStyle(textarea).caretColor, 'rgb(255, 0, 255)');
39+
player.currentTime = 5;
40+
assert_equals(getComputedStyle(textarea).caretColor, 'rgb(128, 128, 128)');
41+
player.currentTime = 10;
42+
assert_equals(getComputedStyle(textarea).caretColor, 'rgb(0, 255, 0)');
43+
}, "The caret-color property is animatable");
44+
</script>
45+
</body>
Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
<!DOCTYPE html>
2+
<meta charset="utf-8">
3+
<title>CSS Basic User Interface Test: caret-color auto test animation</title>
4+
<link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com">
5+
<link rel="help" href="http://www.w3.org/TR/css3-ui/#caret-color">
6+
<link rel="help" href="https://www.w3.org/TR/web-animations-1/#dom-animatable-animate">
7+
<link rel="help" href="https://www.w3.org/TR/css3-color/#color0">
8+
<meta name="assert" content="Test checks that 'auto' value for caret-color property is not interpolable.">
9+
<script src="../../resources/testharness.js"></script>
10+
<script src="../../resources/testharnessreport.js"></script>
11+
<style>
12+
textarea {
13+
color: magenta;
14+
}
15+
</style>
16+
<body>
17+
<textarea id="textarea"></textarea>
18+
<div id=log></div>
19+
20+
<script>
21+
test(
22+
function(){
23+
var textarea = document.getElementById("textarea");
24+
var keyframes = [
25+
{ caretColor: 'auto' },
26+
{ caretColor: 'lime' }
27+
];
28+
var options = {
29+
duration: 10,
30+
fill: "forwards"
31+
};
32+
33+
var player = textarea.animate(keyframes, options);
34+
player.pause();
35+
player.currentTime = 5;
36+
assert_equals(getComputedStyle(textarea).caretColor, 'rgb(0, 255, 0)');
37+
}, "caret-color: auto is not interpolable");
38+
</script>
39+
</body>
Lines changed: 46 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,46 @@
1+
<!DOCTYPE html>
2+
<meta charset="utf-8">
3+
<title>CSS Basic User Interface Test: caret-color currentcolor test animation</title>
4+
<link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com">
5+
<link rel="help" href="http://www.w3.org/TR/css3-ui/#caret-color">
6+
<link rel="help" href="https://www.w3.org/TR/web-animations-1/#dom-animatable-animate">
7+
<link rel="help" href="https://www.w3.org/TR/css3-color/#color0">
8+
<meta name="assert" content="Test checks that 'currentcolor' value for caret-color property is interpolable.">
9+
<script src="../../resources/testharness.js"></script>
10+
<script src="../../resources/testharnessreport.js"></script>
11+
<style>
12+
textarea {
13+
color: magenta;
14+
}
15+
</style>
16+
<body>
17+
<textarea id="textarea"></textarea>
18+
<div id=log></div>
19+
20+
<script>
21+
test(
22+
function(){
23+
var textarea = document.getElementById("textarea");
24+
var keyframes = [
25+
{ caretColor: 'currentcolor' },
26+
{ caretColor: 'lime' }
27+
];
28+
var options = {
29+
duration: 10,
30+
fill: "forwards"
31+
};
32+
33+
var player = textarea.animate(keyframes, options);
34+
player.pause();
35+
player.currentTime = 5;
36+
var rgb = getComputedStyle(textarea).caretColor.match(/\d+/g);
37+
/* Only testing that the rgb value is some intermediary value,
38+
but not checking which, as we only care that the value is interpolated,
39+
not about the numerical accuracy of interpolation,
40+
which is something tests for the animation spec ought to worry about. */
41+
assert_true( rgb[0] < 255 && rgb[0] > 0, "the red channel is interpolated");
42+
assert_true( rgb[1] < 255 && rgb[1] > 0, "the green channel is interpolated");
43+
assert_true( rgb[2] < 255 && rgb[2] > 0, "the blue channel is interpolated");
44+
}, "caret-color: currentcolor is interpolable");
45+
</script>
46+
</body>
Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
<!DOCTYPE html>
2+
<meta charset="utf-8">
3+
<title>CSS Basic User Interface Test: Default caret-color test animation</title>
4+
<link rel="author" title="Manuel Rego Casasnovas" href="mailto:rego@igalia.com">
5+
<link rel="help" href="http://www.w3.org/TR/css3-ui/#caret-color">
6+
<link rel="help" href="https://www.w3.org/TR/css-animations-1/#animation">
7+
<link rel="help" href="https://www.w3.org/TR/css3-color/#color0">
8+
<meta name="assert" content="Test checks that the default value for caret-color property, which is 'auto', is not interpolable.">
9+
<script src="../../resources/testharness.js"></script>
10+
<script src="../../resources/testharnessreport.js"></script>
11+
<style>
12+
@keyframes caret-color-to-lime {
13+
to { caret-color: lime; }
14+
}
15+
16+
#textarea {
17+
color: magenta;
18+
animation: caret-color-to-lime 2s -1s paused;
19+
}
20+
</style>
21+
<body>
22+
<textarea id="textarea"></textarea>
23+
<div id=log></div>
24+
25+
<script>
26+
test(
27+
function(){
28+
var textarea = document.getElementById("textarea");
29+
assert_equals(getComputedStyle(textarea).caretColor, 'rgb(0, 255, 0)');
30+
}, "Default caret-color is not interpolable");
31+
</script>
32+
</body>
33+

0 commit comments

Comments
 (0)