Skip to content
The docs are now organized by product area. Old links still work. Report a broken link

Vitest reporter

Install @qualflare/vitest for Vitest 3 or later, add it to vitest.config.ts and upload the qualflare-results folder with the Qualflare CLI.

Last updated

@qualflare/vitest is the Qualflare reporter for Vitest 3 or later: it writes each vitest run's results, with per-attempt retries, assertion diffs and nested steps, to ./qualflare-results, and qf <identifier> collect uploads the folder as one launch.

FactDetail
Package@qualflare/vitest on npm
Works withVitest 3 or later, Node.js 18 or later (Vitest 4 needs Node.js 20)
qfqf ≥ 0.1.24 (requires qf 0.1.24 or later)
LicenseApache-2.0
SourceQualflare/qualflare-vitest on GitHub
Without the reporter--format vitest with Vitest's Jest-compatible JSON results

Before you begin

  • The Qualflare CLI, qf: Install the CLI.
  • A saved login: qf login <identifier> with a project access token whose creator still holds the project role that uploads need Editor+ · project (requires the Editor role or higher in the project) (Authenticate with qf login).
  • The Identifier of the environment the results belong to (Environments).

Install

npm install --save-dev @qualflare/vitest

Vitest 2 and earlier aren't supported.

Configure

// vitest.config.ts
import { defineConfig } from 'vitest/config';
import { qualflareReporter } from '@qualflare/vitest';

export default defineConfig({
  test: {
    reporters: [['default'], qualflareReporter({ environment: 'staging' })],
  },
});

The tuple form works too: ['@qualflare/vitest/reporter', { environment: 'staging' }].

Every reporter shares the other settings: see Reporter configuration.

Set environment to the environment's Identifier: a name such as Staging fails the upload with HTTP 400 (Environment).

Run and upload

npx vitest run
qf <identifier> collect ./qualflare-results

Run in CI

- name: Upload results to Qualflare
  if: ${{ !cancelled() }}
  env:
    QF_TOKEN: ${{ secrets.QF_TOKEN }}
    QF_BRANCH: ${{ github.head_ref || github.ref_name }}
    QF_COMMIT: ${{ github.event.pull_request.head.sha || github.sha }}
  run: |
    npm install -g @qualflare/cli
    qf login ci --force
    qf ci collect ./qualflare-results

if: ${{ !cancelled() }} uploads the results when tests fail, and QF_BRANCH and QF_COMMIT record a pull request's own branch and commit (Pull request branches). For GitLab CI/CD, Jenkins and Azure Pipelines, see Run the upload when tests fail.

Sharding and retries

Vitest passes its own --shard to the reporter, which converts it to a 0-based shard index. Point every shard at the same folder: see Merge sharded CI jobs into one launch.

Vitest has no per-attempt record, so the reporter rebuilds the attempts from the error list: attempts have no duration, and a test that uses expect.soft() sends no attempts.

What gets uploaded

  • Status and retries.
  • Assertion diffs.
  • Steps and attachments.
  • Labels, links, tags and priority.

Vitest has no test.step(): steps come only from qualflare.step(). A test sets its own metadata with the qualflare calls:

import { test } from 'vitest';
import { qualflare } from '@qualflare/vitest';

test('a user can check out', async () => {
  qualflare.label('epic', 'Billing');
  qualflare.link('https://tracker.example/QF-42', { type: 'issue', name: 'QF-42' });
  qualflare.tag('smoke');
  qualflare.priority('high');
  await qualflare.step('add an item to the cart', () => {
    qualflare.parameter('sku', 'BOOK-1');
  });
});

qf doesn't read the branch, commit, language or milestone from the report: set them on the upload (Branch, commit, language and milestone).

Troubleshooting

  • Browser-mode screenshots and traces aren't attached.
  • Only PNG, JPEG and GIF attachments upload as files; other types stay inside the report.
  • environment "Staging" does not exist in this project: use the environment's Identifier, or pass --environment on the upload (Environment).
  • Screenshots can't be downloaded: qf is older than 0.1.24. Upgrade qf.