Kontextus API

A Vitest elérhetővé tesz egy kontextus modult a @vitest/browser/context bejegyzési ponton keresztül. A 2.0-ás verziótól kezdve néhány segédprogramot tesz elérhetővé, amelyek hasznosak lehetnek a tesztekben.

userEvent

TIP

A userEvent API részletesen az Interaktivitás API oldalon van bemutatva.

/**
 * Felhasználói interakciók kezelője. A támogatást a böngészőszolgáltatók (browser provider) valósítják meg (`playwright` vagy `webdriverio`).
 * Ha a `preview` szolgáltatót használják, akkor a `@testing-library/user-event` segítségével szimulált eseményekre vált át.
 * @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

Ez az API részletesen magyarázva van a Parancsok API oldalon.

/**
 * Elérhető parancsok a böngészőhöz.
 * Rövidítése a `server.commands`-nak.
 */
export const commands: BrowserCommands;

page

A page export segédprogramokat kínál az aktuális page (oldal) kezeléséhez.

WARNING

Bár néhány segédprogramot a Playwright page objektumából elérhetővé tesz, ez nem ugyanaz az objektum. Mivel a böngésző kontextus a böngészőben kerül kiértékelésre, a tesztek nem férnek hozzá a Playwright page objektumához, mivel az a szerveren fut.

Ha hozzá kell férnie a Playwright page objektumához, használja a Parancsok API oldalt.

export const page: {
  /**
   * Az iframe nézetablak méretének módosítása.
   */
  viewport(width: number, height: number): Promise<void>;
  /**
   * Képernyőfelvétel készítése a teszt iframe-ről vagy egy adott elemről.
   * @returns A képernyőkép fájl elérési útja, vagy az elérési út és a base64 kódolás.
   */
  screenshot(
    options: Omit<ScreenshotOptions, 'base64'> & { base64: true }
  ): Promise<{
    path: string;
    base64: string;
  }>;
  screenshot(options?: ScreenshotOptions): Promise<string>;
  /**
   * Az alapértelmezett `page` objektum kiterjesztése egyedi metódusokkal.
   */
  extend(methods: Partial<BrowserPage>): BrowserPage;
  /**
   * Egy HTML elem becsomagolása egy `Locator`-ba. Elemek lekérdezésekor a keresés mindig ezt az elemet adja vissza.
   */
  elementLocator(element: Element): Locator;

  /**
   * Locator API-k. További részletekért lásd a dokumentációt.
   */
  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

A getBy* API magyarázata a Lokátorok API oldalon található.

cdp

A cdp export az aktuális Chrome DevTools Protocol (CDP) munkamenetet adja vissza. Leginkább a könyvtárfejlesztők számára hasznos, akik eszközöket építenek rá.

WARNING

A CDP munkamenet csak playwright szolgáltatóval és chromium böngésző használatakor működik. Erről bővebben olvashat a playwright CDPSession dokumentációjában.

export const cdp: () => CDPSession;

server

A server export a Node.js környezetet képviseli, ahol a Vitest szerver fut. Leginkább hibakeresésre vagy a tesztek környezet szerinti korlátozására hasznos.

export const server: {
  /**
   * A platform, amelyen a Vitest szerver működik.
   * Ugyanaz, mint a `process.platform` hívása a szerveren.
   */
  platform: Platform;
  /**
   * A Vitest szerver futtatókörnyezet verziója.
   * Ugyanaz, mint a `process.version` hívása a szerveren.
   */
  version: string;
  /**
   * A böngésző szolgáltató neve.
   */
  provider: string;
  /**
   * Az aktuális böngésző neve.
   */
  browser: string;
  /**
   * Elérhető parancsok a böngészőhöz.
   */
  commands: BrowserCommands;
  /**
   * Serializált tesztkonfiguráció.
   */
  config: SerializedConfig;
};