Introduction To React Testing: Snippet Missing Import Statement

[columk1]

Describe your suggestion

One of the code snippets from the lesson is missing the following import statement:

import { describe, it, expect } from 'vitest'`

Original snippet from the lesson:

// App.test.jsx

import { render, screen } from "@testing-library/react";
import App from "./App";

describe("App component", () => {
  it("renders correct heading", () => {
    render(<App />);
    expect(screen.getByRole("heading").textContent).toMatch(/our first test/i);
  });
});

Path

Node / JS

Lesson Url

https://www.theodinproject.com/lessons/node-path-react-new-introduction-to-react-testing

Checks

• [X] I have thoroughly read and understand The Odin Project Contributing Guide
• [X] Would you like to work on this issue?

(Optional) Discord Name

columk

(Optional) Additional Comments

No response

[columk1]

The issue was with my ESLInt not recognizing the vitest globals which we enabled in the lesson setup. I solved it by installing the vitest plugin using:

npm install -D eslint-plugin-vitest-globals

and then adding the following to the ESLint config file:

{
  "extends": ["plugin:vitest-globals/recommended"],
  "env": {
    "vitest-globals/env": true
  }
}

It shouldn't be an issue for others since ESLint wasn't part of the lesson. Closing.