Другое

Проверка типов в Vitest: Перехват ошибок конфигурации в тестах

Узнайте, как настроить Vitest для перехвата ошибок типов TypeScript в файлах конфигурации во время обычного выполнения тестов. Включите проверку типов в режиме наблюдения и улучшите рабочий процесс разработки с помощью правильной безопасности типов.

Как настроить Vitest для обнаружения ошибок типов в файлах конфигурации TypeScript во время обычного выполнения тестов?

При написании файла конфигурации Vitest на TypeScript ошибки типов не обнаруживаются во время обычного выполнения тестов. Например, в этой конфигурации:

typescript
import { defineConfig } from 'vitest/config'

let boolValue: string = true; // Ошибка типа: строка присваивается булевому значению

export default defineConfig({
  test: {
    typecheck: {
      enabled: boolValue // Должно быть булевым значением, а не строкой
    }
  },
})

При выполнении npx vitest тесты проходят успешно, не обнаруживая ошибку типа. Однако при выполнении npx vitest run ошибка корректно обнаруживается:

TypeCheckError: No overload matches this call.
  The last overload gave the following error.
    Type 'string' is not assignable to type 'boolean | undefined'.
 ❯ vitest.config.ts:6:7

При строгом tsconfig.json ошибка отображается только после завершения набора тестов в режиме наблюдения (watch mode), что легко упустить. Какие изменения в конфигурации необходимы, чтобы Vitest обнаруживал ошибки типов в файлах конфигурации TypeScript во время обычного выполнения тестов, особенно в режиме наблюдения?

Vitest автоматически не обнаруживает ошибки типов в файлах конфигурации во время обычного выполнения тестов, поскольку под капотом использует esbuild, который удаляет типы перед компиляцией. Чтобы обнаруживать ошибки типов в файлах vitest.config.ts, вам необходимо явно настроить функцию проверки типов Vitest и убедиться, что она выполняется в рамках вашего рабочего процесса тестирования.

Содержание

Поведение проверки типов в Vitest

Vitest обрабатывает проверку типов иначе, чем традиционные фреймворки тестирования. Согласно результатам исследований, Vitest использует esbuild под капотом, который удаляет типы до того, как они доходят до компилятора Node. Это означает, что по умолчанию Vitest не выполняет проверку типов в файлах конфигурации во время обычного выполнения тестов.

Функция проверки типов в Vitest работает путем выполнения tsc --noEmit под капотом, как отмечено в обсуждении. Именно почему ваши ошибки типов обнаруживаются только при явном выполнении npx vitest run или npx vitest typecheck, но не во время обычного выполнения в режиме наблюдения npx vitest.

Настройка Vitest для обнаружения ошибок типов

Чтобы включить проверку типов в вашей конфигурации Vitest, вам нужно изменить файл vitest.config.ts, добавив конфигурацию typecheck:

typescript
import { defineConfig } from 'vitest/config'

export default defineConfig({
  test: {
    typecheck: {
      enabled: true,
      // Опционально: указать пользовательский файл tsconfig для проверки типов
      tsconfig: './tsconfig.test.json'
    }
  },
})

Основные параметры конфигурации для проверки типов:

  • enabled: Включает или отключает проверку типов
  • tsconfig: Путь к пользовательскому файлу конфигурации TypeScript для проверки типов
  • include: Шаблоны glob для включения файлов в проверку типов
  • exclude: Шаблоны glob для исключения файлов из проверки типов

Включение проверки типов во время обычного выполнения тестов

Чтобы гарантировать обнаружение ошибок типов во время обычного выполнения тестов (включая режим наблюдения), у вас есть несколько подходов:

1. Использование флага --typecheck

Запустите Vitest с включенным флагом typecheck:

bash
npx vitest --typecheck

2. Создание отдельного скрипта проверки типов

Добавьте скрипт в ваш package.json:

json
{
  "scripts": {
    "test": "vitest",
    "test:type": "vitest typecheck",
    "test:watch": "vitest --typecheck"
  }
}

3. Настройка Vitest на завершение с ошибкой при обнаружении ошибок типов

Измените вашу конфигурацию, чтобы Vitest завершал выполнение набора тестов с ошибкой при обнаружении ошибок типов:

typescript
import { defineConfig } from 'vitest/config'

export default defineConfig({
  test: {
    // Завершить выполнение с ошибкой, если найдены ошибки в исходном коде
    failOnTypeErrors: true,
    typecheck: {
      enabled: true,
      // Убедиться, что проверка типов выполняется во время обычного выполнения тестов
      command: 'vitest typecheck'
    }
  },
})

Решение конкретных проблем с ошибками типов

Проблема: Несовместимые типы между Vite и Vitest

Вы можете столкнуться с ошибками вроде 'test' does not exist in type 'UserConfigExport' при смешивании конфигураций Vite и Vitest. Согласно Stack Overflow, решением является определение config и tstConfig отдельно, а затем их объединение:

typescript
import { defineConfig } from 'vitest/config'
import { defineConfig as defineViteConfig } from 'vite'

const viteConfig = defineViteConfig({
  // Ваша конфигурация Vite
})

const vitestConfig = defineConfig({
  test: {
    // Ваша конфигурация Vitest
    typecheck: {
      enabled: true
    }
  },
})

export default {
  ...viteConfig,
  ...vitestConfig
}

Проблема: Ссылки TypeScript с noEmit

