API del Contesto

Vitest espone un modulo di contesto tramite il punto di ingresso @vitest/browser/context. A partire dalla versione 2.0, fornisce un piccolo insieme di utilità che possono rivelarsi utili nei test.

userEvent

TIP

L'API userEvent è spiegata in dettaglio nell'API di interattività.

/**
 * Gestore delle interazioni utente. Il supporto è implementato dal provider del browser (`playwright` o `webdriverio`).
 * Se utilizzato con il provider `preview`, ripiega su eventi simulati tramite `@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

Questa API è spiegata in dettaglio nell'API dei comandi.

/**
 * Comandi disponibili per il browser.
 * Un alias per `server.commands`.
 */
export const commands: BrowserCommands;

page

L'esportazione page fornisce utilità per interagire con la page corrente.

WARNING

Sebbene esponga alcune utilità dall'oggetto page di Playwright, non è lo stesso oggetto. Poiché il contesto del browser viene eseguito nel browser, i tuoi test non hanno accesso all'oggetto page di Playwright, in quanto quest'ultimo viene eseguito sul server.

Utilizza l'API dei comandi se hai bisogno di accedere all'oggetto page di Playwright.

export const page: {
  /**
   * Modifica la dimensione del viewport dell'iframe.
   */
  viewport(width: number, height: number): Promise<void>;
  /**
   * Acquisisce uno screenshot dell'iframe di test o di un elemento specifico.
   * @returns Percorso del file dello screenshot o percorso e stringa base64.
   */
  screenshot(
    options: Omit<ScreenshotOptions, 'base64'> & { base64: true }
  ): Promise<{
    path: string;
    base64: string;
  }>;
  screenshot(options?: ScreenshotOptions): Promise<string>;
  /**
   * Estende l'oggetto `page` predefinito con metodi personalizzati.
   */
  extend(methods: Partial<BrowserPage>): BrowserPage;
  /**
   * Incapsula un elemento HTML in un `Locator`. Quando si cercano elementi, la ricerca restituirà sempre questo elemento.
   */
  elementLocator(element: Element): Locator;

  /**
   * API per i Locator. Per maggiori dettagli, consultare la sua documentazione.
   */
  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

L'API getBy* è spiegata nell'API dei Locator.

ATTENZIONE 3.2.0+

Si noti che screenshot restituirà sempre una stringa in formato base64 se save è impostato a false. In tal caso, il path viene anche ignorato.

cdp

L'esportazione cdp restituisce la sessione corrente del Chrome DevTools Protocol. È principalmente utile agli autori di librerie per costruire strumenti basati su di essa.

WARNING

La sessione CDP è disponibile solo con il provider playwright e solo quando si utilizza il browser chromium. È possibile leggere maggiori informazioni a riguardo nella documentazione di Playwright CDPSession.

export const cdp: () => CDPSession;

server

L'esportazione server rappresenta l'ambiente Node.js dove viene eseguito il server Vitest. È principalmente utile per il debug o per condizionare i test in base all'ambiente.

export const server: {
  /**
   * Piattaforma su cui è in esecuzione il server Vitest.
   * Equivalente a chiamare `process.platform` sul server.
   */
  platform: Platform;
  /**
   * Versione del runtime del server Vitest.
   * Equivalente a chiamare `process.version` sul server.
   */
  version: string;
  /**
   * Nome del provider del browser.
   */
  provider: string;
  /**
   * Nome del browser corrente.
   */
  browser: string;
  /**
   * Comandi disponibili per il browser.
   */
  commands: BrowserCommands;
  /**
   * Configurazione di test serializzata.
   */
  config: SerializedConfig;
};