feedthrough/feedthrough

feedthrough/feedthrough

от feedthrough
Feedthrough - MCP сервер для отладки веб-приложений через AI. Внедряет мост в страницу, предоставляя инструменты для чтения DOM, консоли, сети и управления интерфейсом. Полезен разработчикам, которые хотят исследовать и управлять приложением в реальном времени через AI-агента.

Feedthrough

Debug with AI — from inside your app.

Feedthrough injects a lightweight debug bridge into any running web page, then exposes everything — DOM state, console logs, network requests, and user interactions — as MCP tools. Any MCP-compatible AI agent can inspect and drive the page conversationally, in real time.

Browser (any)
 └── @feedthrough/core          ← injected into your page
      ├── console interceptor
      ├── fetch / XHR interceptor
      └── DOM inspector
      ↕  WebSocket
@feedthrough/mcp               ← MCP server, exposes tools over stdio
 └── Tools: click, fill, inspect_element, query_dom,
            get_console_logs, get_network_requests, …
      ↕  MCP protocol
Claude Code / Cursor / any MCP client

The name

Many physics and chemistry experiments run inside a sealed vacuum chamber, with all the air pumped out so nothing contaminates the experiment. The catch: you still need to control instruments inside the chamber and read their measurements, and the smallest air leak ruins the run. A feedthrough is the part that solves this — a specially engineered connector that carries electrical signals through the chamber wall while keeping the vacuum perfectly intact. You can't reach inside, but the feedthrough lets you observe and control what's happening in there anyway.

Инструменты были проиндексированы:
click

