Test Results

A test run with suites, tests and failure output. Failures expand by default and passes stay collapsed — nobody opens a report to read what passed.

src/components/ui/test-results.tsx

About

From the component's own source, where it was written.

A test run: suites, their tests, and the output of anything that failed.

Failures are expanded by default and passes are collapsed. Nobody opens a test report to read what passed — the useful default is the one that puts the failure output on screen without a click.

Suite state is derived from its tests rather than passed in, so a suite cannot claim to pass while containing a failure.

Install

npx astralyx-ui add test-results

Usage

import { TestResults } from '@/components/ui/test-results'

<TestResults suites={suites} />

Composer

Change the props and the source below follows.

1 failing6 tests in 3 suites1 skipped0s
    • keeps radius under half the control height0s
      expected 20 to be less than 18
      at styles.test.ts:41:22
    • every colour set defines six variables0s
Props
tsx
<TestResults suites={suites} />

Examples

Run

API

Generated from the source, so it cannot fall behind the code. One table per exported component, then hooks, functions and types.

TestResults

Extends ComponentProps<'div'>.

PropTypeDefaultDescription
suitesTestSuite[]required{ id, name, tests } where a test is { id, name, status, duration?, error? }.

Functions

FunctionSignatureDescription
suiteStatus(suite: TestSuite) => TestStatusExported roll-up. Derived, so a suite cannot claim to pass while containing a failure.

Types

TestCase

FieldTypeDescription
idstring—
namestring—
statusTestStatus—
duration?numberSeconds.
error?ReactNodeRendered under the test on a tinted ground — a Terminal, usually.

TestSuite

FieldTypeDescription
idstring—
namestring—
testsTestCase[]—
TypeDefinitionDescription
TestStatus
'passed' | 'failed' | 'skipped' | 'running'
A test run: suites, their tests, and the output of anything that failed.