API контекста

Vitest предоставляет модуль контекста через точку входа @vitest/browser/context. Начиная с версии 2.0, он предлагает набор утилит, которые могут быть полезны в ваших тестах.

userEvent

TIP

API userEvent подробно описан в разделе API интерактивности.

/**
 * Обработчик пользовательских действий. Поддержка реализована провайдером браузера (`playwright` или `webdriverio`).
 * При использовании с провайдером `preview` переключается на симулированные события через `@testing-library/user-event`.
 * @experimental
 */
export const userEvent: {
  setup: () => UserEvent;
  cleanup: () => Promise<void>;
  click: (element: Element, options?: UserEventClickOptions) => Promise<void>;
  dblClick: (
    element: Element,
    options?: UserEventDoubleClickOptions
  ) => Promise<void>;
  tripleClick: (
    element: Element,
    options?: UserEventTripleClickOptions
  ) => Promise<void>;
  selectOptions: (
    element: Element,
    values: HTMLElement | HTMLElement[] | string | string[],
    options?: UserEventSelectOptions
  ) => Promise<void>;
  keyboard: (text: string) => Promise<void>;
  type: (
    element: Element,
    text: string,
    options?: UserEventTypeOptions
  ) => Promise<void>;
  clear: (element: Element) => Promise<void>;
  tab: (options?: UserEventTabOptions) => Promise<void>;
  hover: (element: Element, options?: UserEventHoverOptions) => Promise<void>;
  unhover: (element: Element, options?: UserEventHoverOptions) => Promise<void>;
  fill: (
    element: Element,
    text: string,
    options?: UserEventFillOptions
  ) => Promise<void>;
  dragAndDrop: (
    source: Element,
    target: Element,
    options?: UserEventDragAndDropOptions
  ) => Promise<void>;
};

commands

TIP

Этот API подробно описан в разделе API команд.

/**
 * Доступные команды для браузера.
 * Сокращение для `server.commands`.
 */
export const commands: BrowserCommands;

page

Экспорт page предоставляет утилиты для взаимодействия с текущей страницей.

WARNING

Хотя он предоставляет некоторые утилиты из объекта page Playwright, это не тот же самый объект. Поскольку контекст браузера выполняется в браузере, ваши тесты не имеют доступа к объекту page Playwright, так как он выполняется на сервере.

Используйте API команд, если вам нужен доступ к объекту page Playwright.

export const page: {
  /**
   * Изменить размеры области просмотра iframe.
   */
  viewport(width: number, height: number): Promise<void>;
  /**
   * Создать скриншот тестового iframe или определенного элемента.
   * @returns Путь к файлу скриншота или объект, содержащий путь и base64.
   */
  screenshot(
    options: Omit<ScreenshotOptions, 'base64'> & { base64: true }
  ): Promise<{
    path: string;
    base64: string;
  }>;
  screenshot(options?: ScreenshotOptions): Promise<string>;
  /**
   * Расширить стандартный объект `page` пользовательскими методами.
   */
  extend(methods: Partial<BrowserPage>): BrowserPage;
  /**
   * Обернуть HTML-элемент с помощью `Locator`. При поиске элементов всегда будет возвращаться именно этот элемент.
   */
  elementLocator(element: Element): Locator;

  /**
   * API локаторов. См. документацию для получения более подробной информации.
   */
  getByRole(role: ARIARole | string, options?: LocatorByRoleOptions): Locator;
  getByLabelText(text: string | RegExp, options?: LocatorOptions): Locator;
  getByTestId(text: string | RegExp): Locator;
  getByAltText(text: string | RegExp, options?: LocatorOptions): Locator;
  getByPlaceholder(text: string | RegExp, options?: LocatorOptions): Locator;
  getByText(text: string | RegExp, options?: LocatorOptions): Locator;
  getByTitle(text: string | RegExp, options?: LocatorOptions): Locator;
};

TIP

API getBy* объясняется в разделе API локаторов.

cdp

Экспорт cdp возвращает текущую CDP-сессию Chrome DevTools Protocol. Это в основном полезно для авторов библиотек, создающих инструменты на его основе.

WARNING

CDP-сессия работает только с провайдером playwright и только при использовании браузера chromium. Вы можете прочитать об этом подробнее в документации Playwright по CDPSession.

export const cdp: () => CDPSession;

server

Экспорт server представляет Node.js окружение, в котором работает сервер Vitest. Это в основном полезно для отладки или ограничения ваших тестов в зависимости от среды.

export const server: {
  /**
   * Платформа, на которой работает сервер Vitest.
   * То же, что и вызов `process.platform` на сервере.
   */
  platform: Platform;
  /**
   * Версия среды выполнения сервера Vitest.
   * То же, что и вызов `process.version` на сервере.
   */
  version: string;
  /**
   * Имя провайдера браузера.
   */
  provider: string;
  /**
   * Имя текущего браузера.
   */
  browser: string;
  /**
   * Доступные команды для браузера.
   */
  commands: BrowserCommands;
  /**
   * Сериализованная конфигурация тестов.
   */
  config: SerializedConfig;
};