-
Notifications
You must be signed in to change notification settings - Fork 791
Expand file tree
/
Copy pathtest-coverage.html
More file actions
244 lines (185 loc) · 15.2 KB
/
test-coverage.html
File metadata and controls
244 lines (185 loc) · 15.2 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
<!doctype html>
<meta charset=utf-8>
<title>CSS Scrollbar 1 test coverage report</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="../default.css" rel="stylesheet" type="text/css">
<style>/* style-wpt */ :root { --wpt-border: hsl(0, 0%, 60%); --wpt-bg: hsl(0, 0%, 95%); --wpt-text: var(--text); --wptheading-text: hsl(0, 0%, 30%); } @media (prefers-color-scheme: dark) { :root { --wpt-border: hsl(0, 0%, 30%); --wpt-bg: var(--borderedblock-bg); --wpt-text: var(--text); --wptheading-text: hsl(0, 0%, 60%); } } .wpt-tests-block { list-style: none; border-left: .5em solid var(--wpt-border); background: var(--wpt-bg); color: var(--wpt-text); margin: 1em auto; padding: .5em; } .wpt-tests-block summary { color: var(--wptheading-text); font-weight: normal; text-transform: uppercase; } .wpt-tests-block summary::marker{ color: var(--wpt-border); } .wpt-tests-block summary:hover::marker{ color: var(--wpt-text); } /* The only content of a wpt test block in its closed state is the <summary>, which contains the word TESTS, and that is absolutely positioned. In that closed state, wpt test blocks are styled to have a top margin whose height is exactly equal to the height of the absolutely positioned <summary>, and no other background/padding/margin/border. The wpt test block elements will therefore allow the maring of the previous/next block elements to collapse through them; if this combined margin would be larger than its own top margin, it stays as is, and therefore the pre-existing vertical rhythm of the document is undisturbed. If that combined margin would be smaller, it is grown to that size. This means that the wpt test block ensures that there's always enough vertical space to insert the summary, without adding more than is needed. */ .wpt-tests-block:not([open]){ padding: 0; border: none; background: none; font-size: 0.75em; line-height: 1; position: relative; margin: 1em 0 0; } .wpt-tests-block:not([open]) summary { position: absolute; right: 0; bottom: 0; } /* It is possible that both the last child of a block element and the block element itself would be annotated with a <wpt> block each. If the block element has a padding or a border, that's fine, but otherwise the bottom margin of the block and of its last child would collapse and both <wpt> elements would overlap, being both placed there. To avoid that, add 1px of padding to the <wpt> element annotating the last child to prevent the bottom margin of the block and of its last child from collapsing (and as much negative margin, as wel only want to prevent margin collapsing, but are not trying to actually take more space). */ .wpt-tests-block:not([open]):last-child { padding-bottom: 1px; margin-bottom: -1px; } /* Exception to the previous rule: don't do that in non-last list items, because it's not necessary, and would therefore consume more space than strictly needed. Lists must have list items as children, not <wpt> elements, so a <wpt> element cannot be a sibling of a list item, and the collision that the previous rule avoids cannot happen. */ li:not(:last-child) > .wpt-tests-block:not([open]):last-child, dd:not(:last-child) > .wpt-tests-block:not([open]):last-child { padding-bottom: 0; margin-bottom: 0; } .wpt-tests-block:not([open]):not(:hover){ opacity: 0.5; } .wpt-tests-list { list-style: none; display: grid; margin: 0; padding: 0; grid-template-columns: 1fr auto auto; grid-column-gap: .5em; } .wpt-tests-block hr:last-child { display: none; } .wpt-test { display: contents; } .wpt-test > a { text-decoration: underline; border: none; } .wpt-test > .wpt-name { grid-column: 1; } .wpt-test > .wpt-live { grid-column: 2; } .wpt-test > .wpt-source { grid-column: 3; } </style>
<div class=head>
<h1 id=title>CSS scrollbar-1 test coverage report</h1>
<h2 class=subtitle>2024-01-24</h2>
<dl>
<dt class="editor">Prepared by:
<dd class="editor p-author h-card vcard" data-editor-id="43241"><a class="p-name fn u-url url" href="https://florian.rivoal.net">Florian Rivoal</a> (<span class="p-org org">Invited Expert</span>)
</dl>
<hr title="Separator for header">
</div>
<!--
To generate this document:
* Delete everything after this comment
* Load the spec
* run this in the console:
document.querySelectorAll(".mdn-anno").forEach(function(e){e.remove();});
document.querySelectorAll("main > :not(h1, h2, h3, h4, h5, h6, h1+.wpt-tests-block, h2+.wpt-tests-block, h3+.wpt-tests-block, h4+.wpt-tests-block, h5+.wpt-tests-block, h6+.wpt-tests-block)").forEach(function(e){e.remove();});
document.querySelectorAll("body > :not(main)").forEach(function(e){e.remove();});
document.querySelectorAll(".wpt-tests-block").forEach(function(e){e.setAttribute("open","");});
* Copy the remaining main element, and paste it below
-->
<main>
<h2 class="heading settled" data-level="1" id="intro"><span class="secno">1. </span><span class="content"> Introduction</span><a class="self-link" href="#intro"></a></h2>
<details class="wpt-tests-block" dir="ltr" lang="en" open="">
<summary>Tests</summary>
<p>This section is not normative, it does not need tests.</p>
<ul class="wpt-tests-list"></ul>
<hr>
</details>
<h3 class="heading settled" data-level="1.1" id="scope"><span class="secno">1.1. </span><span class="content"> Scope</span><a class="self-link" href="#scope"></a></h3>
<details class="wpt-tests-block" dir="ltr" lang="en" open="">
<summary>Tests</summary>
<p>This section is not normative, it does not need tests.</p>
<ul class="wpt-tests-list"></ul>
<hr>
</details>
<h4 class="heading settled" data-level="1.1.1" id="out-of-scope"><span class="secno">1.1.1. </span><span class="content"> Out Of Scope</span><a class="self-link" href="#out-of-scope"></a></h4>
<details class="wpt-tests-block" dir="ltr" lang="en" open="">
<summary>Tests</summary>
<p>This section is not normative, it does not need tests.</p>
<ul class="wpt-tests-list"></ul>
<hr>
</details>
<h3 class="heading settled" data-level="1.2" id="values"><span class="secno">1.2. </span><span class="content"> Value Definitions</span><a class="self-link" href="#values"></a></h3>
<details class="wpt-tests-block" dir="ltr" lang="en" open="">
<summary>Tests</summary>
<p>This section does not introduce any new normative requirement, it does not need tests.</p>
<ul class="wpt-tests-list"></ul>
<hr>
</details>
<h2 class="heading settled" data-level="2" id="scrollbar-color"><span class="secno">2. </span><span class="content">Scrollbar Colors: the <a class="property css" data-link-type="property" href="#propdef-scrollbar-color" id="ref-for-propdef-scrollbar-color①">scrollbar-color</a> property</span><a class="self-link" href="#scrollbar-color"></a></h2>
<details class="wpt-tests-block" dir="ltr" lang="en" open="">
<summary>Tests</summary>
<p>
This section has partial test coverage.
</p><p>Missing:</p>
<ul>
<li data-md="">
<p>Tests checking that the property does anything</p>
</li><li data-md="">
<p>Tests checking that the colors apply to the right parts</p>
</li><li data-md="">
<p>Initial value</p>
</li></ul>
<p></p>
<ul class="wpt-tests-list"></ul>
<hr>
<p>
The following tests have no basis in the spec:
they assume that making the thumb and the track transparent must make the whole scollbar invisible.
This is not necessarily true:
</p><ul>
<li data-md="">
<p>the scrollbar may have other parts, such as scroll up/down/left/right buttons</p>
</li><li data-md="">
<p>the spec does not require that the thumb / track are painted solid with the specified colors</p>
</li></ul>
<p></p>
<ul class="wpt-tests-list">
<li class="wpt-test"><a class="wpt-name" href="https://wpt.fyi/results/css/css-scrollbars/scrollbar-color-012.html" title="css/css-scrollbars/scrollbar-color-012.html">scrollbar-color-012.html</a><span class="wpt-results"><span title="chrome 1/1" class="wpt-result" style="background: conic-gradient(forestgreen 360deg, darkred 0deg);"></span><span title="firefox 1/1" class="wpt-result" style="background: conic-gradient(forestgreen 360deg, darkred 0deg);"></span><span title="safari 0/1" class="wpt-result" style="background: conic-gradient(forestgreen 0deg, darkred 0deg);"></span><span title="edge 0/1" class="wpt-result" style="background: conic-gradient(forestgreen 0deg, darkred 0deg);"></span></span> <a class="wpt-live" href="http://wpt.live/css/css-scrollbars/scrollbar-color-012.html"><small>(live test)</small></a> <a class="wpt-source" href="https://github.com/web-platform-tests/wpt/blob/master/css/css-scrollbars/scrollbar-color-012.html"><small>(source)</small></a>
</li><li class="wpt-test"><a class="wpt-name" href="https://wpt.fyi/results/css/css-scrollbars/transparent-on-root.html" title="css/css-scrollbars/transparent-on-root.html">transparent-on-root.html</a><span class="wpt-results"><span title="chrome 1/1" class="wpt-result" style="background: conic-gradient(forestgreen 360deg, darkred 0deg);"></span><span title="firefox 1/1" class="wpt-result" style="background: conic-gradient(forestgreen 360deg, darkred 0deg);"></span><span title="safari 0/1" class="wpt-result" style="background: conic-gradient(forestgreen 0deg, darkred 0deg);"></span><span title="edge 0/1" class="wpt-result" style="background: conic-gradient(forestgreen 0deg, darkred 0deg);"></span></span> <a class="wpt-live" href="http://wpt.live/css/css-scrollbars/transparent-on-root.html"><small>(live test)</small></a> <a class="wpt-source" href="https://github.com/web-platform-tests/wpt/blob/master/css/css-scrollbars/transparent-on-root.html"><small>(source)</small></a>
</li></ul>
<hr>
</details>
<h2 class="heading settled" data-level="3" id="scrollbar-width"><span class="secno">3. </span><span class="content">Scrollbar Thickness: the <a class="property css" data-link-type="property" href="#propdef-scrollbar-width" id="ref-for-propdef-scrollbar-width①">scrollbar-width</a> property</span><a class="self-link" href="#scrollbar-width"></a></h2>
<details class="wpt-tests-block" dir="ltr" lang="en" open="">
<summary>Tests</summary>
<p>
This section has partial test coverage.
</p><p>Missing:</p>
<ul>
<li data-md="">
<p>Test that thin does something different from auto in at least some cases</p>
</li><li data-md="">
<p>Test that none does not affect scrollability</p>
</li><li data-md="">
<p>Initial value</p>
</li></ul>
<p></p>
<ul class="wpt-tests-list"></ul>
<hr>
</details>
<h2 class="no-num heading settled" id="acknowledgments"><span class="content"> Appendix A. Acknowledgments</span><a class="self-link" href="#acknowledgments"></a></h2>
<details class="wpt-tests-block" dir="ltr" lang="en" open="">
<summary>Tests</summary>
<p>This section is not normative, it does not need tests.</p>
<ul class="wpt-tests-list"></ul>
<hr>
</details>
<h2 class="no-num heading settled" id="changes"><span class="content"> Appendix B. Changes</span><a class="self-link" href="#changes"></a></h2>
<details class="wpt-tests-block" dir="ltr" lang="en" open="">
<summary>Tests</summary>
<p>This section is not normative, it does not need tests.</p>
<ul class="wpt-tests-list"></ul>
<hr>
</details>
<h3 class="no-num heading settled" id="changes-since-2021-12-06"><span class="content"> Changes since the <a href="https://www.w3.org/TR/2021/CR-css-scrollbars-1-20211206/">6 December 2021 Candidate Recommendation</a></span><a class="self-link" href="#changes-since-2021-12-06"></a></h3>
<details class="wpt-tests-block" dir="ltr" lang="en" open="">
<summary>Tests</summary>
<p>This section is not normative, it does not need tests.</p>
<ul class="wpt-tests-list"></ul>
<hr>
</details>
<h3 class="no-num heading settled" id="changes-since-2021-12-02"><span class="content"> Changes since the <a href="https://www.w3.org/TR/css-scrollbars-1/">2021-12-02 Working Draft</a></span><a class="self-link" href="#changes-since-2021-12-02"></a></h3>
<details class="wpt-tests-block" dir="ltr" lang="en" open="">
<summary>Tests</summary>
<p>This section is not normative, it does not need tests.</p>
<ul class="wpt-tests-list"></ul>
<hr>
</details>
<h3 class="no-num heading settled" id="changes-since-2021-08-05"><span class="content"> Changes from the <a href="https://www.w3.org/TR/2021/WD-css-scrollbars-1-20210805/">2021-08-05 Working Draft</a></span><a class="self-link" href="#changes-since-2021-08-05"></a></h3>
<details class="wpt-tests-block" dir="ltr" lang="en" open="">
<summary>Tests</summary>
<p>This section is not normative, it does not need tests.</p>
<ul class="wpt-tests-list"></ul>
<hr>
</details>
<h3 class="no-num heading settled" id="changes-since-2018-09-25"><span class="content"> Changes from the <a href="https://www.w3.org/TR/2018/WD-css-scrollbars-1-20180925/">2018-09-25 First Public Working Draft</a></span><a class="self-link" href="#changes-since-2018-09-25"></a></h3>
<details class="wpt-tests-block" dir="ltr" lang="en" open="">
<summary>Tests</summary>
<p>This section is not normative, it does not need tests.</p>
<ul class="wpt-tests-list"></ul>
<hr>
</details>
<h2 class="no-num heading settled" id="security-privacy-considerations"><span class="content"> Appendix C. Security and Privacy</span><a class="self-link" href="#security-privacy-considerations"></a></h2>
<details class="wpt-tests-block" dir="ltr" lang="en" open="">
<summary>Tests</summary>
<p>This section is not normative, it does not need tests.</p>
<ul class="wpt-tests-list"></ul>
<hr>
</details>
<h3 class="no-num heading settled" id="security-considerations"><span class="content"> Considerations for Security</span><a class="self-link" href="#security-considerations"></a></h3>
<details class="wpt-tests-block" dir="ltr" lang="en" open="">
<summary>Tests</summary>
<p>This section is not normative, it does not need tests.</p>
<ul class="wpt-tests-list"></ul>
<hr>
</details>
<h3 class="no-num heading settled" id="privacy-considerations"><span class="content"> Considerations for Privacy</span><a class="self-link" href="#privacy-considerations"></a></h3>
<details class="wpt-tests-block" dir="ltr" lang="en" open="">
<summary>Tests</summary>
<p>This section is not normative, it does not need tests.</p>
<ul class="wpt-tests-list"></ul>
<hr>
</details>
<h3 class="no-num heading settled" id="security-privacy-self-review"><span class="content"> Self-review questionnaire</span><a class="self-link" href="#security-privacy-self-review"></a></h3>
<details class="wpt-tests-block" dir="ltr" lang="en" open="">
<summary>Tests</summary>
<p>This section is not normative, it does not need tests.</p>
<ul class="wpt-tests-list"></ul>
<hr>
</details>
<h2 class="no-num heading settled" id="accessibility-considerations"><span class="content"> Appendix D. Considerations for accessibility</span><a class="self-link" href="#accessibility-considerations"></a></h2>
<details class="wpt-tests-block" dir="ltr" lang="en" open="">
<summary>Tests</summary>
<p>This section is not normative, it does not need tests.</p>
<ul class="wpt-tests-list"></ul>
<hr>
</details>
</main>