как сделать снимок экрана с помощью локатора, а затем сравнить его с другим локатором со снимком экрана, используя appium с webdriverio

Question

как сделать снимок экрана с помощью локатора, а затем сравнить его с другим локатором со снимком экрана (и сравнить эти два изображения), используя appium и webdriverio. Я пытался посмотреть учебник, но не смог найти ничего, что работает

Answer 1

Вы можете сделать снимок экрана элемента с webdriver io, как указано ниже

it('should save a screenshot of the browser view', function () {
    const elem = $('#someElem');
    elem.saveScreenshot('./some/path/elemScreenshot.png');
});

, о котором вы можете узнать подробнее в официальной документации webdriver-io

После того, как вы сделали снимок экрана для обоих элементов, вы можете использовать службу визуальной регрессии для WebdriverIO V5 с именем wdio-image-Сравнение-сервис .

Установка: Установка этот модуль локально со следующей командой для использования в качестве (dev-) зависимости:

npm install --save-dev wdio-image-comparison-service

Инструкции по установке WebdriverIO можно найти здесь .

Использование:

Служба wdio-image-Сравнение поддерживает NodeJS 8 или выше

Конфигурация: wdio-image-comparison-service - это услуга, поэтому ее можно использовать как обычную услугу. Вы можете установить его в своем файле wdio.conf.js со следующими данными:

const { join } = require('path');

// wdio.conf.js
exports.config = {
    // ...
    // =====
    // Setup
    // =====
    services: [ 
        ['image-comparison', 
        // The options
        {
            // Some options, see the docs for more
            baselineFolder: join(process.cwd(), './tests/sauceLabsBaseline/'),
            formatImageName: '{tag}-{logName}-{width}x{height}',
            screenshotPath: join(process.cwd(), '.tmp/'),
            savePerInstance: true,
            autoSaveBaseline: true,
            blockOutStatusBar: true,
            blockOutToolBar: true,
            // ... more options
        }], 
    ],
    // ...
};

Написание тестов для сравнения снимков экрана из 2 элементов:

describe('Example', () => {
  beforeEach(() => {
     browser.url('https://webdriver.io');
  });



  it('should save some screenshots', () => {

    // Save an element
    browser.saveElement($('#element-id'), 'firstButtonElement', { /* some options*/ });

  });



  it('should compare successful with a baseline', () => {

    // Check an element
    expect(browser.checkElement($('#element-id'), 'firstButtonElement', { /* some options*/ })).toEqual(0);

  });
});

Referene c: пожалуйста, проверьте все детали сравнения изображений здесь