Skip to content

Commit 7057c7d

Browse files
nedbatnedbat
committed
feat: html columns are always sorted with clearer indicators
1 parent 478a120 commit 7057c7d

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

51 files changed

+497
-482
lines changed

‎CHANGES.rst

+5
Original file line numberDiff line numberDiff line change
@@ -28,6 +28,11 @@ Unreleased
2828
and classes. Other reports don't yet have this information, but it will be
2929
added in the future where it makes sense. Feedback gladly accepted!
3030

31+
- Other HTML report improvements:
32+
33+
- The index page is always sorted by one of its columns, with clearer
34+
indications of the sorting.
35+
3136
- The debug output showing which configuration files were tried now shows
3237
absolute paths to help diagnose problems where settings aren't taking effect,
3338
and is renamed from "attempted_config_files" to the more logical

‎coverage/htmlfiles/coverage_html.js

+5-4
Original file line numberDiff line numberDiff line change
@@ -203,14 +203,15 @@ coverage.index_ready = function () {
203203
);
204204

205205
// Look for a localStorage item containing previous sort settings:
206+
var column = 0, direction = "ascending";
206207
const stored_list = localStorage.getItem(coverage.INDEX_SORT_STORAGE);
207208

208209
if (stored_list) {
209-
const {column, direction} = JSON.parse(stored_list);
210-
const th = document.querySelector("[data-sortable]").tHead.rows[0].cells[column]; // nosemgrep: eslint.detect-object-injection
211-
th.setAttribute("aria-sort", direction === "ascending" ? "descending" : "ascending");
212-
th.click()
210+
({column, direction} = JSON.parse(stored_list));
213211
}
212+
const th = document.querySelector("[data-sortable]").tHead.rows[0].cells[column]; // nosemgrep: eslint.detect-object-injection
213+
th.setAttribute("aria-sort", direction === "ascending" ? "descending" : "ascending");
214+
th.click()
214215

