Opções de Método

As opções de métodos são as opções que podem ser definidas por método. Se a opção tiver a mesma chave que uma opção que foi definida durante a instanciação do plugin, esta opção de método substituirá o valor da opção do plugin.

NOTA

Todas as opções das Opções de Salvamento podem ser usadas para os métodos de Comparação
Todas as opções de comparação podem ser usadas durante a instanciação do serviço ou para cada método de verificação individual. Se uma opção de método tiver a mesma chave que uma opção que foi definida durante a instanciação do serviço, então a opção de comparação do método substituirá o valor da opção de comparação do serviço.
Todas as opções podem ser usadas para os contextos de aplicação abaixo, a menos que mencionado de outra forma:
- Web
- Aplicativo Híbrido
- Aplicativo Nativo
Os exemplos abaixo são com os métodos save*, mas também podem ser usados com os métodos check*

Opções de Salvamento

`disableBlinkingCursor`

Tipo: boolean
Obrigatório: Não
Padrão: false
Usado com: Todos os métodos
Contextos de Aplicação Suportados: Web, Aplicativo Híbrido (Webview)

Ativar/Desativar o "piscar" do cursor em todos os elementos input, textarea, [contenteditable] na aplicação. Se definido como true, o cursor será definido como transparent antes de tirar uma captura de tela e redefinido quando concluído.

await browser.saveScreen(
    'sample-tag',
    {
        disableBlinkingCursor: true
    }
)

`disableCSSAnimation`

Tipo: boolean
Obrigatório: Não
Padrão: false
Usado com: Todos os métodos
Contextos de Aplicação Suportados: Web, Aplicativo Híbrido (Webview)

Ativar/Desativar todas as animações CSS na aplicação. Se definido como true, todas as animações serão desativadas antes de tirar uma captura de tela e redefinidas quando concluído

await browser.saveScreen(
    'sample-tag',
    {
        disableCSSAnimation: true
    }
)

`enableLegacyScreenshotMethod`

Tipo: boolean
Obrigatório: Não
Padrão: false
Usado com: Todos os métodos
Contextos de Aplicação Suportados: Web, Aplicativo Híbrido (Webview)

Use esta opção para voltar ao método de captura de tela "mais antigo" baseado no protocolo W3C-WebDriver. Isso pode ser útil se seus testes dependem de imagens de linha de base existentes ou se você está executando em ambientes que não suportam totalmente as capturas de tela baseadas em BiDi mais recentes. Observe que habilitar isso pode produzir capturas de tela com resolução ou qualidade ligeiramente diferentes.

await browser.saveScreen(
    'sample-tag',
    {
        enableLegacyScreenshotMethod: true
    }
)

`enableLayoutTesting`

Tipo: boolean
Obrigatório: Não
Padrão: false
Usado com: Todos os métodos
Contextos de Aplicação Suportados: Web, Aplicativo Híbrido (Webview)

Isso ocultará todo o texto em uma página para que apenas o layout seja usado para comparação. A ocultação será feita adicionando o estilo 'color': 'transparent !important' a cada elemento.

Para a saída, veja Saída de Teste.

informação

Ao usar esta flag, cada elemento que contém texto (não apenas p, h1, h2, h3, h4, h5, h6, span, a, li, mas também div|button|..) receberá esta propriedade. Não há opção para personalizar isso.

await browser.saveScreen(
    'sample-tag',
    {
        enableLayoutTesting: true
    }
)

`hideScrollBars`

Tipo: boolean
Obrigatório: Não
Padrão: true
Usado com: Todos os métodos
Contextos de Aplicação Suportados: Web, Aplicativo Híbrido (Webview)

Ocultar barra(s) de rolagem na aplicação. Se definido como true, todas as barra(s) de rolagem serão desativadas antes de tirar uma captura de tela. Isso é definido como true por padrão para evitar problemas extras.

await browser.saveScreen(
    'sample-tag',
    {
        hideScrollBars: false
    }
)

`hideElements`

Tipo: array
Obrigatório: Não
Usado com: Todos os métodos
Contextos de Aplicação Suportados: Web, Aplicativo Híbrido (Webview)

