action

Action-kommandot är ett lågnivågränssnitt för att tillhandahålla virtualiserade enhetsåtgärder till webbläsaren.

Förutom kommandon på hög nivå som scrollIntoView, doubleClick, ger Actions API detaljerad kontroll över exakt vad designerade inmatningsenheter kan göra. WebdriverIO tillhandahåller ett gränssnitt för 3 typer av inmatningskällor:

• en tangentinmatning för tangentbordsenheter
• en pekarinmatning för mus-, penn- eller pekskärmsenheter
• och hjulinmatningar för rullhjulsenheter

Varje kedja av åtgärdskommandon måste avslutas genom att anropa perform för att utlösa uppsättningen av åtgärder. Detta gör att åtgärder släpps och händelser utlöses. Du kan hoppa över detta genom att skicka in true (t.ex. browser.actions(...).perform(true)).

info

Stöd för detta kommando och specifika åtgärder kan variera beroende på miljön. Framsteg i utvecklingen kan följas på wpt.fyi. För mobila enheter kanske du vill använda Appium-specifika gestkommandon på iOS och Android.

Tangentinmatningskälla

En tangentinmatningskälla är en inmatningskälla som är associerad med en tangentbordsliknande enhet. Den kan utlösas genom att använda parametertypen key. t.ex.:

browser.action('key')

Det returnerar ett KeyAction-objekt som stöder följande åtgärder:

• down(value: string): genererar en tangent ned-åtgärd
• up(value: string): genererar en tangent upp-åtgärd
• pause(ms: number): indikerar att en inmatningskälla inte gör något under en viss period

Specialtecken

Om du vill använda specialtecken som t.ex. Control, Page Up eller Shift, se till att importera Key-objektet från webdriverio-paketet så här:

import { Key } from 'webdriverio'

Objektet låter dig komma åt unicode-representationen av det önskade specialtecknet.

Pekarinmatningskälla

En pekarinmatningskälla är en inmatningskälla som är associerad med en pekartyps inmatningsenhet. Typen kan specificeras när man anropar action-kommandot, t.ex.:

browser.action('pointer', {
    parameters: { pointerType: 'mouse' } // "mouse" är standardvärde, även möjligt: "pen" eller "touch"
})

Det returnerar ett PointerAction-objekt som stöder följande åtgärder:

• down (button: 'left' | 'middle' | 'right'): skapar en åtgärd för att trycka på en enskild knapp
• down (params: PointerActionParams): skapar en åtgärd för att trycka på en enskild knapp med detaljerade parametrar
• move (x: number, y: number): Skapar en åtgärd för att flytta pekaren x och y pixlar från viewport
• move (params: PointerActionMoveParams): Skapar en åtgärd för att flytta pekaren x och y pixlar från den specificerade origin. origin kan definieras som pekarens nuvarande position (t.ex. "pointer"), viewport (t.ex. "viewport") eller mitten av ett specifikt element.
• up (button: 'left' | 'middle' | 'right'): skapar en åtgärd för att släppa en enskild knapp
• up (params: PointerActionUpParams): skapar en åtgärd för att släppa en enskild knapp med detaljerade parametrar
• cancel(): En åtgärd som avbryter denna pekares nuvarande inmatning.
• pause(ms: number): indikerar att en inmatningskälla inte gör något under en viss period

Du kan hitta detaljerad information om parametertyperna PointerActionParams, PointerActionMoveParams och PointerActionUpParams i projektets typdefinition.

Hjulinmatningskälla

En hjulinmatningskälla är en inmatningskälla som är associerad med en hjultyps inmatningsenhet.

browser.action('wheel')

Det returnerar ett WheelAction-objekt som stöder följande åtgärder:

• scroll (params: ScrollParams): rullar en sida till givna koordinater eller ursprung
• pause(ms: number): indikerar att en inmatningskälla inte gör något under en viss period

Du kan hitta detaljerad information om parametertypen ScrollParams i projektets typdefinition.

Användning

browser.action()

Exempel

pointer-action.js

it('drag and drop using pointer action command', async () => {
    const origin = await $('#source')
    const targetOrigin = await $('#target')

    return browser.action('pointer')
        .move({ duration: 0, origin, x: 0, y: 0 })
        .down({ button: 0 }) // left button
        .pause(10)
        .move({ duration: 0, origin: targetOrigin })
        .up({ button: 0 })
        .perform()
});

key-action.js

import { Key } from 'webdriverio'

it('should emit key events using key action commands', async () => {
    const elem = await $('input')
    await elem.click() // make element active

    await browser.action('key')
        .down('f')
        .down('o')
        .down('o')
        .up('f')
        .up('o')
        .up('o')
        .perform()

    console.log(await elem.getValue()) // returns "foo"

    // copy value out of input element
    await browser.action('key')
        .down(Key.Ctrl).down('c')
        .pause(10)
        .up(Key.Ctrl).up('c')
        .perform()
})

wheel-action.js

it('should scroll using wheel action commands', async () => {
    console.log(await browser.execute(() => window.scrollY)) // returns 0
    await browser.action('wheel').scroll({
        deltaX: 0,
        deltaY: 500,
        duration: 200
    }).perform()
    console.log(await browser.execute(() => window.scrollY)) // returns 500
})