Автор: Иоан Солдереа (Ioan Solderea)
Оригинал статьи
Перевод: Ольга Алифанова

Средства записи и воспроизведения очень популярны в мире автоматизированного тестирования из-за своей способности упрощать создание тест-сценариев. Эти инструменты позволяют тестировщикам записывать взаимодействие с приложением и генерировать пригодные для повторного использования скрипты, которые можно проигрывать для воспроизведения тех же действий.

Инструменты записи и воспроизведения упрощают новичкам старт работы с автоматизацией, позволяя набраться уверенности и перейти к созданию кода и проектированию более сложных автоматизированных сценариев.

Так как практически в каждом инструменте, продукте и библиотеке тест-автоматизации есть средство записи и воспроизведения, меня заинтересовало, а как с этим обстоят дела у мощного фреймворка автоматизации.

В этой статье мы рассмотрим плюсы Playwright в качестве инструмента записи и воспроизведения, и обсудим его преимущества для автоматизированного тестирования.

Расцвет средств записи и воспроизведения

На современном рынке ПО тестирование должно быть быстрым, а его результаты – надежными, чтобы как можно быстрее доставить качественный продукт потребителям.

Вне сомнения, наиболее часто используемый в последние годы термин – это «тест-автоматизация». Тест-автоматизация изменила мир, позволяя ускорить тестирование, повысить эффективность, и улучшить общее качество ПО.

Традиционная тест-автоматизация – это масштабная разработка кода и сценариев, и для создания и поддержки сложных сценариев тестирования требуются опытные программисты. Однако у этого подхода есть свои проблемы – он ограничивает вовлеченность далеких от технической стороны вопроса тестировщиков, а кривая адаптации практик автоматизации у него довольно крутая.

Осознав эти барьеры, компании разработали инструменты записи и воспроизведения, чтобы все тестировщики могли участвовать в процессе тестирования.

Эти инструменты позволяют тестировщикам взаимодействовать с приложением, и все их действия записываются в реальном времени. Эти взаимодействия могут включать такие действия, как клики по кнопкам, ввод данных, навигацию по экранам и валидацию результатов. Как только запись завершена, инструмент генерирует автоматизированные тест-сценарии, воспроизводящие записанные действия, и тест можно повторить с минимальными усилиями.

Преимущества средств записи и воспроизведения

Одно из ключевых преимуществ средств записи и воспроизведения – это их простота. Тестировщики могут создавать тест-скрипты, просто используя приложение и выполняя нужные действия – нет необходимости в глубоких знаниях программирования. Этот подход дает доменным экспертам и технически не подкованным тестировщикам возможность активно участвовать в процессе автоматизации, применяя свой опыт для создания ценных тест-сценариев.

К тому же эти инструменты значительно снижают время и усилия, необходимые для создания тест-скриптов. Тестировщикам больше не нужно писать код с нуля; вместо этого можно быстро сгенерировать скрипты, взаимодействуя с приложением. Это не только повышает продуктивность, но и ускоряет циклы создания и запуска тестов, и команды удерживают быстрый темп разработки ПО.

Возможность повторно использовать записанные тест-скрипты – другое примечательное преимущество. Как только скрипт создан, его можно легко использовать в разных тест-прогонах и окружениях. Это устраняет необходимость дублировать усилия и позволяет согласовать усилия тестирования различных сценариев.

Недостатки средств записи и воспроизведения

Зачастую тестировщики имеют дело с приложениями, где часто меняется пользовательский интерфейс, и в результате падают тесты, которые раньше срабатывали. В качестве решения тестировщик часто делает вроде бы очевидный выбор – перезаписывает тесты заново.

Однако «простая перезапись» может занимать много времени, что сводит на нет продуктивность тестирования. Тестировщикам нужно вручную пройти по приложению, воссоздать каждый шаг и заново валидировать результаты – это дублирует их усилия и потенциально приводит к новым ошибкам.

К тому же по мере роста сложности приложений уже недостаточно полагаться исключительно на записанные взаимодействия, если мы стремимся к всестороннему тест-покрытию. Тестировщики могут столкнуться со сценариями, требующими дополнительной валидации, сложной логики или условных действий, которые нельзя зафиксировать простой записью.

Следовательно, инструменты записи и воспроизведения, конечно, упрощают создание тест-скриптов, но для тщательного тестирования их нужно применять вместе с другими техниками автоматизации.

Знаете ли вы про эти инструменты?

