Expression expected || No tests were found

Question

why through the ribbon "render();",I get the error "Expression expected" Welcome.test.js

import { render, screen } from "@testing-library/react";
import Welcome from "../Page/Welcome/Welcome.jsx";
test("renders learn react link", () => {
  render(<Welcome />);
  const linkElement = screen.getByText(/learn react/i);
  expect(linkElement).toBeInTheDocument();
});

setup.js import "@testing-library/jest-dom";

vite.config.js

import { defineConfig } from "vite";
import react from "@vitejs/plugin-react";
import basicSSL from "@vitejs/plugin-basic-ssl";

export default defineConfig({
  plugins: [react(), basicSSL()],
  server: {
    open: "/",
  },
  preview: {
    open: true,
  },
  test: {
    globals: true,
    environment: "jsdom",
    setupFiles: "D:/web/AutoAiDoc/client/src/test/setup.js",
  },
});

(https://i.sstatic.net/QWT4y.png)

I just want run my test for check if component render

Answer 1

I resolved the error with this: vitest.config.js:

import { defineConfig } from 'vitest/config';
import react from '@vitejs/plugin-react';
console.log('Loaded vitest config');
export default defineConfig({
  plugins: [react()],
  test: {
    globals: true,
    environment: 'jsdom',
    setupFiles: './test/setupTest.js',
  }
});

And test/setupTest.js:

import '@testing-library/jest-dom'

And in my test files I use:

import { describe, expect, it, beforeAll, afterAll, test, vi } from 'vitest';
import { render, cleanup, fireEvent, screen, waitFor, act } from '@testing-library/react';
import userEvent from '@testing-library/user-event';

And I had to change all files that contain JSX from extension .js to .jsx

And now it's working.