---
title: Vitest reference
description: Reference documentation for Allure Vitest integration | How to add sub-steps and additional metadata | Create attachments | Organise tests
---

# Allure Vitest reference

These are the functions that you can use to integrate your Vitest tests with Allure.

In most cases, Allure Vitest provides two different ways to use a feature: the Runtime API and the Metadata API.

- **Runtime API**: use Allure's functions to add certain data to the test result during its execution. This approach allows for constructing the data dynamically.

  Note that it is recommended to call the Allure's functions as close to the beginning of the test as possible. This way, the data will be added even if the test fails early.

- **Metadata API**: add a metadata tag (beginning with `@`) into the test name. Allure Vitest will extract it and update the test result's data accordingly. When using this approach, the data is guaranteed to be added regardless of how the test itself runs.

## Metadata

Assign a test's [description, links and other metadata](/docs/v2/readability/#description-links-and-other-metadata).

### Title

- `allure.displayName(name: string): PromiseLike<void>`

Set the test's [title](/docs/v2/readability/#title).

```ts
import * as allure from "allure-js-commons";
import { test } from "vitest";

test("Test Authentication", async () => {
  await allure.displayName("Test Authentication!");
  // ...
});
```

### Description

- `allure.description(markdown: string): PromiseLike<void>`

Set the test's [description](/docs/v2/readability/#description). Markdown formatting is allowed. Any HTML formatting, if present, will be stripped for security purposes.

```ts
import * as allure from "allure-js-commons";
import { test } from "vitest";

test("Test Authentication", async () => {
  await allure.description("This test attempts to log into the website.");
  // ...
});
```

### Owner

- `allure.owner(name: string): PromiseLike<void>`
- `@allure.label.owner:⟨VALUE⟩`

Set the test's [owner](/docs/v2/readability/#owner).

**Runtime API:**
```ts
import * as allure from "allure-js-commons";
import { test } from "vitest";

test("Test Authentication", async () => {
  await allure.owner("John Doe");
  // ...
});
```

**Metadata API:**
```ts
import { test } from "vitest";

test("Test Authentication @allure.label.owner:JohnDoe", async () => {
  // ...
});
```

### Tag

- `allure.tag(name: string): PromiseLike<void>`
- `allure.tags(...tagsList: string[]): PromiseLike<void>`
- `@allure.label.tag:⟨VALUE⟩`

Set the test's [tags](/docs/v2/readability/#tags).

**Runtime API:**
```ts
import * as allure from "allure-js-commons";
import { test } from "vitest";

test("Test Authentication", async () => {
  await allure.tag("New UI");
  await allure.tags("Essentials", "Authentication");
  // ...
});
```

**Metadata API:**
```ts
import { test } from "vitest";

test("Test Authentication @allure.label.tag:WebInterface @allure.label.tag:Authentication", async () => {
  // ...
});
```

### Severity

- `allure.severity(name: string): PromiseLike<void>`
- `@allure.label.severity:⟨VALUE⟩`

Set the test's [severity](/docs/v2/readability/#severity).

Allowed values are: “trivial”, “minor”, “normal”, “critical”, and “blocker”.

**Runtime API:**
```ts
import * as allure from "allure-js-commons";
import { Severity } from "allure-js-commons";
import { test } from "vitest";

test("Test Authentication", async () => {
  await allure.severity(Severity.CRITICAL);
  // ...
});
```

**Metadata API:**
```ts
import { test } from "vitest";

test("Test Authentication @allure.label.severity:critical", async () => {
  // ...
});
```

### Label

- `allure.label(name: LabelName | string, value: string): PromiseLike<void>`
- `allure.labels(...labelsList: Label[]): PromiseLike<void>`
- `@allure.label.⟨NAME⟩:⟨VALUE⟩`