Если вы используете ссылки на проекты TypeScript с noEmit, вы можете столкнуться с проблемами, когда проверка типов работает некорректно. Как отмечено в issue на GitHub, эта проблема возникает при использовании ссылок с noEmit, что предотвращает корректную проверку всех связанных файлов Vitest.

Чтобы исправить это, убедитесь, что ваш tsconfig.json включает все необходимые файлы или создайте отдельный tsconfig.test.json для проверки типов:

json
{
  "compilerOptions": {
    "noEmit": true,
    "composite": true,
    "references": [
      { "path": "./tsconfig.app.json" }
    ]
  }
}

Проблема: Ошибки типов не отображаются в режиме наблюдения

Для конкретной проблемы, когда ошибки типов появляются только после завершения набора тестов в режиме наблюдения, вы можете настроить Vitest на более быстрое завершение с ошибкой при обнаружении ошибок типов:

typescript
import { defineConfig } from 'vitest/config'

export default defineConfig({
  test: {
    // Минимальное время в миллисекундах для запуска проверяющего типов
    typecheck: {
      enabled: true,
      timeout: 10000, // таймаут 10 секунд
      // Включить хотя бы один файл test-d.ts
      include: ['**/*.test-d.ts']
    }
  },
})

Лучшие практики для обеспечения безопасности типов в проектах Vitest

  1. Создавайте отдельные файлы для проверки типов: Создавайте файлы *.test-d.ts для тестирования типов:

    typescript
    // utils.test-d.ts
    import { assertType } from 'vitest'
    import { myFunction } from './utils'
    
    assertType<() => string>(myFunction)
    
  2. Используйте строгую конфигурацию TypeScript: Убедитесь, что ваш tsconfig.json включает строгую проверку типов:

    json
    {
      "compilerOptions": {
        "strict": true,
        "noUnusedLocals": true,
        "noUnusedParameters": true
      }
    }
    
  3. Автоматизируйте проверку типов в CI: Добавьте проверку типов в ваш CI-конвейер:

    json
    {
      "scripts": {
        "test": "vitest",
        "test:ci": "vitest run --typecheck"
      }
    }
    
  4. Обрабатывайте ошибки типов немедленно: Настройте ваш редактор или IDE для отображения ошибок типов в реальном времени с помощью языка сервиса TypeScript.

Сценарии продвинутой настройки

Пользовательская конфигурация TypeScript для проверки типов

Для более сложных проектов может потребоваться отдельная конфигурация TypeScript для проверки типов:

typescript
import { defineConfig } from 'vitest/config'

export default defineConfig({
  test: {
    typecheck: {
      enabled: true,
      // Использовать другой файл tsconfig для проверки типов
      tsconfig: './tsconfig.test.json',
      // Указать, какие файлы включать
      include: ['src/**/*.ts', 'tests/**/*.ts'],
      // Исключить определенные файлы
      exclude: ['**/node_modules/**']
    }
  },
})

Интеграция с проектами Vue

Для проектов Vue может потребоваться использовать vue-tsc вместо tsc для проверки типов:

typescript
import { defineConfig } from 'vitest/config'

export default defineConfig({
  test: {
    typecheck: {
      enabled: true,
      // Использовать vue-tsc для проектов Vue
      checker: 'vue-tsc',
      // Дополнительные параметры, специфичные для Vue
      vue: {
        compilerOptions: {
          target: 'esnext'
        }
      }
    }
  },
})

Обработка нескольких проектов в монорепозиториях

Для настройки монорепозиториев настройте проверку типов для каждого проекта:

typescript
// vitest.config.ts
import { defineConfig } from 'vitest/config'

export default defineConfig({
  test: {
    typecheck: {
      enabled: true,
      // Конфигурация проверки типов для каждого проекта
      projects: [
        {
          name: 'frontend',
          tsconfig: './packages/frontend/tsconfig.test.json'
        },
        {
          name: 'backend',
          tsconfig: './packages/backend/tsconfig.test.json'
        }
      ]
    }
  },
})

Источники

  1. Руководство по проверке типов Vitest - Документация Vitest
  2. Настройка Vitest - Документация Vitest
  3. Ошибка TypeCheck в конфигурации Vitest - Stack Overflow
  4. Обсуждение Vitest Typecheck на GitHub
  5. Проверка типов Vitest со ссылками TypeScript - Issue на GitHub
  6. Несовместимость типов Vitest и Vite - Stack Overflow

Заключение

Чтобы настроить Vitest на обнаружение ошибок типов в файлах конфигурации TypeScript во время обычного выполнения тестов, вам необходимо:

  1. Включить функцию typecheck в вашем vitest.config.ts с помощью typecheck: { enabled: true }
  2. Использовать соответствующие флаги команд типа --typecheck при запуске тестов
  3. Настроить правильные параметры TypeScript для обеспечения всесторонней проверки типов
  4. Обрабатывать конкретные проблемы такие как несовместимость типов Vite/Vitest и ссылки на проекты
  5. Следовать лучшим практикам включая создание файлов test-d.ts и использование строгих конфигураций TypeScript

Ключевое понимание заключается в том, что проверка типов в Vitest отделена от его обычного выполнения тестов, поэтому вам необходимо явно настроить ее запуск в рамках вашего рабочего процесса тестирования. Реализовав эти конфигурации, вы сможете обнаруживать ошибки типов в файлах конфигурации немедленно, даже в режиме наблюдения, обеспечивая лучшую безопасность типов в ваших TypeScript-проектах.

Авторы
Проверено модерацией
Модерация