Matchers
Brisa extends the Bun testing runner with custom matchers to streamline the testing process. These matchers are designed to simplify the testing of Brisa components and their behavior.
toHaveAttribute
Verifies whether a specified attribute exists within the target element.
Example:
expect(element).toHaveAttribute("name", "value");
Types:
toHaveAttribute(name: string, value?: string): void;
toHaveTagName
Checks if the target element has a specific HTML tag.
Example:
expect(div).toHaveTagName("div"); // pass
expect(span).toHaveTagName("div"); // fail
Types:
toHaveTagName(tagName: string): void;
toHaveTextContent
Ensures that the target element renders the expected text content.
Example:
expect(text).toHaveTextContent("text"); // pass
expect(text).toHaveTextContent("xt"); // fail
Types:
toHaveTextContent(text: string): void;
toContainTextContent
Verifies if the rendered text content contains a specific string.
Example:
expect(text).toContainTextContent("text"); // pass
expect(text).toContainTextContent("xt"); // pass
Types:
toContainTextContent(text: string): void;
toHaveStyle
Validates the styling properties of the target element.
Example:
expect(red).toHaveStyle("color", "red"); // pass
expect(red).toHaveStyle("color", "blue"); // fail
Types:
toHaveStyle(property: string, value: string): void;
toHaveClass
Checks for the presence of a specified CSS class within the target element.
Example:
expect(input).toHaveClass("form-control"); // pass
expect(button).toHaveClass("btn-primary"); // pass
Types:
toHaveClass(className: string): void;
toHaveValue
Verifies the current value of form elements such as input fields.
Example:
expect(input).toHaveValue("example");
Types:
toHaveValue(value: string): void;
toHaveFocus
Indicates whether the target element currently has focus.
Example:
expect(input).toHaveFocus();
expect(input).not.toHaveFocus();
Types:
toHaveFocus(): void;
toBeVisible
Checks if the target element is visible within the DOM.
Example:
expect(element).toBeVisible();
expect(element).not.toBeVisible();
Types:
toBeVisible(): void;
toBeEnabled
Verifies that the target element is enabled and interactive.
Example:
expect(button).toBeEnabled();
expect(button).not.toBeEnabled();
Types:
toBeEnabled(): void;
toBeDisabled
Indicates whether the target element is disabled and non-interactive.
Example:
expect(button).toBeDisabled();
expect(button).not.toBeDisabled();
Types:
toBeDisabled(): void;
toBeChecked
Checks if the target element is checked.
Example:
expect(checkbox).toBeChecked();
expect(checkbox).not.toBeChecked();
Types:
toBeChecked(): void;
toBeSelected
Indicates whether the target element is selected.
Example:
expect(option).toBeSelected();
expect(option).not.toBeSelected();
Types:
toBeSelected(): void;
toBeRequired
Indicates whether the target element is required.
Example:
expect(input).toBeRequired();
expect(input).not.toBeRequired();
Types:
toBeRequired(): void;
toBeInvalid
Indicates whether the target element is invalid.
Example:
expect(input).toBeInvalid();
expect(input).not.toBeInvalid();
Types:
toBeInvalid(): void;
toBeValid
Checks if the target element is valid.
Example:
expect(input).toBeValid();
expect(input).not.toBeValid();
Types:
toBeValid(): void;
toBeInputTypeOf
Verifies the target element type.
Example:
expect(input).toBeInputTypeOf("text");
expect(input).not.toBeInputTypeOf("password");
Types:
toBeInputTypeOf(type: string): void;
toBeInTheDocument
Checks if the target element is present in the DOM.
Example:
expect(element).toBeInTheDocument();
expect(element).not.toBeInTheDocument();
Types:
toBeInTheDocument(): void;
toHaveElementByNodeName
Verifies the presence of an element with a specific node name.
Example:
expect(element).toHaveElementByNodeName("div");
expect(element).not.toHaveElementByNodeName("span");
Types:
toHaveElementByNodeName(nodeName: string): void;
More Matchers from Bun
In addition to the custom matchers provided by Brisa, you can also use the default matchers from Bun, such as toBe
, toEqual
, toBeTruthy
, toBeFalsy
...
For more information on how to use these matchers, refer to the Bun documentation.