https://github.com/chempogonzalez/vitest-react

🧪 Test utils setup for react/nextjs projects using Vitest
https://github.com/chempogonzalez/vitest-react

Last synced: 23 days ago
JSON representation

🧪 Test utils setup for react/nextjs projects using Vitest

• Host: GitHub
• URL: https://github.com/chempogonzalez/vitest-react
• Owner: chempogonzalez
• License: mit
• Created: 2022-05-03T19:30:06.000Z (almost 3 years ago)
• Default Branch: main
• Last Pushed: 2022-05-08T02:55:24.000Z (over 2 years ago)
• Last Synced: 2024-12-13T08:12:32.632Z (about 2 months ago)
• Language: JavaScript
• Size: 473 KB
• Stars: 1
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# 🧪 vitest-react [![standard-readme compliant](https://img.shields.io/badge/readme%20style-standard-brightgreen.svg?style=flat-square)](https://github.com/RichardLitt/standard-readme)



> Auto setup project to use Vitest with TypeScript + test-utils

## 🔖 Description

Tool to auto initialize vitest config for react/nextjs projects. Allow to use common test utils methods.

## 📦 Installation

```zsh

# Install the package

$ npm install -D vitest-react

```

## 🚀 Usage

Just install the package and it will automatically create a vitest config file in your project root if needed.

Also you have some common test utils methods available:

```ts

/**

 * You can import some pre-setup common methods in your test files.

 */

import {

  render,

  renderWithNextRouter, // mocked next router

  renderWithProviders,  // wrap component in providers

  userEvent,            // all from @testing-library/user-event

  

  // All the @testing-library/react ones

  screen,

  waitFor,

  // ...

}

/**

 * You can also use methods from

 * @testing-library/jest-dom automatically

 */

  expect(element).toHaveClass('example-class')

  expect(element).toBeVisible()

  // ...

```

## 🤓 Happy Code

> Created with Typescript! ⚡ and latin music 🎺🎵