Playwright MCP

MCP Серверы для фронтендеров

Недавно я писал про Browser Tools MCP, который позволяет получить доступ к некоторым браузерным возможностям прямо из вашего Cursor.

Подобных MCP-тулзов уже очень много, но среди всей этой кучи хочется выделить те, которые больше всего полезны фронтендерам:

Figma Context MCP Берёшь ссылку на макет из Figma и вставляешь прямо в чат в Курсоре. И сразу же в IDE получаешь данные о макете. Помимо того, чтобы верстать что-то с помощью Cursor, данные о макете могут пригодиться ещё и в разработке плагинов для самой Figma или для Pixso)

Playwright MCP Через playwright агент сможет открывать для вас браузер, переходить по ссылкам, жать кнопки и смотреть, что происходит. Есть возможность настройки режимов браузера: headed и headless.

Puppeteer MCP Ещё один инструмент для работы с браузером из Cursor. Тулзы +- те же самые, что и у Playwright, но Puppeteer MCP сложнее настраивается. Видимо, поэтому уже есть Configurable Puppeteer MCP Server))

npm-search MCP Server Для тех, кому лень писать npm search в консоль — можно попросить нейросеть выполнить npm search за вас.

Бонусный контент Если интересно, можете ещё попробовать MCP для GitHub, GitLab, AWS, Atlassian (JIRA и Confluence). А с помощью Superwhisper на MacOS все эти инструменты можно вызывать голосом.

https://github.com/microsoft/playwright-mcp - просто офигенный маст хэв MCP. То есть мы даем агенту браузер и руки посмотреть что он там нанейрослопил. То есть буквально "иди сам посмотри, нифига не работает, сделай чтобы работало". И он сам смотрит разметку, консоль, запросы, в общем magic!

А потом мы ему говорим, "а теперь все что ты исследовал напиши playwright test"