Este método pode ocultar 1 ou vários elementos adicionando a propriedade visibility: hidden a eles, fornecendo um array de elementos.

await browser.saveScreen(
    'sample-tag',
    {
        hideElements: [
            await $('#element-1'),
            await $('#element-2'),
        ]
    }
)

`removeElements`

Tipo: array
Obrigatório: Não
Usado com: Todos os métodos
Contextos de Aplicação Suportados: Web, Aplicativo Híbrido (Webview)

Este método pode remover 1 ou vários elementos adicionando a propriedade display: none a eles, fornecendo um array de elementos.

await browser.saveScreen(
    'sample-tag',
    {
        removeElements: [
            await $('#element-1'),
            await $('#element-2'),
        ]
    }
)

`resizeDimensions`

Tipo: object
Obrigatório: Não
Padrão: { top: 0, right: 0, bottom: 0, left: 0}
Usado com: Apenas para saveElement ou checkElement
Contextos de Aplicação Suportados: Web, Aplicativo Híbrido (Webview), Aplicativo Nativo

Um objeto que precisa conter uma quantidade de pixels top, right, bottom e left que precisam tornar o recorte do elemento maior.

await browser.saveElement(
    'sample-tag',
    {
        resizeDimensions: {
            top: 50,
            left: 100,
            right: 10,
            bottom: 90,
        },
    }
)

`userBasedFullPageScreenshot`

Tipo: boolean
Obrigatório: Não
Padrão: false
Usado com: Apenas para saveFullPageScreen, saveTabbablePage, checkFullPageScreen ou checkTabbablePage
Contextos de Aplicação Suportados: Web, Aplicativo Híbrido (Webview)

Quando definido como true, esta opção habilita a estratégia de rolagem e costura para capturar capturas de tela de página inteira. Em vez de usar os recursos nativos de captura de tela do navegador, ele rola pela página manualmente e costura várias capturas de tela juntas. Este método é especialmente útil para páginas com conteúdo carregado preguiçosamente ou layouts complexos que exigem rolagem para renderização completa.

await browser.saveScreen(
    'sample-tag',
    {
        userBasedFullPageScreenshot: true
    }
)

`fullPageScrollTimeout`

Tipo: number
Obrigatório: Não
Padrão: 1500
Usado com: Apenas para saveFullPageScreen ou saveTabbablePage
Contextos de Aplicação Suportados: Web, Aplicativo Híbrido (Webview)

O tempo limite em milissegundos para esperar após uma rolagem. Isso pode ajudar a identificar páginas com carregamento preguiçoso.

NOTA: Isso só funciona quando userBasedFullPageScreenshot está definido como true

await browser.saveFullPageScreen(
    'sample-tag',
    {
        fullPageScrollTimeout: 3 * 1000
    }
)

`hideAfterFirstScroll`

Tipo: array
Obrigatório: Não
Usado com: Apenas para saveFullPageScreen ou saveTabbablePage
Contextos de Aplicação Suportados: Web, Aplicativo Híbrido (Webview)

Este método ocultará um ou vários elementos adicionando a propriedade visibility: hidden a eles, fornecendo um array de elementos. Isso será útil quando uma página, por exemplo, tiver elementos fixos que rolam com a página se a página for rolada, mas darão um efeito irritante quando uma captura de tela de página inteira for feita

NOTA: Isso só funciona quando userBasedFullPageScreenshot está definido como true

await browser.saveFullPageScreen(
    'sample-tag',
    {
        hideAfterFirstScroll: [
            await $('#element-1'),
            await $('#element-2'),
        ]
    }
)

`waitForFontsLoaded`

Tipo: boolean
Obrigatório: Não
Padrão: true
Usado com: Todos os métodos
Contextos de Aplicação Suportados: Web, Aplicativo Híbrido (Webview)

Fontes, incluindo fontes de terceiros, podem ser carregadas de forma síncrona ou assíncrona. O carregamento assíncrono significa que as fontes podem ser carregadas depois que o WebdriverIO determinar que uma página foi totalmente carregada. Para evitar problemas de renderização de fontes, este módulo, por padrão, aguardará que todas as fontes sejam carregadas antes de tirar uma captura de tela.

