work on test speed

.eslintrc.js

@@ -19,8 +19,35 @@ module.exports = {
 		sourceType: 'module',
 		project: './tsconfig.json',
 	},
-	plugins: ['react', '@typescript-eslint'],
-	rules: {},
+	plugins: ['react', '@typescript-eslint', 'regex'],
+	rules: {
+		'regex/required': [
+			'error',
+			[
+				{
+					regex: 'describe.+from.+vitest',
+					message: 'Import `describe` explicitly.',
+					files: {
+						inspect: '\\.(test|spec)\\.tsx?$',
+					},
+				},
+				{
+					regex: 'it.+from.+vitest',
+					message: 'Import `it` explicitly.',
+					files: {
+						inspect: '\\.(test|spec)\\.tsx?$',
+					},
+				},
+				{
+					regex: 'expect.+from.+vitest',
+					message: 'Import `expect` explicitly.',
+					files: {
+						inspect: '\\.(test|spec)\\.tsx?$',
+					},
+				},
+			],
+		],
+	},
 	settings: {
 		react: {
 			version: 'detect',

__mocks__/react-list.tsx

@@ -1,5 +1,5 @@
 import React, { forwardRef } from 'react';
-import { vi } from 'vitest';
+import { vi, beforeEach } from 'vitest';
 
 declare module 'react-list' {
 	const __listRef: {

global-setup.ts

@@ -18,11 +18,6 @@ module.exports = async () => {
 	process.env.TZ = 'America/Chicago';
 };
 
-// vi.mock('react', async () => ({
-// 	...(await vi.importActual('react')),
-// 	useLayoutEffect: (await vi.importActual('react')).useEffect,
-// }));
-
 vi.mock('@mui/x-date-pickers');
 
 global.scrollTo = vi.fn() as any;

package.json

@@ -79,6 +79,7 @@
 		"eslint-plugin-prettier": "^4.2.1",
 		"eslint-plugin-react": "^7.30.1",
 		"eslint-plugin-react-hooks": "^4.6.0",
+		"eslint-plugin-regex": "^1.10.0",
 		"eslint-plugin-testing-library": "^5.6.0",
 		"jsdom": "^20.0.0",
 		"prettier": "2.4.1",

src/App.spec.tsx

@@ -13,7 +13,7 @@ import { MemoryRouter } from 'react-router-dom';
 import { __listRef } from 'react-list';
 import { waitFor, screen } from '@testing-library/react';
 import { addTask } from './lib/api';
-import { vi, Mock } from 'vitest';
+import { vi, Mock, describe, it, expect, beforeEach } from 'vitest';
 import getQueryClient from './lib/getQueryClient';
 import { QueryClient } from 'react-query';
 import loadControlledPromise from './lib/test/loadControlledPromise';

src/components/molecules/FilterButton.spec.tsx

@@ -4,6 +4,7 @@ import React from 'react';
 import userEvent from '@testing-library/user-event';
 import { renderWithQueryProvider } from '../../lib/test/helpers';
 import { setCookie } from '../../lib/setCookie';
+import { expect, it, describe } from 'vitest';
 
 describe('FilterButton', () => {
 	it('uses local storage', async () => {

src/components/molecules/Task.spec.tsx

@@ -13,7 +13,7 @@ import { waitFor } from '@testing-library/dom';
 import browser from '../../lib/Browser';
 import { editTask } from '../../lib/api/editTask';
 import { screen } from '@testing-library/react';
-import { vi, Mock } from 'vitest';
+import { vi, Mock, expect, it, describe, beforeEach } from 'vitest';
 import { queryTaskCheckbox } from '../../lib/test/queries';
 
 vi.mock('../../lib/api/updateTask');

src/components/organisms/ApiSettings.spec.tsx

@@ -4,7 +4,7 @@ import { screen } from '@testing-library/react';
 import React from 'react';
 import ApiSettings from './ApiSettings';
 import { apiFetch } from '../../lib/api';
-import { vi, Mock } from 'vitest';
+import { vi, Mock, expect, it, describe } from 'vitest';
 
 vi.mock('../../lib/api/getMe');
 vi.mock('../../lib/api/updateMe');

src/components/organisms/BeeminderSettings.spec.tsx

@@ -9,7 +9,7 @@ import {
 	withMutedReactQueryLogger,
 } from '../../lib/test/helpers';
 import userEvent from '@testing-library/user-event';
-import { vi } from 'vitest';
+import { vi, expect, it, describe, beforeEach } from 'vitest';
 import { updateMe } from '../../lib/api';
 import { getMe } from '../../lib/api';
 

src/components/organisms/DueForm.spec.tsx

@@ -4,7 +4,7 @@ import { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider';
 import React from 'react';
 import TaskForm, { TaskFormProps } from './TaskForm';
 import userEvent from '@testing-library/user-event';
-import { vi } from 'vitest';
+import { vi, describe, it, expect } from 'vitest';
 
 vi.mock('@mui/x-date-pickers');
 

src/components/organisms/GeneralSettings.spec.tsx

@@ -3,7 +3,7 @@ import React from 'react';
 import GeneralSettings from './GeneralSettings';
 import userEvent from '@testing-library/user-event';
 import { screen } from '@testing-library/react';
-import { vi } from 'vitest';
+import { vi, expect, it, describe } from 'vitest';
 
 vi.mock('../../lib/api/getMe');
 vi.mock('../../lib/api/updateMe');
@@ -16,6 +16,6 @@ describe('general settings', () => {
 
 		userEvent.click(screen.getByText('Save'));
 
-		await screen.findByRole('progressbar');
+		expect(await screen.findByRole('progressbar')).toBeInTheDocument();
 	});
 });

src/components/organisms/Login.spec.tsx

@@ -5,7 +5,7 @@ import { renderWithQueryProvider } from '../../lib/test/helpers';
 import Login from './Login';
 import React from 'react';
 import userEvent from '@testing-library/user-event';
-import { vi } from 'vitest';
+import { vi, expect, it, describe, beforeEach } from 'vitest';
 import { screen } from '@testing-library/react';
 
 vi.mock('../../lib/LegacyApi');

src/components/organisms/NavBar.spec.tsx

@@ -4,7 +4,7 @@ import { useSession } from '../../lib/api/useSession';
 import userEvent from '@testing-library/user-event';
 import { screen, waitFor } from '@testing-library/react';
 import { BrowserRouter } from 'react-router-dom';
-import { vi, Mock } from 'vitest';
+import { vi, Mock, expect, it, describe } from 'vitest';
 import { renderWithQueryProvider } from '../../lib/test/helpers';
 
 vi.mock('../../lib/api/useSession');

src/components/organisms/PasswordSettings.spec.tsx

@@ -3,7 +3,7 @@ import { renderWithQueryProvider } from '../../lib/test/helpers';
 import PasswordSettings from './PasswordSettings';
 import userEvent from '@testing-library/user-event';
 import { screen } from '@testing-library/react';
-import { vi } from 'vitest';
+import { vi, expect, it, describe } from 'vitest';
 
 vi.mock('../../lib/api/updatePassword');
 
@@ -17,7 +17,9 @@ describe('password settings', () => {
 
 		userEvent.click(await screen.findByText('Save'));
 
-		await screen.findByText("Passwords don't match");
+		expect(
+			await screen.findByText("Passwords don't match")
+		).toBeInTheDocument();
 	});
 
 	it('indicates loading state', async () => {

src/components/organisms/PaymentSettings.spec.tsx

@@ -4,7 +4,7 @@ import userEvent from '@testing-library/user-event';
 import { waitFor, screen } from '@testing-library/react';
 import PaymentSettings from './PaymentSettings';
 import { useCheckoutSession } from '../../lib/api';
-import { vi, Mock } from 'vitest';
+import { vi, Mock, expect, it, describe } from 'vitest';
 
 vi.mock('../../lib/api/getMe');
 vi.mock('../../lib/api/updateMe');

src/components/organisms/TaskForm.spec.tsx

@@ -5,7 +5,7 @@ import userEvent from '@testing-library/user-event';
 import { TaskFormProps } from './TaskForm';
 import { AdapterDateFns } from '@mui/x-date-pickers/AdapterDateFns';
 import { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider';
-import { vi } from 'vitest';
+import { vi, expect, it, describe } from 'vitest';
 
 vi.mock('../../lib/Browser');
 vi.mock('@mui/x-date-pickers');

src/components/organisms/TaskForm.tsx

@@ -48,7 +48,7 @@ const TaskForm = (props: TaskFormProps): JSX.Element => {
 	} = props;
 	const [recurrenceEnabled, setRecurrenceEnabled] = useState<boolean>(false);
 	const [interval, setInterval] = useState<number>(1);
-	console.log(due);
+
 	return (
 		<Box component={'form'} className={'organism-taskForm'}>
 			<Stack spacing={2}>

src/components/pages/Account.spec.tsx

@@ -8,7 +8,7 @@ import {
 	renderWithQueryProvider,
 } from '../../lib/test/helpers';
 import userEvent from '@testing-library/user-event';
-import { vi } from 'vitest';
+import { vi, expect, it, describe, beforeEach } from 'vitest';
 import { useGetApiToken } from '../../lib/api';
 import { getCheckoutSession } from '../../lib/api/getCheckoutSession';
 

src/components/pages/RecurringTasks.spec.tsx

@@ -5,7 +5,7 @@ import RecurringTasks from './RecurringTasks';
 import getRecurringTasks from '../../lib/api/getRecurringTasks';
 import updateRecurringTask from '../../lib/api/updateRecurringTask';
 import { loadMe, renderWithQueryProvider } from '../../lib/test/helpers';
-import { vi, Mock } from 'vitest';
+import { vi, Mock, describe, it, expect, beforeEach } from 'vitest';
 
 vi.mock('../../lib/api/getRecurringTasks');
 vi.mock('../../lib/api/getMe');

src/components/pages/Register.spec.tsx

@@ -8,7 +8,7 @@ import Register from './Register';
 import { waitFor, screen } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
 import { getTimezones } from '../../lib/api';
-import { vi } from 'vitest';
+import { vi, expect, it, describe, beforeEach } from 'vitest';
 import register from '../../lib/api/register';
 
 vi.mock('../../lib/api/getCheckoutSession');

src/components/pages/Tasks.spec.tsx

@@ -15,7 +15,7 @@ import { getUnloadMessage } from '../../lib/getUnloadMessage';
 import browser from '../../lib/Browser';
 import { __listRef } from '../../../__mocks__/react-list';
 import { editTask } from '../../lib/api/editTask';
-import { vi, Mock } from 'vitest';
+import { vi, Mock, describe, it, expect, beforeEach } from 'vitest';
 import loadControlledPromise from '../../lib/test/loadControlledPromise';
 import { findTaskCheckbox } from '../../lib/test/queries';
 

src/lib/LegacyApi.spec.tsx

@@ -1,5 +1,6 @@
 import { login } from './LegacyApi';
 import { waitFor } from '@testing-library/react';
+import { expect, it, describe } from 'vitest';
 
 describe('LegacyApi', () => {
 	it('stores session token on successful login', async () => {

src/lib/api/apiFetch.spec.ts

@@ -1,4 +1,5 @@
 import { apiFetch } from './apiFetch';
+import { expect, it, describe } from 'vitest';
 
 describe('apiFetch', () => {
 	it('uses localStorage token', async () => {

src/lib/api/updateMe.spec.ts

@@ -1,7 +1,7 @@
 import { updateMe } from './updateMe';
 import { apiFetch } from './apiFetch';
 import _ from 'lodash';
-import { vi } from 'vitest';
+import { vi, expect, it, describe, beforeEach } from 'vitest';
 
 vi.mock('./apiFetch');
 

src/lib/api/useSession.spec.tsx

@@ -1,5 +1,6 @@
 import { logout, useSession } from './useSession';
 import { act, renderHook } from '@testing-library/react';
+import { expect, it, describe } from 'vitest';
 
 describe('useSession', () => {
 	it('should return the session', () => {

src/lib/getUnloadMessage.spec.tsx

@@ -2,7 +2,7 @@ import { getUnloadMessage } from './getUnloadMessage';
 import React from 'react';
 import { useUpdateTask } from './api/useUpdateTask';
 import { renderWithQueryProvider, resolveWithDelay } from './test/helpers';
-import { vi } from 'vitest';
+import { vi, expect, it, describe } from 'vitest';
 import { updateTask } from './api';
 
 vi.mock('./api/updateTask');

src/lib/sortTasks.spec.ts

@@ -1,5 +1,6 @@
 import { makeTask } from './test/helpers';
 import { sortTasks } from './sortTasks';
+import { expect, it, describe } from 'vitest';
 
 describe('sortTasks', () => {
 	it('has secondary sort by stakes', () => {

src/lib/test/helpers.tsx

@@ -13,7 +13,7 @@ import {
 import { waitFor } from '@testing-library/dom';
 import { AdapterDateFns } from '@mui/x-date-pickers/AdapterDateFns';
 import { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider';
-import { vi, Mock, SpyInstance } from 'vitest';
+import { vi, Mock, SpyInstance, expect } from 'vitest';
 import { getMe, updateMe } from '../api';
 import { createTheme, ThemeProvider } from '@mui/material/styles';
 

src/lib/useDifferenceToNow.spec.ts

@@ -1,5 +1,6 @@
 import useDifferenceToNow from './useDifferenceToNow';
 import { loadNowTime, makeTask } from './test/helpers';
+import { expect, it, describe } from 'vitest';
 
 describe('useDifferenceToNow', () => {
 	it('handles future due', () => {

src/lib/useIsDue.spec.ts

@@ -1,5 +1,6 @@
 import useIsDue from './useIsDue';
 import { loadNowTime, makeTask } from './test/helpers';
+import { expect, it, describe } from 'vitest';
 
 describe('useIsDue', () => {
 	it('returns is due', () => {

src/vitest.spec.ts

@@ -1,4 +1,4 @@
-import { describe, it } from 'vitest';
+import { describe, it, expect } from 'vitest';
 
 describe('vitest', () => {
 	it('test 1', () => {

tsconfig.json

@@ -15,7 +15,7 @@
 		"isolatedModules": true,
 		"noEmit": true,
 		"jsx": "react-jsx",
-		"types": ["vitest/globals", "@testing-library/jest-dom"],
+		"types": ["@testing-library/jest-dom"],
 		"allowUnreachableCode": true
 	},
 	"include": ["src", "vite.config.ts", "global-setup.ts", "__mocks__"],

vite.config.ts

@@ -1,17 +1,14 @@
 /// <reference types="vitest" />
-/// <reference types="vitest/globals" />
 import { defineConfig } from 'vitest/config';
 import react from '@vitejs/plugin-react';
 import { visualizer } from 'rollup-plugin-visualizer';
 
 export default defineConfig({
 	plugins: [react(), visualizer()],
 	test: {
-		globals: true,
 		environment: 'jsdom',
 		setupFiles: ['./global-setup.ts'],
 		mockReset: true,
-		include: ['./src/**/*.spec.{ts,tsx}'],
 		reporters: 'dot',
 	},
 });