shadcn.io is not affiliated with official shadcn/ui
Regression Tests Dashboard Block for Ark UI
Two test runs compared: baseline and candidate selects over six typed runs, a count strip filtering Regressed, Fixed and Still failing, a table with failure details per test, and a quarantine switch that adjusts the pass rate.
Installation
Overview
See which tests broke between two runs and which got fixed, with this regression panel for React with Ark UI. A hairline frame with a plus mark on each corner starts with two Native Selects, Baseline and Candidate, over six Flakewatch runs. A strip of chips shows the counts and filters the table: All changed, Regressed (passed, now fails), Fixed (failed, now passes) and Still failing. Each row names the test and its suite, shows the change as a glyph and a word, and has a Details button that opens the failure message and how many times it was retried. A Switch per test quarantines it, which takes it out of the pass rate in the header ("Pass rate 98%, excluding 1 quarantined"). The list is a fixed-height region, so filtering to nothing shows an Empty state without moving the panel. For CI dashboards and release checks.
FAQ
How do I fill it with my runs?
Edit RUNS: an id, a label and fails, the ids of the tests that failed in that run, and TESTS, where each test has a name, a suite, the failure message and its retries. TOTAL is the size of the whole suite, which only the pass rate uses. The change of each test is worked out by comparing the two runs you pick.
How is a change decided?
A test that failed in the candidate and passed in the baseline is Regressed, one that failed in the baseline and passes now is Fixed, and one that failed in both is Still failing. Tests that did the same in both runs are not listed. Picking the same run on both sides shows an empty state that says so.
What does quarantine do?
It removes the test from the pass rate in the header and the status line: the figure is the share of the suite that passed, leaving quarantined tests out of both sides. The switch only changes this page; it does not skip the test in your runner, so wire it to your own list of quarantined tests.
Does filtering move the panel?
No. The table sits in a region of fixed height that scrolls, with a sticky header, and the count strip shows how many tests each filter would list. Choosing a filter closes any open details and announces how many tests are shown.