await browser.saveScreen(
    'sample-tag',
    {
        waitForFontsLoaded: true
    }
)

Opções de Comparação (Verificação)

As opções de comparação são opções que influenciam a forma como a comparação, pelo ResembleJS, é executada.

`ignoreAlpha`

Tipo: boolean
Padrão: false
Obrigatório: Não
Usado com: Todos os Métodos de Verificação
Contextos de Aplicação Suportados: Todos

Compara imagens e descarta o canal alfa.

await browser.checkScreen(
    'sample-tag',
    {
        ignoreAlpha: true
    }
)

`blockOutSideBar`

Tipo: boolean
Padrão: true
Obrigatório: Não
Usado com: Pode ser usado apenas para checkScreen(). Isso é apenas para iPad
Contextos de Aplicação Suportados: Todos

Bloqueia automaticamente a barra lateral para iPads no modo paisagem durante as comparações. Isso evita falhas no componente nativo de guia/privado/favoritos.

await browser.checkScreen(
    'sample-tag',
    {
        blockOutSideBar: true
    }
)

`blockOutStatusBar`

Tipo: boolean
Padrão: true
Obrigatório: Não
Usado com: Isso é apenas para Mobile
Contextos de Aplicação Suportados: Híbrido (parte nativa) e Aplicativos Nativos

Bloqueia automaticamente a barra de status e a barra de endereço durante as comparações. Isso evita falhas no tempo, status de Wi-Fi ou bateria.

await browser.checkScreen(
    'sample-tag',
    {
        blockOutStatusBar: true
    }
)

`blockOutToolBar`

Tipo: boolean
Padrão: true
Obrigatório: Não
Usado com: Isso é apenas para Mobile
Contextos de Aplicação Suportados: Híbrido (parte nativa) e Aplicativos Nativos

Bloqueia automaticamente a barra de ferramentas.

await browser.checkScreen(
    'sample-tag',
    {
        blockOutToolBar: true
    }
)

`ignoreAntialiasing`

Tipo: boolean
Padrão: false
Obrigatório: Não
Usado com: Todos os Métodos de Verificação
Contextos de Aplicação Suportados: Todos

Compara imagens e descarta o anti-aliasing.

await browser.checkScreen(
    'sample-tag',
    {
        ignoreAntialiasing: true
    }
)

`ignoreColors`

Tipo: boolean
Padrão: false
Obrigatório: Não
Usado com: Todos os Métodos de Verificação
Contextos de Aplicação Suportados: Todos

Mesmo que as imagens estejam em cores, a comparação comparará 2 imagens em preto e branco

await browser.checkScreen(
    'sample-tag',
    {
        ignoreColors: true
    }
)

`ignoreLess`

Tipo: boolean
Padrão: false
Obrigatório: Não
Usado com: Todos os Métodos de Verificação
Contextos de Aplicação Suportados: Todos

Compara imagens e compara com red = 16, green = 16, blue = 16, alpha = 16, minBrightness=16, maxBrightness=240

await browser.checkScreen(
    'sample-tag',
    {
        ignoreLess: true
    }
)

`ignoreNothing`

Tipo: boolean
Padrão: false
Obrigatório: Não
Usado com: Todos os Métodos de Verificação
Contextos de Aplicação Suportados: Todos

Compara imagens e compara com red = 0, green = 0, blue = 0, alpha = 0, minBrightness=0, maxBrightness=255

await browser.checkScreen(
    'sample-tag',
    {
        ignoreNothing: true
    }
)

`rawMisMatchPercentage`

Tipo: boolean
Padrão: false
Obrigatório: Não
Usado com: Todos os Métodos de Verificação
Contextos de Aplicação Suportados: Todos

Se verdadeiro, a porcentagem de retorno será como 0.12345678, o padrão é 0.12

await browser.checkScreen(
    'sample-tag',
    {
        rawMisMatchPercentage: true
    }
)

`returnAllCompareData`

Tipo: boolean
Padrão: false
Obrigatório: Não
Usado com: Todos os Métodos de Verificação
Contextos de Aplicação Suportados: Todos

Isso retornará todos os dados de comparação, não apenas a porcentagem de incompatibilidade, veja também Saída do Console