215216
// Watch for page unload events so we can save the final sort settings:
216217
window.addEventListener("unload", function () {

‎coverage/htmlfiles/index.html

+9-9
Original file line numberDiff line numberDiff line change
@@ -70,20 +70,20 @@ <h1>{{ title|escape }}:
7070
<main id="index">
7171
<table class="index" data-sortable>
7272
<thead>
73-
{# The title="" attr doesn"t work in Safari. #}
73+
{# The title="" attr doesn't work in Safari. #}
7474
<tr class="tablehead" title="Click to sort">
75-
<th class="name left" aria-sort="none" data-shortcut="f">File</th>
75+
<th class="name left" aria-sort="none" data-shortcut="f">File<span class="arrows"></span></th>
7676
{% if column2 %}
77-
<th class="name left" aria-sort="none" data-default-sort-order="ascending" data-shortcut="n">{{ column2 }}</th>
77+
<th class="name left" aria-sort="none" data-default-sort-order="ascending" data-shortcut="n">{{ column2 }}<span class="arrows"/></th>
7878
{% endif %}
79-
<th aria-sort="none" data-default-sort-order="descending" data-shortcut="s">statements</th>
80-
<th aria-sort="none" data-default-sort-order="descending" data-shortcut="m">missing</th>
81-
<th aria-sort="none" data-default-sort-order="descending" data-shortcut="x">excluded</th>
79+
<th aria-sort="none" data-default-sort-order="descending" data-shortcut="s">statements<span class="arrows"/></th>
80+
<th aria-sort="none" data-default-sort-order="descending" data-shortcut="m">missing<span class="arrows"/></th>
81+
<th aria-sort="none" data-default-sort-order="descending" data-shortcut="x">excluded<span class="arrows"/></th>
8282
{% if has_arcs %}
83-
<th aria-sort="none" data-default-sort-order="descending" data-shortcut="b">branches</th>
84-
<th aria-sort="none" data-default-sort-order="descending" data-shortcut="p">partial</th>
83+
<th aria-sort="none" data-default-sort-order="descending" data-shortcut="b">branches<span class="arrows"/></th>
84+
<th aria-sort="none" data-default-sort-order="descending" data-shortcut="p">partial<span class="arrows"/></th>
8585
{% endif %}
86-
<th class="right" aria-sort="none" data-shortcut="c">coverage</th>
86+
<th class="right" aria-sort="none" data-shortcut="c">coverage<span class="arrows"/></th>
8787
</tr>
8888
</thead>
8989
<tbody>

‎coverage/htmlfiles/style.css

+4-2
Original file line numberDiff line numberDiff line change
@@ -280,13 +280,15 @@ kbd { border: 1px solid black; border-color: #888 #333 #333 #888; padding: .1em
280280

281281
@media (prefers-color-scheme: dark) { #index th:hover { background: #333; } }
282282

283+
#index th .arrows { color: #666; font-size: 85%; font-family: sans-serif; font-style: normal; pointer-events: none; }
284+
283285
#index th[aria-sort="ascending"], #index th[aria-sort="descending"] { white-space: nowrap; background: #eee; padding-left: .5em; }
284286

285287
@media (prefers-color-scheme: dark) { #index th[aria-sort="ascending"], #index th[aria-sort="descending"] { background: #333; } }
286288

287-
#index th[aria-sort="ascending"]::after { font-family: sans-serif; content: " ↑"; }
289+
#index th[aria-sort="ascending"] .arrows::after { content: " ▲"; }
288290

289-
#index th[aria-sort="descending"]::after { font-family: sans-serif; content: " ↓"; }
291+
#index th[aria-sort="descending"] .arrows::after { content: " ▼"; }
290292

291293
#index td.name { font-size: 1.15em; }
292294

‎coverage/htmlfiles/style.scss

+11-6
Original file line numberDiff line numberDiff line change
@@ -658,19 +658,24 @@ $border-indicator-width: .2em;
658658
background: $light-gray2;
659659
@include background-dark($dark-gray2);
660660
}
661+
.arrows {
662+
color: #666;
663+
font-size: 85%;
664+
font-family: sans-serif;
665+
font-style: normal;
666+
pointer-events: none;
667+
}
661668
&[aria-sort="ascending"], &[aria-sort="descending"] {
662669
white-space: nowrap;
663670
background: $light-gray2;
664671
@include background-dark($dark-gray2);
665672
padding-left: .5em;
666673
}
667-
&[aria-sort="ascending"]::after {
668-
font-family: sans-serif;
669-
content: " ↑";
674+
&[aria-sort="ascending"] .arrows::after {
675+
content: " ▲";
670676
}
671-
&[aria-sort="descending"]::after {
672-
font-family: sans-serif;
673-
content: " ↓";
677+
&[aria-sort="descending"] .arrows::after {
678+
content: " ▼";
674679
}
675680
}
676681
td.name {

‎tests/gold/html/a/class_index.html

+10-10
Original file line numberDiff line numberDiff line change
@@ -45,21 +45,21 @@ <h1>Coverage report:
4545
<input id="filter" type="text" value="" placeholder="filter..." />
4646
</form>
4747
<p class="text">
48-
<a class="nav" href="https://coverage.readthedocs.io/en/7.4.5a0.dev1">coverage.py v7.4.5a0.dev1</a>,
49-
created at 2024-04-15 09:20 -0400
48+
<a class="nav" href="https://coverage.readthedocs.io/en/7.5.0a1.dev1">coverage.py v7.5.0a1.dev1</a>,
49+
created at 2024-04-18 11:22 -0400
5050
</p>
5151
</div>
5252
</header>
5353
<main id="index">
5454
<table class="index" data-sortable>
5555
<thead>
5656
<tr class="tablehead" title="Click to sort">
57-
<th class="name left" aria-sort="none" data-shortcut="f">File</th>
58-
<th class="name left" aria-sort="none" data-default-sort-order="ascending" data-shortcut="n">class</th>
59-
<th aria-sort="none" data-default-sort-order="descending" data-shortcut="s">statements</th>
60-
<th aria-sort="none" data-default-sort-order="descending" data-shortcut="m">missing</th>
61-
<th aria-sort="none" data-default-sort-order="descending" data-shortcut="x">excluded</th>
62-
<th class="right" aria-sort="none" data-shortcut="c">coverage</th>
57+
<th class="name left" aria-sort="none" data-shortcut="f">File<span class="arrows"></span></th>
58+
<th class="name left" aria-sort="none" data-default-sort-order="ascending" data-shortcut="n">class<span class="arrows"/></th>
59+
<th aria-sort="none" data-default-sort-order="descending" data-shortcut="s">statements<span class="arrows"/></th>
60+
<th aria-sort="none" data-default-sort-order="descending" data-shortcut="m">missing<span class="arrows"/></th>
61+
<th aria-sort="none" data-default-sort-order="descending" data-shortcut="x">excluded<span class="arrows"/></th>
62+
<th class="right" aria-sort="none" data-shortcut="c">coverage<span class="arrows"/></th>
6363
</tr>
6464
</thead>
6565
<tbody>
@@ -90,8 +90,8 @@ <h1>Coverage report:
9090
<footer>
9191
<div class="content">
9292
<p>
93-
<a class="nav" href="https://coverage.readthedocs.io/en/7.4.5a0.dev1">coverage.py v7.4.5a0.dev1</a>,
94-
created at 2024-04-15 09:20 -0400
93+
<a class="nav" href="https://coverage.readthedocs.io/en/7.5.0a1.dev1">coverage.py v7.5.0a1.dev1</a>,
94+
created at 2024-04-18 11:22 -0400
9595
</p>
9696
</div>
9797
<aside class="hidden">

‎tests/gold/html/a/function_index.html

+10-10
Original file line numberDiff line numberDiff line change
@@ -45,21 +45,21 @@ <h1>Coverage report:
4545
<input id="filter" type="text" value="" placeholder="filter..." />
4646
</form>
4747
<p class="text">
48-
<a class="nav" href="https://coverage.readthedocs.io/en/7.4.5a0.dev1">coverage.py v7.4.5a0.dev1</a>,
49-
created at 2024-04-15 09:20 -0400
48+
<a class="nav" href="https://coverage.readthedocs.io/en/7.5.0a1.dev1">coverage.py v7.5.0a1.dev1</a>,
49+
created at 2024-04-18 11:22 -0400
5050
</p>
5151
</div>
5252
</header>
5353
<main id="index">
5454
<table class="index" data-sortable>
5555
<thead>
5656
<tr class="tablehead" title="Click to sort">
57-
<th class="name left" aria-sort="none" data-shortcut="f">File</th>
58-
<th class="name left" aria-sort="none" data-default-sort-order="ascending" data-shortcut="n">function</th>
59-
<th aria-sort="none" data-default-sort-order="descending" data-shortcut="s">statements</th>
60-
<th aria-sort="none" data-default-sort-order="descending" data-shortcut="m">missing</th>
61-
<th aria-sort="none" data-default-sort-order="descending" data-shortcut="x">excluded</th>
62-
<th class="right" aria-sort="none" data-shortcut="c">coverage</th>
57+
<th class="name left" aria-sort="none" data-shortcut="f">File<span class="arrows"></span></th>
58+
<th class="name left" aria-sort="none" data-default-sort-order="ascending" data-shortcut="n">function<span class="arrows"/></th>
59+
<th aria-sort="none" data-default-sort-order="descending" data-shortcut="s">statements<span class="arrows"/></th>
60+
<th aria-sort="none" data-default-sort-order="descending" data-shortcut="m">missing<span class="arrows"/></th>
61+
<th aria-sort="none" data-default-sort-order="descending" data-shortcut="x">excluded<span class="arrows"/></th>
62+
<th class="right" aria-sort="none" data-shortcut="c">coverage<span class="arrows"/></th>
6363
</tr>
6464
</thead>
6565
<tbody>
@@ -90,8 +90,8 @@ <h1>Coverage report:
9090
<footer>
9191
<div class="content">
9292
<p>
93-
<a class="nav" href="https://coverage.readthedocs.io/en/7.4.5a0.dev1">coverage.py v7.4.5a0.dev1</a>,
94-
created at 2024-04-15 09:20 -0400
93+
<a class="nav" href="https://coverage.readthedocs.io/en/7.5.0a1.dev1">coverage.py v7.5.0a1.dev1</a>,
94+
created at 2024-04-18 11:22 -0400
9595
</p>
9696
</div>
9797
<aside class="hidden">

‎tests/gold/html/a/index.html

+9-9
Original file line numberDiff line numberDiff line change
@@ -44,20 +44,20 @@ <h1>Coverage report:
4444
<input id="filter" type="text" value="" placeholder="filter..." />
4545
</form>
4646
<p class="text">
47-
<a class="nav" href="https://coverage.readthedocs.io/en/7.4.5a0.dev1">coverage.py v7.4.5a0.dev1</a>,
48-
created at 2024-04-15 09:20 -0400
47+
<a class="nav" href="https://coverage.readthedocs.io/en/7.5.0a1.dev1">coverage.py v7.5.0a1.dev1</a>,
48+
created at 2024-04-18 11:22 -0400
4949
</p>
5050
</div>
5151
</header>
5252
<main id="index">
5353
<table class="index" data-sortable>
5454
<thead>
5555
<tr class="tablehead" title="Click to sort">
56-
<th class="name left" aria-sort="none" data-shortcut="f">File</th>
57-
<th aria-sort="none" data-default-sort-order="descending" data-shortcut="s">statements</th>
58-
<th aria-sort="none" data-default-sort-order="descending" data-shortcut="m">missing</th>
59-
<th aria-sort="none" data-default-sort-order="descending" data-shortcut="x">excluded</th>
60-
<th class="right" aria-sort="none" data-shortcut="c">coverage</th>
56+
<th class="name left" aria-sort="none" data-shortcut="f">File<span class="arrows"></span></th>
57+
<th aria-sort="none" data-default-sort-order="descending" data-shortcut="s">statements<span class="arrows"/></th>
58+
<th aria-sort="none" data-default-sort-order="descending" data-shortcut="m">missing<span class="arrows"/></th>
59+
<th aria-sort="none" data-default-sort-order="descending" data-shortcut="x">excluded<span class="arrows"/></th>
60+
<th class="right" aria-sort="none" data-shortcut="c">coverage<span class="arrows"/></th>
6161
</tr>
6262
</thead>
6363
<tbody>
@@ -86,8 +86,8 @@ <h1>Coverage report:
8686
<footer>
8787
<div class="content">
8888
<p>
89-
<a class="nav" href="https://coverage.readthedocs.io/en/7.4.5a0.dev1">coverage.py v7.4.5a0.dev1</a>,
90-
created at 2024-04-15 09:20 -0400
89+
<a class="nav" href="https://coverage.readthedocs.io/en/7.5.0a1.dev1">coverage.py v7.5.0a1.dev1</a>,
90+
created at 2024-04-18 11:22 -0400
9191
</p>
9292
</div>
9393
<aside class="hidden">

‎tests/gold/html/b_branch/class_index.html

+12-12
Original file line numberDiff line numberDiff line change
@@ -47,23 +47,23 @@ <h1>Coverage report:
4747
<input id="filter" type="text" value="" placeholder="filter..." />
4848
</form>
4949
<p class="text">
50-
<a class="nav" href="https://coverage.readthedocs.io/en/7.4.5a0.dev1">coverage.py v7.4.5a0.dev1</a>,
51-
created at 2024-04-15 09:20 -0400
50+
<a class="nav" href="https://coverage.readthedocs.io/en/7.5.0a1.dev1">coverage.py v7.5.0a1.dev1</a>,
51+
created at 2024-04-18 11:22 -0400
5252
</p>
5353
</div>
5454
</header>
5555
<main id="index">
5656
<table class="index" data-sortable>
5757
<thead>
5858
<tr class="tablehead" title="Click to sort">
59-
<th class="name left" aria-sort="none" data-shortcut="f">File</th>
60-
<th class="name left" aria-sort="none" data-default-sort-order="ascending" data-shortcut="n">class</th>
61-
<th aria-sort="none" data-default-sort-order="descending" data-shortcut="s">statements</th>
62-
<th aria-sort="none" data-default-sort-order="descending" data-shortcut="m">missing</th>
63-
<th aria-sort="none" data-default-sort-order="descending" data-shortcut="x">excluded</th>
64-
<th aria-sort="none" data-default-sort-order="descending" data-shortcut="b">branches</th>
65-
<th aria-sort="none" data-default-sort-order="descending" data-shortcut="p">partial</th>
66-
<th class="right" aria-sort="none" data-shortcut="c">coverage</th>
59+
<th class="name left" aria-sort="none" data-shortcut="f">File<span class="arrows"></span></th>
60+
<th class="name left" aria-sort="none" data-default-sort-order="ascending" data-shortcut="n">class<span class="arrows"/></th>
61+
<th aria-sort="none" data-default-sort-order="descending" data-shortcut="s">statements<span class="arrows"/></th>
62+
<th aria-sort="none" data-default-sort-order="descending" data-shortcut="m">missing<span class="arrows"/></th>
63+
<th aria-sort="none" data-default-sort-order="descending" data-shortcut="x">excluded<span class="arrows"/></th>
64+
<th aria-sort="none" data-default-sort-order="descending" data-shortcut="b">branches<span class="arrows"/></th>
65+
<th aria-sort="none" data-default-sort-order="descending" data-shortcut="p">partial<span class="arrows"/></th>
66+
<th class="right" aria-sort="none" data-shortcut="c">coverage<span class="arrows"/></th>
6767
</tr>
6868
</thead>
6969
<tbody>
@@ -98,8 +98,8 @@ <h1>Coverage report:
9898
<footer>
9999
<div class="content">
100100
<p>
101-
<a class="nav" href="https://coverage.readthedocs.io/en/7.4.5a0.dev1">coverage.py v7.4.5a0.dev1</a>,
102-
created at 2024-04-15 09:20 -0400
101+
<a class="nav" href="https://coverage.readthedocs.io/en/7.5.0a1.dev1">coverage.py v7.5.0a1.dev1</a>,
102+
created at 2024-04-18 11:22 -0400
103103
</p>
104104
</div>
105105
<aside class="hidden">

‎tests/gold/html/b_branch/function_index.html

+12-12
Original file line numberDiff line numberDiff line change
@@ -47,23 +47,23 @@ <h1>Coverage report:
4747
<input id="filter" type="text" value="" placeholder="filter..." />
4848
</form>
4949
<p class="text">
50-
<a class="nav" href="https://coverage.readthedocs.io/en/7.4.5a0.dev1">coverage.py v7.4.5a0.dev1</a>,
51-
created at 2024-04-15 09:20 -0400
50+
<a class="nav" href="https://coverage.readthedocs.io/en/7.5.0a1.dev1">coverage.py v7.5.0a1.dev1</a>,
51+
created at 2024-04-18 11:22 -0400
5252
</p>
5353
</div>
5454
</header>
5555
<main id="index">
5656
<table class="index" data-sortable>
5757
<thead>
5858
<tr class="tablehead" title="Click to sort">
59-
<th class="name left" aria-sort="none" data-shortcut="f">File</th>
60-
<th class="name left" aria-sort="none" data-default-sort-order="ascending" data-shortcut="n">function</th>
61-
<th aria-sort="none" data-default-sort-order="descending" data-shortcut="s">statements</th>
62-
<th aria-sort="none" data-default-sort-order="descending" data-shortcut="m">missing</th>
63-
<th aria-sort="none" data-default-sort-order="descending" data-shortcut="x">excluded</th>
64-
<th aria-sort="none" data-default-sort-order="descending" data-shortcut="b">branches</th>
65-
<th aria-sort="none" data-default-sort-order="descending" data-shortcut="p">partial</th>
66-
<th class="right" aria-sort="none" data-shortcut="c">coverage</th>
59+
<th class="name left" aria-sort="none" data-shortcut="f">File<span class="arrows"></span></th>
60+
<th class="name left" aria-sort="none" data-default-sort-order="ascending" data-shortcut="n">function<span class="arrows"/></th>
61+
<th aria-sort="none" data-default-sort-order="descending" data-shortcut="s">statements<span class="arrows"/></th>
62+
<th aria-sort="none" data-default-sort-order="descending" data-shortcut="m">missing<span class="arrows"/></th>
63+
<th aria-sort="none" data-default-sort-order="descending" data-shortcut="x">excluded<span class="arrows"/></th>
64+
<th aria-sort="none" data-default-sort-order="descending" data-shortcut="b">branches<span class="arrows"/></th>
65+
<th aria-sort="none" data-default-sort-order="descending" data-shortcut="p">partial<span class="arrows"/></th>
66+
<th class="right" aria-sort="none" data-shortcut="c">coverage<span class="arrows"/></th>
6767
</tr>
6868
</thead>
6969
<tbody>
@@ -128,8 +128,8 @@ <h1>Coverage report:
128128
<footer>
129129
<div class="content">
130130
<p>
131-
<a class="nav" href="https://coverage.readthedocs.io/en/7.4.5a0.dev1">coverage.py v7.4.5a0.dev1</a>,
132-
created at 2024-04-15 09:20 -0400
131+
<a class="nav" href="https://coverage.readthedocs.io/en/7.5.0a1.dev1">coverage.py v7.5.0a1.dev1</a>,
132+
created at 2024-04-18 11:22 -0400
133133
</p>
134134
</div>
135135
<aside class="hidden">

0 commit comments

Comments
 (0)