Testplane MCP
Рады представить Testplane MCP — проект, который позволяет AI-агентам быть в контексте происходящего в браузере, совершать действия и генерировать тесты с учетом реального состояния страницы.
Какие возможности открывает Testplane MCP?
Значительное улучшение генерации тестов
Представим, что мы добавили в приложение новую функциональность и теперь хотим сгенерировать тесты на неё с помощью AI-агента. Ранее, AI-агент мог лишь предположить как выглядит эта страница — селекторы, скорее всего, получились бы вымышленными, и тест требовал бы серьезных правок.
Testplane MCP выводит этот процесс на новый уровень: AI-агент во время написания теста может открыть нужную страницу в браузере, посмотреть на её верстку или выполнить любые действия (например, нажать на кнопку или заполнить форму).
В результате AI-агент может сгенерировать тест имея полный контекст происходящего в браузере — включая селекторы, которые действительно есть на странице.
Использование браузера AI-агентами
Testplane MCP делает возможным автоматизировать повторяющиеся процессы. Например, можно построить воркфлоу для извлечения информации из фото чеков, после чего с помощью Testplane MCP заходить на панель управления своей организации и заполнять форму отчета с соответствующей информацией (наименование, количество, цена и т.д.).
Установка
Необходимо добавить сервер Testplane MCP в конфигурацию вашей IDE.
- Cursor
- VS Code + Cline
- VS Code + Copilot
- Claude Desktop
- Windsurf
- Jetbrains
Откройте настройки Cursor (кнопка в правом верхнем углу IDE), в секции MCP нажмите на кнопку Add new global MCP server, добавьте в конфиг Testplane MCP как в примере ниже.
{
"mcpServers": {
"testplane-mcp": {
"command": "npx",
"args": ["@testplane/mcp@latest"]
}
}
}
- Установите расширение Cline.
- На вкладке расширения необходимо перейти на вкладу "MCP" и нажать "Configure MCP Servers".
- Добавьте в конфиг Testplane MCP как в примере ниже.
{"mcpServers": {"testplane-mcp": {"command": "npx","args": ["@testplane/mcp@latest"]}}}
Откройте настройки VS Code, введите в поиск MCP, нажмите на Edit in settings.json, добавьте в конфиг Testplane MCP как в примере ниже.
{
"mcp": {
"inputs": [],
"servers": {
"testplane-mcp": {
"command": "npx",
"args": ["@testplane/mcp@latest"]
}
}
}
}
Откройте настройки как показано в оф. документации, добавьте в конфиг Testplane MCP как в примере ниже.
{
"mcpServers": {
"testplane-mcp": {
"command": "npx",
"args": ["@testplane/mcp@latest"]
}
}
}
Откройте настройки как показано в оф. документации, добавьте в конфиг Testplane MCP как в примере ниже.
{
"mcpServers": {
"testplane-mcp": {
"command": "npx",
"args": ["@testplane/mcp@latest"]
}
}
}
Откройте настройки как показано в оф. документации, добавьте в конфиг Testplane MCP как в примере ниже.
{
"mcpServers": {
"testplane-mcp": {
"command": "npx",
"args": ["@testplane/mcp@latest"]
}
}
}
После установки AI-агент сможет использовать Testplane MCP, можно прямо указать на это в промпте: "Используй testplane mcp, чтобы открыть страницу ...".
Использование
Рассмотрим кейс разработки интернет-магазина книг. Представим, что у нас появилась новая фича — отображение оценок книг и мы хотим сгенерировать тесты на эту фичу.
Сначала попросим AI-агента проанализировать страницу и составить план тестирования.
Теперь попробуем сгенерировать тесты и запустить их.
Как мы видим, AI-агент с первого раза сгенерировал тесты, которые проходят и содержат корректные селекторы.
Вы можете попробовать такой промпт для генерации тестов с использованием Testplane MCP:
Используй testplane mcp, чтобы открыть страницу
https://ya.ru, выполни поиск по запросу "котики", проверь, что результаты поиска отображаются.Не пиши лишние комментарии в тестах, кроме сложных краевых случаев. Пиши тесты в соответствии со стилем проекта.
Старайся использовать семантические селекторы, например, по атрибутам
data-testidили тексту элемента вместо сложных CSS-селекторов.
Особенности реализации
Testplane MCP — не единственная реализация возможности взаимодействия AI-агента с браузером.
На данный момент Testplane MCP обеспечивает следующие преимущества:
-
Очень компактные и гибкие снапшоты страниц, модели не нужно работать со скриншотами. Это значительная экономия токено в API LLM.
Как пример — полный исходник
https://ya.ruзанимает ~260,000 символов, а компактный снапшот — лишь ~9,000.Пример снапшота
- body:- main.body__wrapper:- div.headline:- div.headline__personal:- a.home-link2.alice.headline__personal-item.home-link2_color_quaternary[aria-label=Алиса href="https://alice.yandex.ru/?utm_source=yandex&utm_campaign=morda_header_oknyx&utm_medium=interface"]:- svg.alice__icon- div:- div:- a.home-link2.headline__personal-item.headline__personal-item_services[aria-label=Сервисы href=https://yandex.ru/all title=Сервисы role=button]:- div.headline__personal-icon:- svg- a.home-link2.headline__personal-enter.home-link2_color_black[href="https://passport.yandex.ru/auth?retpath=https%3A%2F%2Fsso.passport.yandex.ru%2Fpush%3Fretpath%3Dhttp..."] "Войти"- div:- div.usermenu-portal:- div:- a.home-link2.headline__personal-menu.headline__personal-item[aria-label="Профиль, вход не выполнен" role=button tabindex=0 href="https://passport.yandex.ru/auth?origin=morda&retpath=https%3A%2F%2Fya.ru%2F%3Fnr%3D1%26redirect_ts%3..."]:- div.headline__personal-icon:- svg- div[@hidden]:- div.alerts[role=complementary aria-label=Уведомления]:- h1.a11y-hidden[@hidden] "Уведомления"- div.alert:- a.home-link2.alert__content.home-link2_color_inherit[href="https://yandex.ru/pogoda/146?lat=44.948237&lon=34.100318&utm_content=GroupedTomorrow&utm_medium=aler..."]:- "div.alert__left-content-wrapper[aria-label=\"Завтра: дождь, грозы · +15…+19° · слабый ветер 3–5 м/с, порывы до 11 м/с\"]":- span.alert__text "Завтра: дождь, грозы · +15…+19° · слабый ветер 3–5 м/с, порывы до 11 м/с"- button.alert__close[aria-label=Закрыть @hidden]- div.body__content:- form.mini-suggest.i-mini-bem.mini-suggest_search_yes.mini-suggest_personal_yes.mini-suggest_request_xhr.mini-suggest_favicon_yes.mini-suggest_hide-on-scroll_yes.mini-suggest_direct_yes.mini-suggest_re-request_yes.mini-suggest_direct-disclaimer_yes.mini-suggest_autofocus_yes.mini-suggest_delete-on-hover_yes.mini-suggest_grouping_yes.mini-suggest_theme_tile.mini-suggest_prevent-empty_yes.mini-suggest_entity-suggest_yes.mini-suggest_overlay_yaru.mini-suggest_type-icon_yes.mini-suggest_redesigned-navs_yes.mini-suggest_redesign-type_block.mini-suggest_expanding_yes.mini-suggest_reasoning_yes.mini-suggest_redesign-serp_yes.search3.search3_redesign-type_block.search3_keyboard_yes.search3_voice_yes.search3_camera_yes.mini-suggest_js_inited[action=https://ya.ru/search/ role=search aria-label="Поиск в интернете"]:- div.search3__inner-wrapper:- div:- section.reasoning-section.reasoning-section_on-top_yes.reasoning-section_justify_center:- ul.reasoning-section__list:- li.reasoning-section__item.reasoning-section__item_type_rect:- a.home-link2.reasoning-section__item-link.home-link2_color_inherit[href="https://yandex.ru/finance?utm_source=subclasses_product&utm_content=fin_5&utm_campaign=morda_web&per..."]:- span.reasoning-section__item-title "Финансы"- li.reasoning-section__item.reasoning-section__item_type_rect:- a.home-link2.reasoning-section__item-link.home-link2_color_inherit[href="https://yandex.ru/products?utm_source=subclasses_product&utm_content=ecom&utm_campaign=morda_web&per..."]:- span.reasoning-section__item-title "Товары"- li.reasoning-section__item.reasoning-section__item_type_rect:- a.home-link2.reasoning-section__item-link.home-link2_color_inherit[href="https://yandex.ru/realty?utm_source=subclasses_realty&utm_content=realty&utm_campaign=morda_web&pers..."]:- span.reasoning-section__item-title "Квартиры"- div.search3__inner:- label.search3__input-wrapper-wrapper[for=text]:- div.search3__input-wrapper:- div.search3__input-outer-container:- div.search3__input-inner-container:- input.search3__input.mini-suggest__control[aria-label=Запрос name placeholder="Подробно опишите сложную задачу или вопрос" @hidden]- textarea.search3__input.mini-suggest__input#text[placeholder="Подробно опишите сложную задачу или вопрос" name=text role=combobox]- svg.search3__magnifier- div.search3__action-buttons.search3__action-buttons_submit-button-icon_yes:- div.search3__reasoning-root:- div.search3__reasoning:- div.reasoning-dropdown__root:- div.reasoning-dropdown:- button.reasoning-dropwdown__button[type=button aria-label=Подробнее title=Подробнее]:- svg.search3__reasoning-qmark- div:- button.search3__keyboard.search3__action[title=Клавиатура type=button @hidden]:- svg.search3__svg_keyboard- div.search3__voice-wrapper:- button.Button.VoiceInput.search3__voice.search3__voice_type_depot.VoiceInput_futuris[aria-label="Голосовой поиск" type=button title="Голосовой поиск"]:- span.Button-Text:- svg.VoiceInput-Icon- div:- button.search3__action.search3__camera#image-search[title="Поиск по картинке" type=button]:- svg.search3__svg_camera- button.search3__button.search3__button_icon_yes.mini-suggest__button[type=submit tabindex=-1 aria-label=Найти @hidden]:- svg- input[type=hidden name=lr value=146 @value=146 @hidden]- input[type=hidden name=msid value=1749915681851623-7074561989186018597-balancer-l7leveler-kubr-yp-vla-119-BAL @value=1749915681851623-7074561989186018597-balancer-l7leveler-kubr-yp-vla-119-BAL @hidden]- input[type=hidden name=search_source value=yaru_desktop_common @value=yaru_desktop_common @hidden]- input[type=hidden name=search_domain value=yaru @value=yaru @hidden]- aside.informers3[aria-label=Информеры]:- a.home-link2.informers3__item.informers3-weather.home-link2_color_quaternary.home-link2_hover_tertiary[aria-label="Погода в Симферополе 21°, Облачно с прояснениями" href="https://yandex.ru/pogoda/146?lat=44.948237&lon=34.100318&utm_campaign=informer&utm_content=main_info..."]:- div.informers3-weather__text "+21°"- div:- a.home-link2.informers3__pollen.informers3__item.informers3__pollen_level_yellow.informers3__pollen_animate_yes[aria-label="Низкая активность злаков" href="https://yandex.ru/pogoda/allergies?allergen=cereals&lat=44.948237&lon=34.100318&utm_campaign=informe..."]:- div.simple-tooltip.force-dark.informers-tooltip.simple-tooltip_hidden_yes.simple-tooltip_direction_right[@hidden] "Низкая активность злаков"- section.informers3__stocks:- h2.a11y-hidden "Курсы ЦБ РФ"- div.informers3__stocks-item-wrapper:- a.home-link2.informers3__stocks-item.home-link2_color_quaternary.home-link2_hover_tertiary[aria-label="USD ЦБ 79,00" href="https://ya.ru/search/?lr=146&search_source=ya_morda_stocks&text=USD+%D0%A6%D0%91&wiz=finance"]:- span "USD 79,00"- div.informers3__stocks-item-wrapper:- a.home-link2.informers3__stocks-item.home-link2_color_quaternary.home-link2_hover_tertiary[aria-label="EUR ЦБ 90,01" href="https://ya.ru/search/?lr=146&search_source=ya_morda_stocks&text=EUR+%D0%A6%D0%91&wiz=finance"]:- span "EUR 90,01"- div.informers3__stocks-item-wrapper:- a.home-link2.informers3__stocks-item.home-link2_color_quaternary.home-link2_hover_tertiary[aria-label="YDEX 3998,50" href="https://ya.ru/search/?lr=146&search_source=ya_morda_stocks&text=YDEX&wiz=finance"]:- span "YDEX 3998,50"- a.home-link2.informers3__geo.home-link2_color_quaternary.home-link2_hover_tertiary[aria-label="Ваш город определён как Симферополь" href="https://ya.ru/tune/geo?retpath=https%3A%2F%2Fya.ru%2F%3Fnr%3D1%26redirect_ts%3D1749915681.00000&nosy..."] "Симферополь"- div.main-home-banner:- div[@hidden]:- div.main-home-banner__content.banner-tgo.banner-tgo_title_m:- div.banner-tgo__content:- div.banner-tgo__title "Простой переход на Яндекс Браузер"- div.banner-tgo__subtitle:- div.banner-tgo__domain "yandex.ru"- span.home-link2.banner-tgo__mark "Реклама • 0+"- a.home-link2.banner-tgo__link[aria-label="Простой переход на Яндекс Браузер" href=https://yandex.ru/an/count/WgyejI_zOoVX2Lci0WqL00Eca4kmIQS4p0bKyOO9wCsxD-yN0juA2EWchcZT7ALIUK0NwFEvt...]- div.direct-close-block.direct-close-block_state_idle.direct-close-block_tgo:- button.direct-close-block__close-button.direct-close-block__close-button_idle[aria-label="Действия с рекламой"]:- div.direct-close-block__close-icon:- svg- div.ladybug:- span.home-link2.ladybug__item.ladybug__butterfly#butterfly:- div#butterfly-button:- div:- div.YndxBug.Bug__container1k5BDO.Bug__container_position_left35lf2v:- div.YndxBug-Icon.Bug__icon3lvpsr:- svg[@hidden]- div[@hidden]:- div.page-info[@hidden] "{\"static\":\"2025-06-11-855\",\"content\":\"big\",\"domain\":\"ru\",\"nodeVersion\":\"v22.10.0\"}"- span#requestId[@hidden] "1749915681851623-7074561989186018597-balancer-l7leveler-kubr-yp-vla-119-BAL" -
Бесшовная интеграция с экосистемой Testplane, которая в будущем будет только улучшаться. Например, каждый ответ сервера содержит код, который был запущен, чтобы модель могла встроить его в тесты.
Следите за новыми релизами в нашем блоге и в разделе Release Notes на GitHub, а в случае обнаружения проблем приходите в issue GitHub или наш чат в Telegram — мы вам обязательно поможем!