await browser.checkScreen(
    'sample-tag',
    {
        returnAllCompareData: true
    }
)

`saveAboveTolerance`

Tipo: number
Padrão: 0
Obrigatório: Não
Usado com: Todos os Métodos de Verificação
Contextos de Aplicação Suportados: Todos

Valor admissível de misMatchPercentage que impede o salvamento de imagens com diferenças

await browser.checkScreen(
    'sample-tag',
    {
        saveAboveTolerance: 0.25
    }
)

`largeImageThreshold`

Tipo: number
Padrão: 0
Obrigatório: Não
Usado com: Todos os Métodos de Verificação
Contextos de Aplicação Suportados: Todos

Comparar imagens grandes pode levar a problemas de desempenho. Ao fornecer um número para o número de pixels aqui (maior que 0), o algoritmo de comparação pula pixels quando a largura ou altura da imagem é maior que largeImageThreshold pixels.

await browser.checkScreen(
    'sample-tag',
    {
        largeImageThreshold: 1500
    }
)

`scaleImagesToSameSize`

Tipo: boolean
Padrão: false
Obrigatório: Não
Usado com: Todos os Métodos de Verificação
Contextos de Aplicação Suportados: Todos

Redimensiona 2 imagens para o mesmo tamanho antes da execução da comparação. Altamente recomendado habilitar ignoreAntialiasing e ignoreAlpha

await browser.checkScreen(
    'sample-tag',
    {
        scaleImagesToSameSize: true
    }
)

`ignore`

Tipo: array
Obrigatório: Não
Usado com: Apenas com o método checkScreen, NÃO com o método checkElement
Contextos de Aplicação Suportados: Aplicativo Nativo

Este método bloqueará automaticamente elementos ou uma área na tela com base em um array de elementos ou um objeto de x|y|width|height.

await browser.checkScreen(
    'sample-tag',
    {
        ignore: [
            $('~element-1'),
            await $('~element-2'),
            {
                x: 150,
                y: 250,
                width: 100,
                height: 100,
            }
        ]
    }
)

Opções de pasta

A pasta de linha de base e as pastas de captura de tela (atual, diff) são opções que podem ser definidas durante a instanciação do plugin ou método. Para definir as opções de pasta em um método específico, passe as opções de pasta para o objeto de opções dos métodos. Isso pode ser usado para:

Web
Aplicativo Híbrido
Aplicativo Nativo

import path from 'node:path'

const methodOptions = {
    actualFolder: path.join(process.cwd(), 'customActual'),
    baselineFolder: path.join(process.cwd(), 'customBaseline'),
    diffFolder: path.join(process.cwd(), 'customDiff'),
}

// Você pode usar isso para todos os métodos
await expect(
    await browser.checkFullPageScreen("checkFullPage", methodOptions)
).toEqual(0)

`actualFolder`

Tipo: string
Obrigatório: Não
Contextos de Aplicação Suportados: Todos

Pasta para a captura que foi capturada no teste.

`baselineFolder`

Tipo: string
Obrigatório: Não
Contextos de Aplicação Suportados: Todos

Pasta para a imagem de linha de base que está sendo usada para comparação.

`diffFolder`

Tipo: string
Obrigatório: Não
Contextos de Aplicação Suportados: Todos

Pasta para a diferença de imagem renderizada pelo ResembleJS.

Opções de Salvamento​

disableBlinkingCursor​

disableCSSAnimation​

enableLegacyScreenshotMethod​

enableLayoutTesting​

hideScrollBars​

hideElements​

removeElements​

resizeDimensions​

userBasedFullPageScreenshot​

fullPageScrollTimeout​

hideAfterFirstScroll​

waitForFontsLoaded​

Opções de Comparação (Verificação)​

ignoreAlpha​

blockOutSideBar​

blockOutStatusBar​

blockOutToolBar​

ignoreAntialiasing​

ignoreColors​

ignoreLess​

ignoreNothing​

rawMisMatchPercentage​

returnAllCompareData​

saveAboveTolerance​

largeImageThreshold​

scaleImagesToSameSize​

ignore​

Opções de pasta​

actualFolder​

baselineFolder​

diffFolder​