davidl/tolaria
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: use proper ESM imports in test setup for TypeScript compatibility

Browse Source 
Replace require('react') with ESM imports of createElement and types
from React. This fixes the TS2591 error in tsc build for setup.ts.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
lucaronin
2026-02-23 21:16:20 +01:00
parent f6a4ab14de
commit fa0049f7f8
1 changed files with 35 additions and 38 deletions
Download Patch File Download Diff File Expand all files Collapse all files

73
src/test/setup.ts
View File

@@ -1,43 +1,40 @@
import '@testing-library/jest-dom/vitest'
import { vi } from 'vitest'
import { createElement, type ReactNode, type ComponentType } from 'react'
// Mock react-virtuoso: JSDOM has no real viewport, so render all items directly
vi.mock('react-virtuoso', () => {
const React = require('react')
return {
Virtuoso: ({ data, itemContent, components }: {
data?: unknown[]
itemContent?: (index: number, item: unknown) => React.ReactNode
components?: { Header?: React.ComponentType }
}) => {
const Header = components?.Header
return React.createElement('div', { 'data-testid': 'virtuoso-mock' },
Header ? React.createElement(Header) : null,
data?.map((item: unknown, index: number) =>
React.createElement('div', { key: index }, itemContent?.(index, item))
vi.mock('react-virtuoso', () => ({
Virtuoso: ({ data, itemContent, components }: {
data?: unknown[]
itemContent?: (index: number, item: unknown) => ReactNode
components?: { Header?: ComponentType }
}) => {
const Header = components?.Header
return createElement('div', { 'data-testid': 'virtuoso-mock' },
Header ? createElement(Header) : null,
data?.map((item: unknown, index: number) =>
createElement('div', { key: index }, itemContent?.(index, item))
)
)
},
GroupedVirtuoso: ({ groupCounts, groupContent, itemContent }: {
groupCounts: number[]
groupContent: (index: number) => ReactNode
itemContent: (index: number, groupIndex: number) => ReactNode
}) => {
let globalIndex = 0
return createElement('div', { 'data-testid': 'grouped-virtuoso-mock' },
groupCounts?.map((count: number, groupIndex: number) => {
const items = []
for (let i = 0; i < count; i++) {
items.push(createElement('div', { key: globalIndex }, itemContent(globalIndex, groupIndex)))
globalIndex++
}
return createElement('div', { key: `group-${groupIndex}` },
groupContent(groupIndex),
...items
)
)
},
GroupedVirtuoso: ({ groupCounts, groupContent, itemContent }: {
groupCounts: number[]
groupContent: (index: number) => React.ReactNode
itemContent: (index: number, groupIndex: number) => React.ReactNode
}) => {
const React = require('react')
let globalIndex = 0
return React.createElement('div', { 'data-testid': 'grouped-virtuoso-mock' },
groupCounts?.map((count: number, groupIndex: number) => {
const items = []
for (let i = 0; i < count; i++) {
items.push(React.createElement('div', { key: globalIndex }, itemContent(globalIndex, groupIndex)))
globalIndex++
}
return React.createElement('div', { key: `group-${groupIndex}` },
groupContent(groupIndex),
...items
)
})
)
},
}
})
})
)
},
}))