Set an arbitrary [label](/docs/v2/readability/#other-labels) for the test. This is the underlying implementation for a lot of Allure's other functions.

You can call `label()` multiple times to create an array of values under the given name.

**Runtime API:**
```ts
import * as allure from "allure-js-commons";
import { test } from "vitest";

test("Test Authentication", async () => {
  await allure.label("microservice", "UI");
  // ...
});
```

**Metadata API:**
```ts
import { test } from "vitest";

test("Test Authentication @allure.label.microservice:UI", async () => {
  // ...
});
```

### ID

- `@allure.id:⟨VALUE⟩`

Set the test's [ID](/docs/v2/readability/#id).

```ts
import { test } from "vitest";

test("Test Authentication @allure.id:123", async () => {
  // ...
});
```

### Link

- `allure.link(url: string, name?: string, type?: LinkType | string): PromiseLike<void>`
- `allure.links(...linksList: Link[]): PromiseLike<void>`
- `allure.issue(url: string, name?: string): PromiseLike<void>`
- `allure.tms(url: string, name?: string): PromiseLike<void>`

Add a [link](/docs/v2/readability/#links) related to the test.

Based on the `type` (which can be any string, defaults to “link”), Allure will try to load a corresponding **link template** to process the URL, as defined by the [`links`](/docs/vitest-configuration/#links) configuration option. If no template is found for the given type, the URL is left unmodified.

If the URL does not start with “http” or “https”, it will be processed according to the [`links`](/docs/vitest-configuration/#links) configuration option.

The `name` will be used as the link's text. If it is omitted, the URL will be used instead.

For convenience, Allure provides two shorthand functions with pre-selected link types: `issue` and `tms`.

```ts
import * as allure from "allure-js-commons";
import { test } from "vitest";

test("Test Authentication", async () => {
  await allure.issue("AUTH-123", "Related issue");
  await allure.tms("TMS-456", "Related TMS issue");
  await allure.link("JIRA-777", "Related Jira issue", "jira");
  await allure.link("https://example.com/", "Project website");
  // ...
});
```

## Behavior-based hierarchy

- `allure.epic(name: string): PromiseLike<void>`
- `allure.feature(name: string): PromiseLike<void>`
- `allure.story(name: string): PromiseLike<void>`
- `@allure.label.epic:⟨VALUE⟩`
- `@allure.label.feature:⟨VALUE⟩`
- `@allure.label.story:⟨VALUE⟩`

Assign names of **epics**, **features** or **user stories** for a test, as part of Allure's [behavior-based hierarchy](/docs/v2/navigation/#behavior-based-hierarchy).

**Runtime API:**
```ts
import * as allure from "allure-js-commons";
import { test } from "vitest";

test("Test Authentication", async () => {
  await allure.epic("Web interface");
  await allure.feature("Essential features");
  await allure.story("Authentication");
  // ...
});
```

**Metadata API:**
```ts
import { test } from "vitest";

test(
  "Test Authentication" +
    " @allure.label.epic:WebInterface" +
    " @allure.label.feature:EssentialFeatures" +
    " @allure.label.story:Authentication",
  async () => {
    // ...
  },
);
```

## Suite-based hierarchy

- `allure.parentSuite(name: string): PromiseLike<void>`
- `allure.suite(name: string): PromiseLike<void>`
- `allure.subSuite(name: string): PromiseLike<void>`
- `@allure.label.parentSuite:⟨VALUE⟩`
- `@allure.label.suite:⟨VALUE⟩`
- `@allure.label.subSuite:⟨VALUE⟩`

Assign the names of **parent suite**, **suite** or **sub-suite** for a test, as part of Allure's [suite-based hierarchy](/docs/v2/navigation/#suite-based-hierarchy).

This overrides the corresponding levels of the default suites hierarchy, which Allure Vitest creates based on the `describe()` arguments.

**Runtime API:**
```ts
import * as allure from "allure-js-commons";
import { test } from "vitest";

test("Test Authentication", async () => {
  await allure.parentSuite("Tests for web interface");
  await allure.suite("Tests for essential features");
  await allure.subSuite("Tests for authentication");
  // ...
});
```

**Metadata API:**
```ts
import { test } from "vitest";

test(
  "Test Authentication" +
    " @allure.label.parentSuite:TestsForWebInterface" +
    " @allure.label.suite:TestsForEssentialFeatures" +
    " @allure.label.subSuite:TestsForAuthentication",
  async () => {
    // ...
  },
);
```

## Test steps

- `allure.step<T = void>(name: string, body: (context: StepContext) => T | PromiseLike<T>): PromiseLike<T>`
- `allure.logStep(name: string, status?: Status, error?: Error): PromiseLike<void>`

Define a [test step or sub-step](/docs/steps/) with the given `name`.

The `step()` function is asynchronous, and it accepts an asynchronous anonymous function as its second argument. Notice the `async` and `await` keywords in the example below.

The anonymous function can accept either no arguments or a single argument of class `StepContext`. This object provides the following methods:

- `displayName()` — override the step name during its execution.
- `parameter()` — indicate arbitrary parameters used for the step. The available signatures of this method are similar to the test-wide implementation, see [Parametrized tests](#parametrized-tests).

To create a step without a body, call the `logStep()` function that accepts a name and an optional step status.

```ts
import * as allure from "allure-js-commons";
import { Status } from "allure-js-commons";
import { test } from "vitest";

test("Test Authentication", async () => {
  await allure.step("Step 1", async () => {
    await allure.step("Sub-step 1", async (ctx) => {
      await ctx.parameter("foo", "1");
      // ...
    });
    await allure.step("Sub-step 2", async (ctx) => {
      await ctx.parameter("foo", "2");
      // ...
    });
  });
  await allure.logStep("Step 2", Status.SKIPPED);
});
```

## Parametrized tests

- `allure.parameter(name: string, value: string, options?: ParameterOptions): PromiseLike<void>`

The [parametrized tests](/docs/v2/readability/#parametrized-tests) pattern in Vitest can be implemented by calling the [`test.each()`](https://vitest.dev/api/#test-each) function or even just by running a simple [`test()`](https://vitest.dev/api/#test) inside a loop. In both cases, Allure Report recognizes each iteration as a separate test run.

The values that distinguish one iteration from another are called test parameters. To display a parameter value in the test report, pass it to the `parameter()` function.

The `options` argument, if given, must be an object with two optional properties `excluded` and `mode`.

- If `excluded` is set to true, Allure will not use the parameter when comparing the current test result with previous one in the history. See [Common pitfall: a test's retries are displayed as separate tests](/docs/history-and-retries/#common-pitfall-a-tests-retries-are-displayed-as-separate-tests).

- The `mode` affects how the parameter will be displayed in the report. Available options are:

  - `"default"` (same as not specifying any mode) — the parameter and its value will be shown in a table along with other parameters.
  - `"masked"` — the parameter will be shown in the table, but its value will be hidden. Use this mode for passwords, tokens and other sensitive parameters.
  - `"hidden"` — the parameter and its value will not be shown in the test report.

  Note, that even when you use the `"masked"` or `"hidden"` mode, it is still possible to extract the value from the `allure_results` directory if you publish it.

**Using test():**
```ts
import * as allure from "allure-js-commons";
import { test } from "vitest";

for (const login of ["johndoe", "johndoe@example.com"]) {
  test(`Test Authentication as ${login}`, async () => {
    await allure.parameter("login", login);
    await allure.parameter("time", new Date().toUTCString(), { excluded: true });
    // ...
  });
}
```

**Using test.each():**
```ts
import * as allure from "allure-js-commons";
import { test } from "vitest";

test.each(["johndoe", "johndoe@example.com"])("Test Authentication as %s", async (login) => {
  await allure.parameter("login", login);
  await allure.parameter("time", new Date().toUTCString(), { excluded: true });
  // ...
});
```

## Attachments

- `allure.attachment(name: string, content: Buffer | string, options: ContentType | string | AttachmentOptions): PromiseLike<void>`
- `allure.attachmentPath(name: string, path: string, options: ContentType | string | Omit<AttachmentOptions, "encoding">): PromiseLike<void>`

Add an [attachment](/docs/attachments/) to the test result under the given `name`. Pass either the `content` or the `path` from which the data will be read.

The `options` argument controls the [media type](https://en.wikipedia.org/wiki/Media_type) of the content and the filename extension that will be used if a user downloads the attachment from the test report. You can either specify both options in an object (as shown for the image attachment below) or just specify the media type and let Allure deduce the appropriate filename extension automatically (as shown for the text attachment below). In either case, the media type can be a value from the `ContentType` enumeration or any string.

```ts
import * as allure from "allure-js-commons";
import { ContentType } from "allure-js-commons";
import { test } from "vitest";

test("Test Authentication", async () => {
  // ...

  await allure.attachment("Text file", "This is the file content.", ContentType.TEXT);

  await allure.attachmentPath("Screenshot", "/path/to/image.png", {
    contentType: ContentType.PNG,
    fileExtension: "png",
  });
});
```

When using [Vitest Browser Mode](/docs/vitest/#using-browser-mode), you can capture a screenshot of the browser page and attach it via `attachmentPath()`. Note that `page.screenshot()` from `@vitest/browser/context` saves the file to disk and returns the path — not the raw image bytes — so `attachmentPath()` is the correct function to use here:

```ts
import * as allure from "allure-js-commons";
import { ContentType } from "allure-js-commons";
import { test } from "vitest";
import { page } from "vitest/browser";

test("Renders the login form", async () => {
  // ...

  const screenshotPath = await page.screenshot();
  await allure.attachmentPath("Page screenshot", screenshotPath, {
    contentType: ContentType.PNG,
    fileExtension: "png",
  });
});
```