Кликает по элементу, вызывая его собственный метод click(), который генерирует событие click и выполняет действие по умолчанию: переход по ссылке, переключение чекбокса или радиокнопки, отправка формы. Предпочитайте селектор по id (#submit-btn) для надёжного наведения на цель. Учтите: этот метод НЕ синтезирует предшествующую последовательность pointer/mouse (pointerdown / mousedown / mouseup) и не перемещает фокус, поэтому обработчик, привязанный именно к этим событиям, а не к click, не сработает; для активации с клавиатуры используйте press_key. Поведение: если селектор ничего не нашёл, вызов возвращает ошибку; метод не прокручивает элемент в область видимости и не ждёт завершения навигации, сетевых запросов или перерисовки — возвращает управление сразу после отправки клика. Наблюдайте эффект с помощью последующего вызова get_console_logs / get_network_requests / query_dom. Возвращает тег и id элемента, по которому кликнули.

Параметры
  • selectorstringобязательный

    CSS-селектор для элемента, который нужно кликнуть, например '#submit-btn' или 'button[type=submit]'. Если совпадает несколько элементов, кликается первый в порядке документа.

connection_status

Проверяет, подключён ли браузер с мостом Feedthrough. Возвращает флаг подключения, список открытых вкладок (id, url, какая активна) и блок 'server', идентифицирующий этот мост: его имя, версию и порт, который он фактически занял. Этот порт важен: если сервер другого сеанса агента уже занял порт по умолчанию 8765, этот мост сдвинулся вверх, и страница не найдёт его, пока dev-сервер приложения не будет запущен с FEEDTHROUGH_PORT, установленным в указанный порт. Когда страница подключена, но ведёт себя так, будто ею управляет кто-то другой, сравните это имя с полем 'server' из get_page_info: разные имена означают, что вкладка сопряжена с мостом другого сеанса. Вызывайте этот инструмент первым: каждый инструмент, кроме get_instructions, требует подключённого браузера.

Параметры

Без параметров.

fill

Устанавливает значение элемента input, textarea или select. Фокусирует элемент, присваивает значение через нативный сеттер значения элемента (поэтому контролируемые поля React/Vue регистрируют изменение), затем запускает всплывающие события input и change. Значение устанавливается за один раз, не посимвольно — поэтому обработчики на каждое нажатие клавиши (keydown / keypress / keyup / beforeinput) НЕ срабатывают; чтобы отправить Enter для отправки формы или срабатывания горячей клавиши, используйте press_key. Предпочтительно использовать селектор id (#search-input). Если селектор ничего не находит, вызов возвращает ошибку; возвращает результат сразу после отправки событий, не дожидаясь последующей валидации или повторного рендеринга. Возвращает тег и установленное значение.

Параметры
  • selectorstringобязательный

    CSS-селектор для input, textarea или select, который нужно заполнить, например '#email' или 'input[name=q]'.

  • valuestringобязательный

    Полное значение для установки. Оно заменяет текущее содержимое поля (не добавляется); для <select> передайте значение атрибута value нужного варианта.

get_console_logs

Возвращает вывод консоли, захваченный с момента подключения моста. Охватывает все методы консоли — log/warn/error/info/debug, а также dir, table, assert, trace, count, countReset, time/timeEnd/timeLog, group/groupCollapsed/groupEnd и clear. Каждая запись содержит поле 'level' (наиболее близкий из пяти стандартных уровней); для расширенных методов также добавляется поле 'method', а для console.trace() и неудачных console.assert() — поле 'stack'. Необработанные исключения и отклонённые промисы тоже захватываются (уровень 'error', метод 'uncaught' / 'unhandledrejection'), даже если приложение их не логировало. Когда приложение шумит из-за фреймворков или предупреждений об устаревании, передайте levels: ['error'] (или ['error', 'warn']), чтобы настоящие ошибки не затерялись, и используйте 'match' для фильтрации по содержимому. Передайте 'since' (метка времени в мс из поля 'ts' предыдущей записи или Date.now() перед действием), чтобы увидеть только то, что произошло после этого момента. Только для чтения: возвращает пассивно собранный буфер и не очищает консоль и не изменяет страницу. Всегда проверяйте это на раннем этапе - ошибки приложения и отладочный вывод часто сразу указывают на первопричину.

Параметры
  • levelsenum[]

    Ограничьте этими уровнями, например ['error'], чтобы пропустить шумные warn/info/debug, или ['error', 'warn'] для обоих. Опустите для всех уровней.

  • limitinteger

    Ограничивает результат N самыми последними записями, например 50. Если параметр опущен, возвращает все записи, захваченные с момента подключения моста.

  • matchstring

    Фильтр по подстроке без учёта регистра в сериализованном содержимом сообщения.

  • sincenumber

    Только записи с ts >= этого значения (мс от начала эпохи). Ограничивает область до «что произошло после того, как я сделал X».

get_html

Возвращает outerHTML элемента (ограничение 50 КБ). Используйте, когда обобщённого вывода query_dom недостаточно и нужно увидеть фактическую разметку/структуру области. Только для чтения: он только читает DOM и не вносит изменений, а также возвращает ошибку, если селектор ничего не находит.

Параметры
  • selectorstringобязательный

    CSS-селектор для области, которую нужно выгрузить, например '#app' или '.modal'. Если совпадает несколько элементов, используется первый в порядке документа. Строго ограничьте область: outerHTML ограничен 50 КБ.

get_instructions

Возвращает руководство по использованию Feedthrough в виде текстового документа Markdown с разделами: рекомендуемый рабочий процесс, советы по порядку применения инструментов и рекомендации по выбору. Только для чтения, не принимает аргументов; не изменяет страницу и не требует подключённого браузера. Вызывайте его в начале сеанса отладки, если вы не знакомы с Feedthrough или хотите быстро освежить знания.

Параметры

Без параметров.

get_network_requests

Возвращает все перехваченные fetch и XHR запросы с момента подключения bridge, включая URL, метод, HTTP статус, длительность, заголовки запроса и ответа, а также тела запроса и ответа (тела ограничены 10 КБ каждое: всё, что длиннее, обрезается с пометкой; бинарные ответы сводятся). Используйте это, чтобы найти неудачные запросы (4xx/5xx), неправильные URL, медленные вызовы или проверить, что приложение на самом деле отправило или получило. Используйте 'filter', чтобы сузить поиск по URL/методу, и 'since' (временная метка в мс), чтобы увидеть только запросы, отправленные после какого-либо действия. Только для чтения: возвращает пассивно перехваченный лог и не создаёт и не изменяет никакие запросы.

Параметры
  • filterstring

    Фильтрует по подстроке URL или HTTP-методу, например 'api' или 'POST'

  • sincenumber

    Только запросы с ts >= this (мс от начала эпохи). Ограничивает выборку запросами, сработавшими после действия X.

get_page_info

Возвращает базовый контекст страницы: текущий URL, заголовок документа, readyState, размер viewport, позицию прокрутки, user agent и блок 'server', в котором указано, к какому мосту Feedthrough подключена эта страница (имя, порт, версия: null для моста версии ниже 0.4). Только чтение и без побочных эффектов: инструмент лишь считывает состояние страницы и ничего не меняет. Полезен для ориентации в начале сессии или для подтверждения, что переход на страницу произошёл. Если на этой машине запущено несколько сессий агента, сверь 'server.name' с connection_status: расхождение означает, что эта вкладка общается с сервером другой сессии, и ты управляешь не тем приложением.

Параметры

Без параметров.

hover

Наводит курсор на элемент, отправляя синтетические всплывающие события mouseover и mouseenter изнутри страницы. Это запускает обработчики наведения JavaScript (onMouseEnter / onMouseOver), поэтому UI, который появляется только при наведении (тултипы, поповеры, выпадающие списки и подменю), появляется в DOM; затем используйте query_dom, get_html или inspect_element, чтобы прочитать, что открылось. Нужно знать три ограничения: это НЕ активирует CSS-псевдокласс :hover (он управляется реальным курсором, а не синтетическими событиями), так что стили или контент, показанные исключительно через :hover в CSS, не изменятся; mouseout / mouseleave не отправляются, поэтому состояние наведения сохраняется, пока приложение его не сбросит или вы не взаимодействуете в другом месте; и события отправляются независимо от того, виден ли элемент или находится ли он в области просмотра (прокрутка не выполняется), поэтому успешный вызов сам по себе не подтверждает, что что-то отрендерилось. Если селектор ничего не находит, вызов возвращает ошибку. Возвращает тег элемента, на который навели курсор.

Параметры
  • selectorstringобязательный

    CSS-селектор элемента, на который нужно навести курсор, например '#menu-trigger' или '.tooltip-anchor'. Выбирайте элемент, которому принадлежит обработчик наведения (часто это триггер, а не всплывающее окно).

inspect_element

Возвращает полные сведения об одном элементе: тег, id, классы, все атрибуты, текстовое содержимое, ограничивающий прямоугольник (top/right/bottom/left/width/height + прокрутка страницы и флаг inViewport), компактный путь предков (например, 'body > main > div#app > button.cta'), подобранный набор вычисленных стилей (layout, box model, typography, positioning, flex/grid), блок 'overflow', когда содержимое обрезается/переполняется (scroll vs client size + флаги по осям x/y), блок 'clipped', когда предок обрезает элемент своим overflow (обрезающий предок + какие края), проверку эффективной видимости (булево 'visible' с 'hiddenReason', например 'ancestor div#modal display:none' или 'opacity:0', если не виден, с учётом предков), проверку перекрытия (булево 'hittable' от hit-теста в центре, с 'occludedBy', указывающим элемент, который реально сверху, если что-то его закрывает), блок 'a11y' (определённая роль, доступное имя по возможности, ключевые состояния: expanded/checked/selected/disabled/hidden/tabindex), блок 'pseudo' с содержимым ::before/::after, если задано (иконки шрифтов, сгенерированный текст), и, если применимо, состояние живых форм (текущее значение input, checked, disabled и т.д.). Передайте 'properties', чтобы дополнительно прочитать любые конкретные вычисленные CSS-свойства по имени, они вернутся в 'requested'. Используйте это, чтобы понять, почему элемент выглядит неправильно или ведёт себя не так, как ожидается. Только для чтения: он только читает состояние элемента и никогда не изменяет страницу, и возвращает ошибку, если селектор ничего не находит. Примечание: обработчики событий, зарегистрированные через addEventListener, невозможно прочитать со страницы; видны только встроенные атрибуты-обработчики on* (в 'attributes').

Параметры
  • propertiesstring[]

    Дополнительные вычисленные CSS-свойства, которые читаются по имени (kebab-case), например ['transform', 'z-index', 'margin-top']. Они возвращаются в объекте 'requested' в дополнение к стандартному набору.

  • selectorstringобязательный

    CSS-селектор, который должен указывать на один элемент, например '#submit-btn' или 'main .card:first-child'. Если совпадает несколько элементов, проверяется первый в порядке документа.

press_key

Отправляет нажатие клавиши (keydown/keypress/keyup) на элементе - например, Enter для отправки поиска, Escape для закрытия модального окна, Tab для перемещения фокуса или ArrowUp/ArrowDown в списке. Используйте именованные клавиши (Enter, Escape, Tab, Backspace, Delete, ArrowUp/Down/Left/Right) или один символ. Примечание: это вызывает обработчики клавиш, но НЕ вставляет текст в поля ввода - используйте 'fill' для установки значения поля, затем press_key для отправки/шортката. Если селектор ничего не находит, вызов возвращает ошибку; он отправляет события клавиш и возвращается, не дожидаясь навигации или перерендера.

Параметры
  • keystringобязательный

    Именованная клавиша или один символ. Именованные клавиши: Enter, Escape, Tab, Backspace, Delete, ArrowUp, ArrowDown, ArrowLeft, ArrowRight (регистрозависимые, как значение 'key' в DOM KeyboardEvent). Любой другой одиночный символ (например, 'a', '/') отправляется как этот символ.

  • selectorstringобязательный

    CSS-селектор для элемента, получающего нажатие клавиши, например '#search-input'. Ориентируйтесь на сфокусированный или фокусируемый элемент: Enter на сфокусированном поле ввода отправляет его форму, Escape на открытом диалоге закрывает его, Tab перемещает фокус на следующий элемент.

query_dom

Запрашивает страницу по CSS-селектору и возвращает сводку по каждому совпавшему элементу (тег, id, классы, текстовое содержимое). Пригодится для подсчёта пунктов списка, проверки того, что реально отрендерено, или для поиска правильного селектора перед вызовом inspect_element или click. Только чтение: инструмент лишь читает DOM и никогда не изменяет страницу. Возвращает пустой список (не ошибку), если ничего не совпало, так что это ещё и безопасная проверка существования.

Параметры
  • selectorstringобязательный

    CSS-селектор, применяемый ко всему документу, например '.todo-item', '#search-input' или 'nav a'. Возвращает все совпадения, поэтому также работает как проверка количества или существования.

reset_overrides

Отменить все изменения set_style / set_attribute / set_text, которые мост применил с момента подключения, и восстановить исходные значения. По мере возможности: элементы, которые фреймворк пересоздал позже, могут не откатиться (перезагрузка страницы всегда полностью сбрасывает всё).

Параметры

Без параметров.

set_attribute

Устанавливает или удаляет атрибут у элемента для предпросмотра изменений (включить/отключить disabled, заменить класс, задать aria-* атрибут). Передайте value=null, чтобы удалить атрибут. Только предпросмотр в реальном времени. Не сохраняется в исходный код, сбрасывается при перезагрузке. Если атрибут управляется фреймворком (class, value, checked, disabled и т.д.), результат включает 'frameworkWarning' о том, что он может быть отменён при следующем рендере. Передайте это предупреждение. Сбросьте с помощью reset_overrides.

Параметры
  • namestringобязательный

    Имя атрибута, который нужно установить или удалить, например 'disabled', 'class', 'aria-expanded', 'hidden' или атрибут 'data-*'.

  • selectorstringобязательный

    CSS-селектор для целевого элемента, например '#menu' или 'button.cta'. Если совпадает несколько элементов, используется первый в порядке их следования в документе.

  • valuestring | nullобязательный

    Новое значение в виде строки или null, чтобы полностью удалить атрибут. Для булевых атрибутов, таких как 'disabled' или 'hidden', любая не-null строка (даже '') устанавливает их; используйте null для снятия.

set_style

Устанавливает одно или несколько инлайн CSS-свойств на элементе для ПРЕДВАРИТЕЛЬНОГО просмотра визуального изменения в реальном времени (например, уменьшить непомещающуюся подпись, подогнать padding или ширину). Это изменяет только текущий DOM — изменения НЕ сохраняются в исходном коде и сбрасываются при перезагрузке — так что скажите пользователю, что это предпросмотр, и как только его всё устроит, внесите реальное изменение в CSS/исходник компонента. Инлайн стили переопределяют таблицу стилей и обычно переживают повторные рендеры. Результат содержит 'примечание' для передачи; сбросить — через reset_overrides.

Параметры
  • propertiesobjectобязательный

    Карта CSS-свойств и их значений, применяемая как встроенные стили. Имена свойств задаются в kebab-case, значения передаются как полные CSS-строки, например { 'font-size': '13px', 'white-space': 'nowrap' }. Передайте пустую строку в качестве значения, чтобы очистить одно встроенное свойство.

  • selectorstringобязательный

    CSS-селектор для элемента, который нужно переоформить, например '#banner' или '.cta'. Если под него подходят несколько элементов, используется первый в порядке документа.

set_text

Заменяет текстовое содержимое элемента для предпросмотра изменений формулировок/меток. Только живой предпросмотр — не сохраняется в исходном коде, сбрасывается при перезагрузке. textContent почти всегда управляется фреймворком, поэтому результат включает 'frameworkWarning' о том, что React/Vue и т.д., вероятно, перезапишет его при следующем рендере — передайте это предупреждение и сохраняйте реальные изменения в исходном коде. Сброс выполняется с помощью reset_overrides.

Параметры
  • selectorstringобязательный

    CSS-селектор элемента для переименования, например '#title' или '.cta-label'. Если совпадений несколько, используется первый в порядке документа.

  • textstringобязательный

    Заменяющий текст вставляется как обычный текст (не разбирается как HTML). Заменяет всё существующее дочернее содержимое элемента.

0.4.0основная
0.3.2
0.3.1
0.3.0
0.2.0
0.1.0

Выберите клиент, чтобы установить feedthrough/feedthrough:

Любой клиент

Конфиг добавления MCP сервера стандартный, обычно он не меняется вообще, поэтому подходит практически к любому ИИ клиенту, поддерживающему MCP.

{
  "mcpServers": {
    "feedthrough-feedthrough-jtab2mqo1v": {
      "command": "npx",
      "args": [
        "@feedthrough/mcp"
      ]
    }
  }
}
CursorCursor

Перейдите по ссылке и сервер автоматически будет добавлен в Cursor. Либо откройте/создайте файл ~/.cursor/mcp.json(%USERPROFILE%\.cursor\mcp.json на Windows) и добавьте конфиг сервера:

{
  "mcpServers": {
    "feedthrough-feedthrough-jtab2mqo1v": {
      "command": "npx",
      "args": [
        "@feedthrough/mcp"
      ]
    }
  }
}
VS Code

Создайте .vscode/mcp.json в проекте (ключ верхнего уровня — servers):

{
  "servers": {
    "feedthrough-feedthrough-jtab2mqo1v": {
      "type": "stdio",
      "command": "npx",
      "args": [
        "@feedthrough/mcp"
      ]
    }
  }
}

Либо добавьте сервер через терминал:

code --add-mcp "{\"name\":\"feedthrough-feedthrough-jtab2mqo1v\",\"type\":\"stdio\",\"command\":\"npx\",\"args\":[\"@feedthrough/mcp\"]}"
ClaudeClaude Desktop

Откройте Settings → Developer → Edit Config — это откроет файл claude_desktop_config.json:

  • macOS: ~/Library/Application Support/Claude/claude_desktop_config.json
  • Windows: %APPDATA%\Claude\claude_desktop_config.json

Впишите сервер и полностью перезапустите Claude Desktop:

{
  "mcpServers": {
    "feedthrough-feedthrough-jtab2mqo1v": {
      "command": "npx",
      "args": [
        "@feedthrough/mcp"
      ]
    }
  }
}
Claude CodeClaude Code

Добавьте сервер одной командой в терминале:

claude mcp add feedthrough-feedthrough-jtab2mqo1v -- npx @feedthrough/mcp

Либо через JSON-конфиг:

claude mcp add-json feedthrough-feedthrough-jtab2mqo1v "{\"command\":\"npx\",\"args\":[\"@feedthrough/mcp\"]}"
CodexCodex

Добавьте сервер командой в терминале:

codex mcp add feedthrough-feedthrough-jtab2mqo1v -- npx @feedthrough/mcp

Либо вручную в ~/.codex/config.toml(%USERPROFILE%\.codex\config.toml на Windows):

[mcp_servers.feedthrough-feedthrough-jtab2mqo1v]
command = "npx"
args = ["@feedthrough/mcp"]
PerplexityPerplexity

MCP доступен подписчикам Perplexity Pro / Max / Enterprise. Локальные серверы — только в приложении для macOS.

  1. Откройте Настройки аккаунта → Connectors.
  2. Установите вспомогательное приложение PerplexityXPC (один раз).
  3. Нажмите Add Connector → вкладка Simple.
  4. В поле Server Name укажите feedthrough/feedthrough, а в поле команды запуска — строку ниже:
npx @feedthrough/mcp

Нажмите Save и дождитесь статуса Running.

WindsurfWindsurf

Откройте Windsurf Settings → Cascade → MCP Servers или отредактируйте файл ~/.codeium/windsurf/mcp_config.json:

{
  "mcpServers": {
    "feedthrough-feedthrough-jtab2mqo1v": {
      "command": "npx",
      "args": [
        "@feedthrough/mcp"
      ]
    }
  }
}
ClineCline

В панели Cline нажмите иконку MCP Servers → Configure → Configure MCP Servers (или отредактируйте ~/.cline/mcp.json) и добавьте сервер:

{
  "mcpServers": {
    "feedthrough-feedthrough-jtab2mqo1v": {
      "command": "npx",
      "args": [
        "@feedthrough/mcp"
      ],
      "disabled": false,
      "autoApprove": []
    }
  }
}
Continue

Создайте файл в .continue/mcpServers/ (например feedthrough-feedthrough-jtab2mqo1v.yaml) или добавьте блок в config.yaml. MCP работает только в режиме agent:

mcpServers:
  - name: feedthrough-feedthrough-jtab2mqo1v
    command: npx
    args:
      - "@feedthrough/mcp"
Zed

Выполните agent: add context server или откройте настройки (zed: open settings file) и добавьте сервер в объект context_servers:

{
  "context_servers": {
    "feedthrough-feedthrough-jtab2mqo1v": {
      "command": "npx",
      "args": [
        "@feedthrough/mcp"
      ]
    }
  }
}

Похожие MCP-сервера

kimtth/mcp-aoai-web-browsing

kimtth/mcp-aoai-web-browsing

от kimtth

Сервер MCP для браузерной автоматизации через Playwright, интегрированный с Azure OpenAI и OpenAI. Преобразует инструменты MCP в вызовы функций OpenAI, позволяя AI-агентам управлять веб-страницами....

Python⭐ 35
ndthanhdev/mcp-browser-kit

ndthanhdev/mcp-browser-kit

от ndthanhdev

MCP Browser Kit — сервер, который позволяет AI-ассистентам напрямую управлять локальными браузерами. Полезен для автоматизации действий на страницах, сбора данных и тестирования. Разработчики и тес...

TypeScript⭐ 55
mcpware/ui-annotator-mcp

mcpware/ui-annotator-mcp

от mcpware

MCP сервер, который через обратный прокси добавляет на любую веб-страницу визуальные подписи ко всем элементам. Наведите курсор – увидите имя, селектор и размеры. Теперь вы и AI говорите на одном я...

JavaScript⭐ 21
eyalzh/browser-control-mcp

eyalzh/browser-control-mcp

от eyalzh

MCP сервер для Firefox в паре с расширением дает AI управлять вкладками, историей и чтением страниц. Требует согласия на чтение - безопаснее web automation. Идеально для организации работы в браузере.

TypeScript⭐ 335
site-shot/site-shot-mcp

site-shot/site-shot-mcp

от site-shot

MCP-сервер для создания скриншотов веб-страниц через Site-Shot с реальным рендерингом Chromium. Поддерживает полностраничный захват, автоматическое удаление рекламы и cookie-баннеров. Работает с Cl...

JavaScript⭐ 3
apireno/DOMShell

apireno/DOMShell

от apireno

DOMShell превращает браузер в виртуальную файловую систему: AI-агенты и разработчики управляют веб-страницами через Linux-команды (ls, cd, cat, click). Упрощает автоматизацию, тестирование и веб-ск...

TypeScript⭐ 58
© Каталог MCP, 2026. Все права защищены.
Проект не аффилирован с Anthropic и любыми упомянутыми продуктами.
Все названия и торговые марки принадлежат их владельцам.
Контакты для связи: hi@mcp-katalog.ru

Лука Никитин