По мере роста спроса на быстрые релизы и гибкие методологии инструменты записи и воспроизведения все больше привлекают тестировщиков. Многие продавцы инструментов инвестировали в разработку и улучшение этих средств, предоставляя продвинутые функции вроде поддержки множества платформ, интеграции с популярными фреймворками и встроенной отчетности.

Для полноты картины масштабов рынка средств записи и воспроизведения я создал список самых популярных:

• Rainforest QA – использует пиксельное соответствие и предустановленные действия для шагов теста. Это значит, что кто угодно, даже далекий от разработки, может создавать, редактировать и запускать тесты.
• Selenium IDE – один из самых известных в этом списке инструментов. Selenium, предок Webdriver, позволяет записывать и воспроизводить действия в Chrome и Firefox через браузерное расширение.
• TestComplete – создан SmartBear и использует JavaScript, Python и VBScript. Он поддерживает тестирование на большинстве платформ для десктопа, веба и мобильных устройств (включая как iOS, так и Android).
• Micro Focus UFT – предлагает несколько методов создания тестов – от самостоятельного написания кода до записи и воспроизведения. Это был первый мой инструмент записи и воспроизведения (тогда он назывался Quicktest Professional).
• Katalon Studio – в отличие от других инструментов, Katalon позволяет разработчикам остановить запись в ходе создания или выполнения теста и начать ее заново в любой точке, чтобы добавить дополнительные строчки кода.
• Cypress Studio – одно из моих любимых решений для создания тестов. Можно быстро записать тесты, провести дебаг визуально, и даже записать их.

• Playwright – этот инструмент мы разберем в статье.

Я знаю, что это не исчерпывающий список инструментов с опцией записи и воспроизведения, да такой список и невозможно сюда поместить. Я хотел продемонстрировать, что таких инструментов много – возможно, некоторые из них вам знакомы, а некоторые – нет.

Быстрое знакомство с Playwright

Playwright – мощный и гибкий фреймворк автоматизации с открытым исходным кодом, разработанный Microsoft. Его функции и возможности включают следующее, согласно репозиторию Playwright в GitHub:

• Кросс-браузерность. Playwright поддерживает все современные движки рендера, включая Chromium, Firefox и WebKit.
• Кросс-платформенность. Тестировать можно под Windows, Linux, macOS, локально или на сервере непрерывной интеграции, с наличием или отсутствием графического интерфейса.
• Мультиязычность. Используйте Playwright API на TypeScript, JavaScript, Python, .NET или Java.

Возможности автоматизации Playwright выходят за рамки простых действий вроде кликов по кнопкам и заполнения форм. Некоторые из продвинутых функций, согласно документации:

• Доверенные события. Наводитесь на элементы, взаимодействуйте с динамическими элементами управления, создавайте доверенные события. Playwright использует процесс ввода реального браузера, неотличимый от настоящего пользователя.
• Тестирование фреймов, проникновение в теневую DOM. Селекторы Playwright проникают в теневую DOM и позволяют бесшовно заходить во фреймы.
• Автоматическое ожидание. Playwright ожидает возможности взаимодействия с элементом, прежде чем выполнять действия. У него также богатый набор интроспективных событий. Эта комбинация устраняет нужду в искусственных таймаутах – основной причине нестабильности тестов.

Несмотря на богатую функциональность Playwright, соблазняющую начать им пользоваться, сначала нужно обдумать некоторые аспекты.

Playwright поддерживает множество языков, и в документации и функциональности могут встречаться проблемы. По опыту, исчерпывающая документация была доступна для Java и JavaScript, но ее слегка не хватало для Python и .NET. С тех пор ситуация улучшилась.

К тому же в зависимости от языка, который вы выбрали для автоматизации, крутизна кривой обучения может различаться – синтаксис Java сильно отличается от применяемого в Selenium.

Чтобы быстро начать, в следующей части мы разберемся, как установить Playwright и привыкнуть к его синтаксису, пользуясь возможностями записи.

Playwright в действии

Для начала установим приложение с нуля на Windows.

Для этого нужны только:

• IDE (Я буду пользоваться Visual Studio Code)
• Node.js

Установка

Установив все из списка выше, создаем новую папку, а затем открываем ее в IDE.

С открытым IDE введите в терминал команду для установки и настройки Playwright.

npm init playwright@latest

Установка требует выбора настроек:

