Switch from jest from ts-jest to swc

.vscode/settings.json

@@ -34,6 +34,7 @@
     "pseudoterminal",
     "rwlock",
     "sonarjs",
+    "spyable",
     "stackframe",
     "subdir",
     "submodules",

extension/jest.config.js

@@ -4,12 +4,14 @@ module.exports = {
   coverageDirectory: 'coverage/jest',
   coveragePathIgnorePatterns: ['<rootDir>/src/test/'],
   coverageReporters: ['json'],
-  preset: 'ts-jest',
   testEnvironment: 'node',
   testPathIgnorePatterns: [
     '<rootDir>/src/test/',
     '<rootDir>/dist/',
     '<rootDir>/.vscode-test',
     '<rootDir>/.wdio-vscode-service'
-  ]
+  ],
+  transform: {
+    '^.+\\.(t|j)sx?$': ['@swc/jest']
+  }
 }

extension/package.json

@@ -1607,6 +1607,8 @@
     "uuid": "8.3.2"
   },
   "devDependencies": {
+    "@swc/core": "1.2.247",
+    "@swc/jest": "0.2.22",
     "@types/chai": "4.3.3",
     "@types/chai-as-promised": "7.1.5",
     "@types/copy-webpack-plugin": "10.1.0",
@@ -1644,7 +1646,6 @@
     "shx": "0.3.4",
     "sinon": "14.0.0",
     "sinon-chai": "3.7.0",
-    "ts-jest": "29.0.0-next.1",
     "ts-loader": "9.3.1",
     "vsce": "2.11.0",
     "vscode-uri": "3.0.3",

extension/src/common/logger.test.ts

@@ -1,5 +1,13 @@
 import { Logger } from './logger'
 
+jest.mock('console', () => {
+  const actualModule = jest.requireActual('console')
+  return {
+    __esModule: true,
+    ...actualModule
+  }
+})
+
 describe('Logger', () => {
   describe('error', () => {
     it('should be able to write an error to the console', () => {

extension/src/processExecution.ts

@@ -3,7 +3,6 @@ import { Readable } from 'stream'
 import { Event, EventEmitter } from 'vscode'
 import { Disposable } from '@hediet/std/disposable'
 import execa from 'execa'
-import { Logger } from './common/logger'
 
 interface RunningProcess extends ChildProcess {
   all?: Readable
@@ -59,16 +58,3 @@ export const executeProcess = async (
   const { stdout } = await createProcess(options)
   return stdout
 }
-
-const sendOutput = (process: Process) =>
-  process.all?.on('data', chunk =>
-    Logger.log(chunk.toString().replace(/(\r?\n)/g, ''))
-  )
-
-export const createProcessWithOutput = (options: ProcessOptions) => {
-  const process = createProcess(options)
-
-  sendOutput(process)
-
-  return process
-}

extension/src/python/index.test.ts

@@ -1,44 +1,45 @@
 import { join } from 'path'
 import { setupVenv } from '.'
-import * as ProcessExecution from '../processExecution'
+import { Process, createProcess } from '../processExecution'
 import { getProcessPlatform } from '../env'
 
 jest.mock('../env')
+jest.mock('../processExecution')
 
 const mockedGetProcessPlatform = jest.mocked(getProcessPlatform)
-const createProcessSpy = jest.spyOn(ProcessExecution, 'createProcess')
+const mockedCreateProcess = jest.mocked(createProcess)
 const mockedProcess = {
   all: { on: jest.fn() }
-} as unknown as ProcessExecution.Process
+} as unknown as Process
 
 beforeEach(() => {
   jest.resetAllMocks()
 })
 
 describe('setupVenv', () => {
   it('should create the correct python processes on sane operating systems', async () => {
-    createProcessSpy.mockResolvedValue(mockedProcess)
+    mockedCreateProcess.mockResolvedValue(mockedProcess)
     mockedGetProcessPlatform.mockReturnValue('freebsd')
 
     const envDir = '.env'
     const cwd = __dirname
 
     await setupVenv(__dirname, envDir, 'dvc')
 
-    expect(createProcessSpy).toHaveBeenCalledTimes(3)
-    expect(createProcessSpy).toHaveBeenCalledWith({
+    expect(mockedCreateProcess).toHaveBeenCalledTimes(3)
+    expect(mockedCreateProcess).toHaveBeenCalledWith({
       args: ['-m', 'venv', envDir],
       cwd,
       executable: 'python3'
     })
 
-    expect(createProcessSpy).toHaveBeenCalledWith({
+    expect(mockedCreateProcess).toHaveBeenCalledWith({
       args: ['-m', 'pip', 'install', '--upgrade', 'pip', 'wheel'],
       cwd,
       executable: join(cwd, envDir, 'bin', 'python')
     })
 
-    expect(createProcessSpy).toHaveBeenCalledWith({
+    expect(mockedCreateProcess).toHaveBeenCalledWith({
       args: ['-m', 'pip', 'install', '--upgrade', 'dvc'],
       cwd,
       executable: join(cwd, envDir, 'bin', 'python')
@@ -47,27 +48,27 @@ describe('setupVenv', () => {
 
   it('should create the correct python processes on windows', async () => {
     mockedGetProcessPlatform.mockReturnValue('win32')
-    createProcessSpy.mockResolvedValue(mockedProcess)
+    mockedCreateProcess.mockResolvedValue(mockedProcess)
 
     const envDir = '.env'
     const cwd = __dirname
 
     await setupVenv(__dirname, envDir, '-r', 'requirements.txt')
 
-    expect(createProcessSpy).toHaveBeenCalledTimes(3)
-    expect(createProcessSpy).toHaveBeenCalledWith({
+    expect(mockedCreateProcess).toHaveBeenCalledTimes(3)
+    expect(mockedCreateProcess).toHaveBeenCalledWith({
       args: ['-m', 'venv', envDir],
       cwd,
       executable: 'python'
     })
 
-    expect(createProcessSpy).toHaveBeenCalledWith({
+    expect(mockedCreateProcess).toHaveBeenCalledWith({
       args: ['-m', 'pip', 'install', '--upgrade', 'pip', 'wheel'],
       cwd,
       executable: join(cwd, envDir, 'Scripts', 'python.exe')
     })
 
-    expect(createProcessSpy).toHaveBeenCalledWith({
+    expect(mockedCreateProcess).toHaveBeenCalledWith({
       args: ['-m', 'pip', 'install', '--upgrade', '-r', 'requirements.txt'],
       cwd,
       executable: join(cwd, envDir, 'Scripts', 'python.exe')

extension/src/python/index.ts

@@ -2,7 +2,21 @@ import { join } from 'path'
 import { getVenvBinPath } from './path'
 import { getProcessPlatform } from '../env'
 import { exists } from '../fileSystem'
-import { createProcessWithOutput } from '../processExecution'
+import { Logger } from '../common/logger'
+import { createProcess, Process, ProcessOptions } from '../processExecution'
+
+const sendOutput = (process: Process) =>
+  process.all?.on('data', chunk =>
+    Logger.log(chunk.toString().replace(/(\r?\n)/g, ''))
+  )
+
+export const createProcessWithOutput = (options: ProcessOptions) => {
+  const process = createProcess(options)
+
+  sendOutput(process)
+
+  return process
+}
 
 const installPackages = (cwd: string, pythonBin: string, ...args: string[]) => {
   return createProcessWithOutput({

webview/jest.config.js

@@ -17,8 +17,10 @@ module.exports = {
   moduleNameMapper: {
     '\\.(scss|css|less)$': 'identity-obj-proxy'
   },
-  preset: 'ts-jest',
   setupFiles: ['jest-canvas-mock', '<rootDir>/setup-tests.js'],
-  testEnvironment: 'node',
-  testTimeout: 20000
+  testEnvironment: 'jsdom',
+  testTimeout: 20000,
+  transform: {
+    '^.+\\.(t|j)sx?$': ['@swc/jest']
+  }
 }

webview/package.json

@@ -39,15 +39,17 @@
     "vega-lite": "^5.2.0"
   },
   "devDependencies": {
-    "@storybook/testing-library": "0.0.13",
     "@storybook/addon-essentials": "6.5.10",
     "@storybook/addon-interactions": "6.5.10",
     "@storybook/addons": "6.5.10",
     "@storybook/builder-webpack5": "6.5.10",
     "@storybook/manager-webpack5": "6.5.10",
     "@storybook/preset-scss": "1.0.3",
     "@storybook/react": "6.5.10",
+    "@storybook/testing-library": "0.0.13",
     "@svgr/cli": "6.3.1",
+    "@swc/core": "1.2.247",
+    "@swc/jest": "0.2.22",
     "@testing-library/jest-dom": "5.16.5",
     "@testing-library/react": "13.3.0",
     "@types/classnames": "2.3.1",
@@ -77,7 +79,6 @@
     "storybook-addon-designs": "6.3.1",
     "storybook-addon-themes": "6.1.0",
     "style-loader": "3.3.1",
-    "ts-jest": "29.0.0-next.1",
     "ts-loader": "9.3.1",
     "webpack": "5.74.0",
     "webpack-cli": "4.10.0",

webview/setup-tests.js

@@ -1,4 +1,11 @@
-const StyleUtils = require('./src/util/styles')
+jest.mock('./src/util/styles', () => {
+  const actualModule = jest.requireActual('./src/util/styles')
+  return {
+    __esModule: true,
+    ...actualModule,
+    getThemeValue: jest.fn().mockImplementation(() => '#ffffff')
+  }
+})
 
 // eslint-disable-next-line no-global-assign
 window = {
@@ -23,5 +30,3 @@ const intersectionObserverMock = jest.fn().mockImplementation(() => {
   }
 })
 global.IntersectionObserver = intersectionObserverMock
-
-StyleUtils.getThemeValue = jest.fn().mockImplementation(() => '#ffffff')

webview/src/experiments/components/App.test.tsx

@@ -1,6 +1,3 @@
-/**
- * @jest-environment jsdom
- */
 /* eslint jest/expect-expect: ["error", { "assertFunctionNames": ["expect", "expectHeaders"] }] */
 import {
   cleanup,

webview/src/experiments/components/table/Table.test.tsx

@@ -1,6 +1,3 @@
-/**
- * @jest-environment jsdom
- */
 /* eslint jest/expect-expect: ["error", { "assertFunctionNames": ["expect", "expectHeaders"] }] */
 import '@testing-library/jest-dom/extend-expect'
 import { configureStore } from '@reduxjs/toolkit'
@@ -34,6 +31,14 @@ import { experimentsReducers } from '../../store'
 import { customQueries } from '../../../test/queries'
 
 jest.mock('../../../shared/api')
+jest.mock('../../hooks/useColumnOrder', () => {
+  const actualModule = jest.requireActual('../../hooks/useColumnOrder')
+  return {
+    __esModule: true,
+    ...actualModule
+  }
+})
+
 const { postMessage } = vsCodeApi
 const mockedPostMessage = jest.mocked(postMessage)
 

webview/src/plots/components/App.test.tsx

@@ -1,6 +1,3 @@
-/**
- * @jest-environment jsdom
- */
 import { join } from 'dvc/src/test/util/path'
 import { configureStore } from '@reduxjs/toolkit'
 import React, { ReactElement } from 'react'
@@ -50,6 +47,17 @@ import {
 } from '../../test/dragDrop'
 import { DragEnterDirection } from '../../shared/components/dragDrop/util'
 import { clearSelection, createWindowTextSelection } from '../../test/selection'
+import * as EventCurrentTargetDistances from '../../shared/components/dragDrop/currentTarget'
+
+jest.mock('../../shared/components/dragDrop/currentTarget', () => {
+  const actualModule = jest.requireActual(
+    '../../shared/components/dragDrop/currentTarget'
+  )
+  return {
+    __esModule: true,
+    ...actualModule
+  }
+})
 
 jest.mock('../../shared/api')
 
@@ -1122,7 +1130,13 @@ describe('App', () => {
     })
 
     const plots = screen.getAllByTestId(/^plot_/)
-    dragEnter(plots[0], plots[1].id, DragEnterDirection.RIGHT)
+
+    dragEnter(
+      plots[0],
+      plots[1].id,
+      DragEnterDirection.RIGHT,
+      EventCurrentTargetDistances
+    )
 
     const plotsWithDropTarget = screen.getAllByTestId(/^plot_/)
 

webview/src/plots/components/comparisonTable/ComparisonTable.test.tsx

@@ -1,6 +1,3 @@
-/**
- * @jest-environment jsdom
- */
 import { configureStore } from '@reduxjs/toolkit'
 import '@testing-library/jest-dom/extend-expect'
 import {
@@ -30,10 +27,20 @@ import { DragEnterDirection } from '../../../shared/components/dragDrop/util'
 import { plotsReducers } from '../../store'
 import { webviewInitialState } from '../webviewSlice'
 import { getThemeValue, hexToRGB, ThemeProperty } from '../../../util/styles'
+import * as EventCurrentTargetDistances from '../../../shared/components/dragDrop/currentTarget'
 
 const getHeaders = () => screen.getAllByRole('columnheader')
 
 jest.mock('../../../shared/api')
+jest.mock('../../../shared/components/dragDrop/currentTarget', () => {
+  const actualModule = jest.requireActual(
+    '../../../shared/components/dragDrop/currentTarget'
+  )
+  return {
+    __esModule: true,
+    ...actualModule
+  }
+})
 
 const { postMessage } = vsCodeApi
 const mockPostMessage = jest.mocked(postMessage)
@@ -496,7 +503,12 @@ describe('ComparisonTable', () => {
 
       const [, firstRow, secondRow] = screen.getAllByRole('rowgroup') // First rowgroup is the thead
 
-      dragAndDrop(secondRow, firstRow, DragEnterDirection.BOTTOM)
+      dragAndDrop(
+        secondRow,
+        firstRow,
+        DragEnterDirection.BOTTOM,
+        EventCurrentTargetDistances
+      )
 
       const [, newFirstRow, newSecondRow] = screen.getAllByRole('rowgroup')
 
@@ -509,7 +521,12 @@ describe('ComparisonTable', () => {
 
       const [, firstRow, secondRow] = screen.getAllByRole('rowgroup') // First rowgroup is the thead
 
-      dragAndDrop(firstRow, secondRow, DragEnterDirection.BOTTOM)
+      dragAndDrop(
+        firstRow,
+        secondRow,
+        DragEnterDirection.BOTTOM,
+        EventCurrentTargetDistances
+      )
 
       const [, newFirstRow, newSecondRow] = screen.getAllByRole('rowgroup')
 
@@ -535,7 +552,12 @@ describe('ComparisonTable', () => {
 
       const [, firstRow, secondRow] = screen.getAllByRole('rowgroup') // First rowgroup is the thead
 
-      dragEnter(firstRow, secondRow.id, DragEnterDirection.BOTTOM)
+      dragEnter(
+        firstRow,
+        secondRow.id,
+        DragEnterDirection.BOTTOM,
+        EventCurrentTargetDistances
+      )
 
       const dropTarget = screen.getAllByRole('rowgroup')[2]
 

webview/src/plots/components/comparisonTable/ComparisonTableHeader.test.tsx

@@ -1,6 +1,3 @@
-/**
- * @jest-environment jsdom
- */
 import React from 'react'
 import { render, cleanup, screen, fireEvent } from '@testing-library/react'
 import '@testing-library/jest-dom/extend-expect'