API kontekstu

Vitest udostępnia moduł kontekstu poprzez punkt wejścia @vitest/browser/context. Od wersji 2.0 udostępnia niewielki zestaw narzędzi, które mogą być przydatne w testach.

userEvent

TIP

API userEvent jest szczegółowo wyjaśnione w API interaktywności.

/**
 * Obsługa interakcji użytkownika. Wsparcie jest implementowane przez dostawcę przeglądarki (`playwright` lub `webdriverio`).
 * Jeśli jest używany z dostawcą `preview`, przechodzi na symulowane zdarzenia za pomocą `@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

To API jest szczegółowo wyjaśnione w API poleceń.

/**
 * Dostępne polecenia dla przeglądarki.
 * Skrót do `server.commands`.
 */
export const commands: BrowserCommands;

page

Eksport page udostępnia narzędzia do interakcji z bieżącą stroną.

WARNING

Chociaż udostępnia niektóre narzędzia z obiektu page Playwrighta, nie jest to ten sam obiekt. Ponieważ kontekst przeglądarki jest wykonywany w przeglądarce, twoje testy nie mają dostępu do obiektu page Playwrighta, ponieważ jest wykonywany na serwerze.

Użyj API poleceń, jeśli potrzebujesz dostępu do obiektu page z Playwrighta.

export const page: {
  /**
   * Zmień rozmiar obszaru widoku iframe.
   */
  viewport(width: number, height: number): Promise<void>;
  /**
   * Wykonaj zrzut ekranu z testowego iframe lub konkretnego elementu.
   * @returns Ścieżka do pliku zrzutu ekranu lub ścieżka i base64.
   */
  screenshot(
    options: Omit<ScreenshotOptions, 'base64'> & { base64: true }
  ): Promise<{
    path: string;
    base64: string;
  }>;
  screenshot(options?: ScreenshotOptions): Promise<string>;
  /**
   * Rozszerz domyślny obiekt `page` o własne metody.
   */
  extend(methods: Partial<BrowserPage>): BrowserPage;
  /**
   * Opakuj element HTML w obiekt `Locator`. Podczas wyszukiwania elementów, zawsze zostanie zwrócony ten element.
   */
  elementLocator(element: Element): Locator;

  /**
   * API Lokalizatorów. Zobacz dokumentację, aby uzyskać więcej szczegółów.
   */
  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* jest wyjaśnione w API Lokalizatorów.

cdp

Eksport cdp zwraca bieżącą sesję Chrome DevTools Protocol. Jest to głównie przydatne dla autorów bibliotek, którzy chcą budować narzędzia w oparciu o nią.

WARNING

Sesja CDP działa tylko z dostawcą playwright i tylko podczas używania przeglądarki chromium. Możesz przeczytać więcej na ten temat w dokumentacji CDPSession Playwrighta.

export const cdp: () => CDPSession;

server

Eksport server reprezentuje środowisko Node.js, w którym działa serwer Vitest. Jest to głównie przydatne do debugowania lub ograniczania testów w zależności od środowiska wykonania.

export const server: {
  /**
   * Platforma, na której działa serwer Vitest.
   * To samo co wywołanie `process.platform` na serwerze.
   */
  platform: Platform;
  /**
   * Wersja środowiska uruchomieniowego serwera Vitest.
   * To samo co wywołanie `process.version` na serwerze.
   */
  version: string;
  /**
   * Nazwa dostawcy przeglądarki.
   */
  provider: string;
  /**
   * Nazwa bieżącej przeglądarki.
   */
  browser: string;
  /**
   * Dostępne polecenia dla przeglądarki.
   */
  commands: BrowserCommands;
  /**
   * Konfiguracja testu w postaci zserializowanej.
   */
  config: SerializedConfig;
};