chore: move to vitest

package.json

@@ -28,7 +28,8 @@
   ],
   "scripts": {
     "build": "vite build && ./scripts/build-types.sh",
-    "test": "jest --passWithNoTests",
+    "test": "vitest run",
+    "test:watch": "vitest watch",
     "e2e": "playwright test",
     "lint": "eslint src test e2e --ext .ts,.tsx",
     "typecheck": "tsc --noEmit -p tsconfig.typecheck.json",
@@ -53,7 +54,6 @@
     "@testing-library/react": "^13.4.0",
     "@microsoft/api-extractor": "^7.33.7",
     "@playwright/test": "^1.22.2",
-    "@types/jest": "^26.0.20",
     "@types/jsdom": "^16.2.3",
     "@types/lodash": "^4.14.165",
     "@types/react": "^18.0.5",
@@ -64,6 +64,7 @@
     "@types/react-test-renderer": "^16.9.3",
     "@typescript-eslint/eslint-plugin": "^5.47.0",
     "@typescript-eslint/parser": "^5.47.0",
+    "@vitejs/plugin-react": "^3.0.0",
     "babel-eslint": "^10.0.0",
     "eslint": "^8.30.0",
     "eslint-config-prettier": "^8.5.0",
@@ -76,7 +77,6 @@
     "eslint-plugin-react": "^7.31.11",
     "eslint-plugin-react-hooks": "^4.6.0",
     "husky": "^6.0.0",
-    "jest": "^26.6.3",
     "jsdom": "^16.4.0",
     "lodash": "^4.17.21",
     "playwright": "^1.27.1",
@@ -89,12 +89,11 @@
     "react-table": "^7.7.0",
     "react-test-renderer": "^16.13.1",
     "semantic-release": "^19.0.5",
-    "ts-jest": "^26.5.1",
+    "terser": "^5.16.1",
     "tslib": "^2.0.0",
     "typescript": "^4.9.4",
-    "@vitejs/plugin-react": "^3.0.0",
-    "terser": "^5.16.1",
-    "vite": "^4.0.0"
+    "vite": "^4.0.0",
+    "vitest": "^0.26.2"
   },
   "resolutions": {
     "@types/react": "^16.14.2"

test/AATree.test.ts

@@ -1,10 +1,11 @@
 /* eslint @typescript-eslint/explicit-function-return-type: 0 */
+import { describe, it, expect } from 'vitest'
 
 import * as AA from '../src/AATree'
 import { AANode } from '../src/AATree'
 
 function range(start: number, end: number) {
-  const result = []
+  const result = [] as number[]
   for (let index = start; index <= end; index++) {
     result.push(index)
   }

test/List.test.tsx

@@ -5,9 +5,12 @@ import * as React from 'react'
 import ReactDOM from 'react-dom/client'
 import { act } from 'react-dom/test-utils'
 import { List } from '../src/List'
-jest.mock('../src/hooks/useSize')
-jest.mock('../src/hooks/useChangedChildSizes')
-jest.mock('../src/hooks/useScrollTop')
+
+import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest'
+
+vi.mock('../src/hooks/useSize')
+vi.mock('../src/hooks/useChangedChildSizes')
+vi.mock('../src/hooks/useScrollTop')
 ;(globalThis as any).IS_REACT_ACT_ENVIRONMENT = true
 
 describe('List', () => {

test/binaryArraySearch.test.ts

@@ -1,4 +1,5 @@
 import { findClosestSmallerOrEqual, findRange } from '../src/utils/binaryArraySearch'
+import { describe, it, expect } from 'vitest'
 
 function exampleComparator(item: number, value: number) {
   return value === item ? 0 : value < item ? -1 : 1

test/gridSystem.test.ts

@@ -1,5 +1,6 @@
 import { init, getValue, publish, subscribe } from '@virtuoso.dev/urx'
 import { gridSystem } from '../src/gridSystem'
+import { describe, it, expect, vi } from 'vitest'
 
 describe('grid system', () => {
   it('outputs a single probe item once totalCount is set', () => {
@@ -67,7 +68,7 @@ describe('grid system', () => {
       height: 200,
     })
 
-    const sub = jest.fn()
+    const sub = vi.fn()
     subscribe(gridState, sub)
 
     publish(scrollTop, 50)
@@ -165,7 +166,7 @@ describe('grid system', () => {
       width: 3,
       height: 2,
     })
-    const sub = jest.fn()
+    const sub = vi.fn()
     subscribe(gridState, sub)
     publish(scrollTop, 8)
     publish(scrollTop, 2)

test/groupedListSystem.ts → test/groupedListSystem.test.ts

@@ -1,4 +1,6 @@
 import { groupCountsToIndicesAndCount } from '../src/groupedListSystem'
+import { describe, it, expect } from 'vitest'
+
 describe('grouped list system', () => {
   describe('groupCountsToIndicesAndCount', () => {
     it('calculates total count and marks the group indices', () => {

test/interfaces.test.ts

@@ -3,6 +3,7 @@ import { TableVirtuosoProps, GroupedVirtuosoProps, VirtuosoGridProps, VirtuosoPr
 import { List } from '../src/List'
 import { Grid } from '../src/Grid'
 import { Table } from '../src/Table'
+import { describe, it, expect } from 'vitest'
 
 type CompProps<T> = T extends ForwardRefExoticComponent<infer R> ? R : never
 type ListProps = Omit<CompProps<typeof List>, 'groupCounts' | 'groupContent' | 'itemsRendered'>

test/listSystem.test.ts

@@ -1,6 +1,7 @@
 /* eslint-disable @typescript-eslint/no-unsafe-argument */
 import { listSystem } from '../src/listSystem'
 import { init, getValue, publish, subscribe } from '@virtuoso.dev/urx'
+import { describe, it, expect, beforeEach, vi } from 'vitest'
 
 describe('list engine', () => {
   describe('basics', () => {
@@ -56,7 +57,7 @@ describe('list engine', () => {
     it('updates the rows when new sizes are reported', () => {
       const { propsReady, sizeRanges, listState, scrollTop, viewportHeight, totalCount } = init(listSystem)
 
-      const sub = jest.fn()
+      const sub = vi.fn()
       subscribe(listState, sub)
 
       publish(scrollTop, 0)
@@ -84,7 +85,7 @@ describe('list engine', () => {
   })
 
   describe('initial index', () => {
-    it('starts from a specified location', (done) => {
+    it('starts from a specified location', () => {
       const INITIAL_INDEX = 300
       const SIZE = 30
       const { propsReady, initialTopMostItemIndex, listState, scrollTop, scrollTo, viewportHeight, totalCount, sizeRanges } =
@@ -99,27 +100,29 @@ describe('list engine', () => {
         items: [{ index: INITIAL_INDEX, size: 0, offset: 0 }],
       })
 
-      const sub = jest.fn()
+      const sub = vi.fn()
       subscribe(scrollTo, sub)
 
       publish(sizeRanges, [{ startIndex: INITIAL_INDEX, endIndex: INITIAL_INDEX, size: SIZE }])
 
       expect(getValue(listState).items).toHaveLength(0)
 
-      setTimeout(() => {
-        expect(sub).toHaveBeenCalledWith({
-          top: INITIAL_INDEX * SIZE,
-          behavior: 'auto',
-        })
+      return new Promise((resolve) => {
+        setTimeout(() => {
+          expect(sub).toHaveBeenCalledWith({
+            top: INITIAL_INDEX * SIZE,
+            behavior: 'auto',
+          })
 
-        // the UI responds by publishing back through the scrollTop stream
-        publish(scrollTop, INITIAL_INDEX * SIZE)
-        expect(getValue(listState).items).toHaveLength(7)
-        done()
+          // the UI responds by publishing back through the scrollTop stream
+          publish(scrollTop, INITIAL_INDEX * SIZE)
+          expect(getValue(listState).items).toHaveLength(7)
+          resolve(true)
+        })
       })
     })
 
-    it('starts from a specified location with fixed item size', (done) => {
+    it('starts from a specified location with fixed item size', () => {
       const INITIAL_INDEX = 300
       const SIZE = 30
       const { fixedItemHeight, propsReady, initialTopMostItemIndex, listState, scrollTop, scrollTo, viewportHeight, totalCount } =
@@ -135,21 +138,23 @@ describe('list engine', () => {
         items: [],
       })
 
-      const sub = jest.fn()
+      const sub = vi.fn()
       subscribe(scrollTo, sub)
 
       expect(getValue(listState).items).toHaveLength(0)
 
-      setTimeout(() => {
-        expect(sub).toHaveBeenCalledWith({
-          top: INITIAL_INDEX * SIZE,
-          behavior: 'auto',
-        })
+      return new Promise((resolve) => {
+        setTimeout(() => {
+          expect(sub).toHaveBeenCalledWith({
+            top: INITIAL_INDEX * SIZE,
+            behavior: 'auto',
+          })
 
-        // the UI responds by publishing back through the scrollTop stream
-        publish(scrollTop, INITIAL_INDEX * SIZE)
-        expect(getValue(listState).items).toHaveLength(7)
-        done()
+          // the UI responds by publishing back through the scrollTop stream
+          publish(scrollTop, INITIAL_INDEX * SIZE)
+          expect(getValue(listState).items).toHaveLength(7)
+          resolve(true)
+        })
       })
     })
   })
@@ -172,7 +177,7 @@ describe('list engine', () => {
       publish(viewportHeight, VIEWPORT)
       publish(totalCount, TOTAL_COUNT)
 
-      sub = jest.fn()
+      sub = vi.fn()
       subscribe(scrollTo, sub)
 
       publish(sizeRanges, [{ startIndex: 0, endIndex: 0, size: SIZE }])
@@ -221,7 +226,7 @@ describe('list engine', () => {
       })
     })
 
-    it('readjusts once when new sizes are reported', (done) => {
+    it('readjusts once when new sizes are reported', () => {
       const DEVIATION = 20
       publish(sti, { index: INDEX, align: 'end' })
 
@@ -232,18 +237,20 @@ describe('list engine', () => {
 
       publish(sr, [{ startIndex: INDEX - 1, endIndex: INDEX - 1, size: SIZE + DEVIATION }])
 
-      setTimeout(() => {
-        expect(sub).toHaveBeenCalledWith({
-          top: INDEX * SIZE - VIEWPORT + SIZE + DEVIATION,
-          behavior: 'auto',
-        })
-        done()
-      }, 20)
+      return new Promise((resolve) => {
+        setTimeout(() => {
+          expect(sub).toHaveBeenCalledWith({
+            top: INDEX * SIZE - VIEWPORT + SIZE + DEVIATION,
+            behavior: 'auto',
+          })
+          resolve(true)
+        }, 20)
+      })
     })
   })
 
   describe('scrolling up after a jump', () => {
-    it('readjusts measurements to avoid jump', (done) => {
+    it('readjusts measurements to avoid jump', () => {
       const INITIAL_INDEX = 300
       const SIZE = 30
       const {
@@ -267,46 +274,48 @@ describe('list engine', () => {
         items: [{ index: INITIAL_INDEX, size: 0, offset: 0 }],
       })
 
-      const sub = jest.fn()
+      const sub = vi.fn()
       subscribe(scrollTo, sub)
 
-      const scrollBySub = jest.fn()
+      const scrollBySub = vi.fn()
       subscribe(scrollBy, scrollBySub)
 
       publish(sizeRanges, [{ startIndex: INITIAL_INDEX, endIndex: INITIAL_INDEX, size: SIZE }])
 
       expect(getValue(listState).items).toHaveLength(0)
 
-      setTimeout(() => {
-        expect(sub).toHaveBeenCalledWith({
-          top: INITIAL_INDEX * SIZE,
-          behavior: 'auto',
-        })
-
+      return new Promise((resolve) => {
         setTimeout(() => {
-          publish(scrollContainerState, {
-            scrollTop: INITIAL_INDEX * SIZE,
-            scrollHeight: 1000 * 30,
-            viewportHeight: 200,
-          })
-
-          publish(scrollContainerState, {
-            scrollTop: INITIAL_INDEX * SIZE - 2,
-            scrollHeight: 1000 * 30,
-            viewportHeight: 200,
+          expect(sub).toHaveBeenCalledWith({
+            top: INITIAL_INDEX * SIZE,
+            behavior: 'auto',
           })
 
-          publish(sizeRanges, [
-            {
-              startIndex: INITIAL_INDEX - 1,
-              endIndex: INITIAL_INDEX - 1,
-              size: SIZE + 40,
-            },
-          ])
-
-          expect(scrollBySub).toHaveBeenCalledWith({ behavior: 'auto', top: 40 })
-          done()
-        }, 2500)
+          setTimeout(() => {
+            publish(scrollContainerState, {
+              scrollTop: INITIAL_INDEX * SIZE,
+              scrollHeight: 1000 * 30,
+              viewportHeight: 200,
+            })
+
+            publish(scrollContainerState, {
+              scrollTop: INITIAL_INDEX * SIZE - 2,
+              scrollHeight: 1000 * 30,
+              viewportHeight: 200,
+            })
+
+            publish(sizeRanges, [
+              {
+                startIndex: INITIAL_INDEX - 1,
+                endIndex: INITIAL_INDEX - 1,
+                size: SIZE + 40,
+              },
+            ])
+
+            expect(scrollBySub).toHaveBeenCalledWith({ behavior: 'auto', top: 40 })
+            resolve(true)
+          }, 1000)
+        })
       })
     })
   })
@@ -348,7 +357,7 @@ describe('list engine', () => {
   describe('grouped mode', () => {
     it('creates total count from groupCounts', () => {
       const { totalCount, groupCounts } = init(listSystem)
-      const sub = jest.fn()
+      const sub = vi.fn()
       subscribe(totalCount, sub)
       publish(groupCounts, [10, 10, 10])
       expect(sub).toHaveBeenCalledWith(33)
@@ -497,7 +506,7 @@ describe('list engine', () => {
       publish(headerHeight, 50)
       publish(footerHeight, 40)
       publish(sizeRanges, [{ startIndex: 0, endIndex: 0, size: 30 }])
-      const sub = jest.fn()
+      const sub = vi.fn()
       subscribe(totalListHeightChanged, sub)
       publish(propsReady, true)
 
@@ -516,7 +525,7 @@ describe('list engine', () => {
       publish(viewportHeight, 1200)
       publish(totalCount, 5)
       publish(sizeRanges, [{ startIndex: 0, endIndex: 0, size: 30 }])
-      const sub = jest.fn()
+      const sub = vi.fn()
       subscribe(paddingTopAddition, sub)
       publish(propsReady, true)
       expect(sub).toHaveBeenCalledWith(1200 - 5 * 30)