Improve test result accessibility

[gibson042]

trafficstars

• Explain diff gutter symbols.
• Add test result labels (color covers figure and label, and indicates passed-as-expected vs. not).
• Bold the source line of errors in code excerpts.

Fixes #1558 Fixes #2919

[gibson042]

This produces lots of failures like the following; how do I update the [TAP] test expectations in bulk?

        not ok 43 - should be equal
          ---
          compare: ===
          at:
            line: 59
            column: 6
            file: file:///home/runner/work/ava/ava/test-tap/assert.js
            function: assertFailure
          stack: |
            assertFailure (file://test-tap/assert.js:59:6)
            failsWith (file://test-tap/assert.js:98:2)
            Test.<anonymous> (file://test-tap/assert.js:277:2)
            file://test-tap/assert.js:202:1
          diff: |
            --- expected
            +++ actual
            @@ -1,1 +1,1 @@
            -Difference:
            +Difference (- actual, + expected):
          ...

[gibson042]

Found it: https://github.com/avajs/ava/blob/main/test-tap/reporters/readme.md

[novemberborn]

@sindresorhus what do you think?

[novemberborn]

Thank you @gibson042, very exciting!

Note that we're seeing similar CI failures on the main branch, so let's not worry about those here.

[sindresorhus]

I agree with almost everything. However, I'm not a big fan of the PASS: and FAIL: noise. I think the icons are clear enough for the common case and we could instead only use the prefixes for the other cases like EXPECTED FAIL and SKIP.

[gibson042]

I agree with almost everything. However, I'm not a big fan of the PASS: and FAIL: noise. I think the icons are clear enough for the common case and we could instead only use the prefixes for the other cases like EXPECTED FAIL and SKIP.

@sindresorhus Without "PASS" and "FAIL", vision-impaired consumers are left to infer semantics from information like "check mark" and "multiplication symbol" (the latter improved a bit after https://github.com/sindresorhus/figures/issues/92 ). I'd prefer to keep the verbosity in support of accessibility and output consistency, but if you still disagree then let me know and I'll remove them.

[novemberborn]

@gibson042 I should have some time this week to help get this over the line.

[novemberborn]

I agree with almost everything. However, I'm not a big fan of the PASS: and FAIL: noise. I think the icons are clear enough for the common case and we could instead only use the prefixes for the other cases like EXPECTED FAIL and SKIP.

@sindresorhus Without "PASS" and "FAIL", vision-impaired consumers are left to infer semantics from information like "check mark" and "multiplication symbol" (the latter improved a bit after sindresorhus/figures#92 ). I'd prefer to keep the verbosity in support of accessibility and output consistency, but if you still disagree then let me know and I'll remove them.

@sindresorhus how strongly do you feel about this?

I do like the consistency.

[sindresorhus]

@sindresorhus how strongly do you feel about this?

I don't feel strongly about it.

[sindresorhus]

I do like the consistency.

Most assertion will be pass or fail, so there wouldn't be much inconsistency in practice. And it may even have been beneficial to make the uncommon cases more obvious. The result now is also more noisy.

[novemberborn]

Project name aside, we don't really use all caps. I've pushed a commit to use lowercase and put it in square brackets.

Most of the time, most tests pass. So I've removed the prefix for passed tests.

I also noticed that the assertion message was only differentiated from the test title by color, so I've made that italic.