• Нужно выбрать между TypeScript и JavaScript (по умолчанию TypeScript).
• Нужно дать имя папке тестов (по умолчанию tests или e2e, если папка tests уже существует в проекте).
• Нужно добавить процесс GitHub Actions, чтобы легко запускать тесты на CI-сервере.
• Нужно установить браузеры Playwright (по умолчанию устанавливаются).

Когда настройки выбраны, установка продолжится.

Getting started with writing end-to-end tests with Playwright:

Initializing project in '.'

√ Do you want to use TypeScript or JavaScript? · TypeScript

√ Where to put your end-to-end tests? · tests

√ Add a GitHub Actions workflow? (y/N) · false

√ Install Playwright browsers (can be done manually via 'npx playwright install')? (Y/n) · true

Initializing NPM project (npm init -y)…

Wrote to D:\PlaywrightMOT\package.json:

Установка может занять несколько минут – это зависит от вашей системы. После этого вы получите вот такую структуру проекта:

• .\tests\example.spec.js - Пример end-to-end теста.
• .\tests-examples\demo-todo-app.spec.js – Пример end-to-end тестов для to-do приложения.
• .\playwright.config.js – Конфигурация тестов Playwright.

Использование рекордера для первичного создания тестов

Теперь, когда установка завершена, мы запишем тест:

• Перейти на https://automationintesting.online/
• Заполнить форму.
• Отправить ее.

Для начала записи введите в терминал команду:

npx playwright codegen

Откроется два окна:

• Окно браузера, где вы взаимодействуете с тестируемым сайтом.
• Окно инспектора Playwright, где можно записывать тесты и копировать их в редакторе.

Когда вы перейдете по ссылке, в нашем случае на https://automationintesting.online/, в браузере и начнете взаимодействовать со страницей, средство записи будет автоматически обновлять и дополнять код на основании ваших действий. Тут нужно помнить про важный аспект – записываться будут все действия, поэтому многократный клик по кнопке будет многократно отражен в коде. Не волнуйтесь – после завершения записи код можно редактировать.

Когда вы выполните все нужные шаги, запись можно остановить. В инспекторе вы увидите сгенерированный код.

Для сохранения кода в файл его нужно скопировать в редактор. Чтобы упростить наш пример, я скопировал код в example.specs.js.

Тест нужно прогнать, чтобы проверить его корректность. Для прогона тестов введите команду:

npx playwright test

Эта команда прогоняет все тесты из папки tests. Если вы хотите прогнать только один файл тестов, передайте имя этого файла команде в качестве аргумента:

npx playwright test example.spec.js

По умолчанию тесты запускаются в трех браузерах – Chromium, Firefox и Webkit, используя три разных сервиса. Браузеры по умолчанию можно настроить в файле playwright.config.

Тесты запускаются в режиме без графического интерфейса – окна браузера при прогоне открываться не будут. Результаты тестов и логи выводятся в терминал.

Для просмотра прогона тестов и дебага можно воспользоваться командой, запускающей тест в открытом окне браузера.

npx playwright test --ui

В этом режиме мы увидим все имеющиеся тесты. С ними и с тестируемым приложением можно взаимодействовать на каждом шаге при помощи реверсивного управления дебагом.

Возможно, вы заметили, что в средстве записи отсутствует одна критическая, с моей точки зрения, функция тест-автоматизации. Проверки.

Для завершения нашего теста изменим его, добавив в конце проверку подтверждающего текста. Нужно всего лишь изменить последний кусочек теста. В Playwright проверки выполняются при помощи функции expect. В нашем случае мы вызовем expect и добавим метод toContainText.

await page.getByRole(‘buton’, {name: ‘Submit’}).click();

await expect(page.getByRole(‘heading’, {name: ‘Thanks for getting in touch Article!’ })).toContainText(‘Article’);

После сохранения файла и повторного прогона тестов вы увидите, что он отмечен, как пройденный.

Чтобы убедиться, что проверка верна, можно изменить передаваемую в метод toContainText строку с «Article» на что-нибудь еще, а затем перепрогнать тест. Он упадет, и логи покажут вам точную причину и упавшую часть теста.

Заключение

В мире, где тест-автоматизация критически важна для поставок высококачественного ПО, Playwright выделяется своей полезностью для искателей современного и продуктивного подхода.

Его кросс-браузерные и кросс-платформенные возможности, богатый набор функций и растущее сообщество ставят его на позицию лидера, влияющего на будущее тест-автоматизации и позволяющего командам эффективно и продуктивно достигать своих целей.

Обсудить в форуме