WebdriverIO · Тестовий фреймворк наступного покоління для автоматизації браузерів та мобільних пристроїв у Node.js

import { $, expect } from '@wdio/globals'
import { render } from '@testing-library/vue'
import HelloWorld from '../../src/components/HelloWorld.vue'

describe('Component Testing', () => {
    it('increments value on click', async () => {
        const { getByText } = render(HelloWorld)
        const btn = getByText('count is 0')

        // transform into WebdriverIO element
        const button = await $(btn)

        // interact with element like a real user
        await button.click()
        await button.click()

        getByText('count is 2')
    })
})

E2E та Unit / Компонентне тестування в реальному браузері!

WebdriverIO — це фреймворк в якому включено все для розробки ваших веб застосунків. Він дає змогу запускати невеликі та легкі компонентні тести, а також запускати сценарії тестування E2E у браузері чи на мобільному пристрої. Це гарантує, що ви тестуєте у середовищі що використовується вашими користувачами.

Він поставляється з розумними селекторами, які спрощують взаємодію, наприклад, з React components або виконання тіньового DOM. Оскільки взаємодії відбуваються через стандартизований протокол автоматизації, гарантовано, що вони поводяться нативно, а не просто емулюють JavaScript.

Просте налаштування для тестування веб-компонентів за допомогою:

Почніть роботу з WebdriverIO за лічені секунди

The WebdriverIO testrunner comes with a command line interface that provides a powerful configuration utility and helps you to create your test setup in less than a minute. It lets you pick from available test framework integrations and easily allows to add all supported reporter and service plugins!

За допомогою лише однієї простої команди ви можете налаштувати повний набір тестів:


$ npm init wdio@latest ./

Дізнайтеся більше про WebdriverIO і те як почати роботу на YouTube.

Перегляньте розмови про WebdriverIO

Спільнота навколо WebdriverIO активно обговорює в різних користувацьких групах та на конференціях конкретні теми щодо автоматизованого тестування за допомогою WebdriverIO. Перегляньте цю розмову на Мої улюблені функції WebdriverIO від Julia Pottinger на Open Quality Conference.

Існує також багато каналів YouTube із корисними навчальними відео від учасників спільноти, наприклад Klamping, Seventeenth Sep або Automation Bro.

Інтеграція із Google Lighthouse

WebdriverIO не тільки працює не тільки із автоматизацією на основі протоколу WebDriver, але також використовує вбудовані API браузера для інтеграції з популярними інструментами розробника, такими як Chrome DevTools або Google Lighthouse. За допомогою плагіна @wdio/devtools-service ви отримуєте доступ до команд для перевірки того, чи ваш додаток відповідає вимогам PWA, а також до команд для збору показників продуктивності інтерфейсу, таких як `speedIndex` та інші.

Інтеграція з інструментами розробника, такими як:

await browser.emulateDevice('iPhone X')
await browser.enablePerformanceAudits({
    networkThrottling: 'Good 3G',
    cacheEnabled: true,
    formFactor: 'mobile'
})

// open application under test
await browser.url('https://localhost:3000')

expect(await browser.getMetrics().firstMeaningfulPaint)
    .toBeBelow(2500)

const pwaCheckResult = await browser.checkPWA()
expect(pwaCheckResult.passed).toBe(true)