terminal Для разработчиков

Воспроизводите любой
баг за минуты

Никаких «у меня не воспроизводится». Broux показывает точно что делал пользователь, какие запросы уходили, что упало в консоли — и всё это привязано к конкретному моменту сессии.

app.broux.ru/sessions/s_9f2a · 1:24
МК
Мария К. · #s_9f2a
Pro · iPhone 15 · Safari 17 · /checkout/payment
TypeError
Payment failed — попробуйте ещё раз
Оплатить
3× rage click
Таймлайн · 0:00 → 1:24 ▶ 1:18
Клики Network 2xx Slow Error
1:14.2 › click button.btn-pay
1:14.3 POST /api/v3/checkout 200
1:14.9 POST /api/v3/payment/init 2.1s
1:17.1 › click button.btn-pay
1:17.2 POST /api/v3/payment/charge 500
1:17.3 ✕ TypeError: Cannot read properties of undefined (reading 'token')
at handleCharge (checkout.tsx:142)
at onSubmit (PayForm.tsx:58)
1:17.5 › rage click ×3 button.btn-pay
1:18.0 › console.warn "Retry payment"
link Сейчас на таймлайне · 1:18

Вы узнаёте себя?

Каждый разработчик сталкивается с этим

?

Ошибка есть — контекста нет

В логах TypeError на строке 847. Отлично. Но что делал пользователь за 30 секунд до этого? Какой запрос уходил? Какое состояние приложения было в этот момент? Без этого починить невозможно — только угадывать.

Тикет без деталей — переписка на три дня

Поддержка написала «кнопка не работает». Вы попросили уточнить. Они уточнили — всё равно непонятно. Попросили скриншот. Прислали не то. Прошло три дня, баг не починен, пользователь злится, команда тоже.

«У меня не воспроизводится»

Локально всё работает. На стейдже всё работает. В продакшене у конкретного пользователя на Firefox 115 с MacOS падает. Вы потратили день на воспроизведение — и так и не смогли.

Как это работает

Три сценария которые экономят часы каждую неделю

01 · Отладка

Открываете сессию —
видите всё

Каждая сессия в Broux — это полная картина: запись действий пользователя, логи консоли, Network-запросы с кодами ответов, stack trace, браузер, устройство, ОС. Всё на одном таймлайне с временными метками. Открываете момент ошибки — видите что происходило за 10 секунд до и после. Не нужно ничего воспроизводить — всё уже записано.

Среднее время от «получил тикет» до «понял причину» сокращается с часов до минут

session · 1:14 → 1:24
paused at 1:17.3
Console
click btn-pay
log "init checkout"
warn slow response
✕ TypeError
› rage ×3
Network
/checkout200
/cart200
/payment2.1s
/charge500
/retry
Stack
handleCharge
checkout.tsx:142
PayForm.tsx:58
App.tsx:21
1:17.3
Bug PAY-318 Payment 500 on Safari
IN PROGRESS
QA
Анна Q. 14:32

Поймала на проде. Ниже ссылка на точный момент:

link
broux.ru/s/9f2a?t=1:17
Сессия Марии К. · момент 1:17 · TypeError
open_in_new
Браузер
Safari 17 · iOS 17.4
Ошибка
TypeError @ 142
Запрос
POST /charge · 500
Затронуто
142 пользователя
DV
Дмитрий В. 14:38 · через 6 минут

Воспроизвёл по записи. handleCharge не проверяет наличие token при ретрае. Фиксю.

02 · Получил тикет

Тикет с ссылкой на сессию —
всё что нужно

Когда QA или поддержка нашли баг — они отправляют вам ссылку на конкретный момент сессии. Вы открываете и сразу видите: что делал пользователь, какая ошибка упала, какой запрос вернул 500, на каком браузере воспроизводится. Никаких уточняющих вопросов, никакой переписки — сразу к исправлению.

Ссылка ведёт на точный момент — не на начало сессии, а на секунду когда случился баг

03 · После деплоя

Задеплоили — проверьте
что ничего не сломалось

После каждого деплоя Broux показывает новые ошибки которые появились за последние несколько часов. Тренды ошибок, количество затронутых пользователей, первое и последнее вхождение. Вы сразу видите регрессию — до того как об этом напишет поддержка или пользователи.

Подключите уведомления в Telegram — новая ошибка после деплоя придёт мгновенно

Ошибки

schedule Последние 2 часа
после деплоя v2.41
notifications_active Telegram: on
New TypeError: Cannot read 'token'
checkout.tsx:142 · /checkout/payment
142 польз. +142 за 2ч
New Failed to fetch /api/v3/charge
api.ts:88 · POST · 500
38 польз. +38 за 2ч
Open ResizeObserver loop limit exceeded
layout.tsx:24 · global
7 польз. −12% за неделю
2 новых · 1 существующая Все ошибки →

Сделано для разработчиков

code

Лёгкий скрипт — никакого влияния на производительность

Асинхронная загрузка, минимальный вес, не блокирует рендеринг. Работает с любым стеком — React, Vue, Angular, Next.js, Nuxt, vanilla JS.

terminal

Полные логи консоли и Network

Все console.log, console.error, console.warn. Все XHR и Fetch запросы с URL, методом, кодом ответа и телом. Синхронизированы с записью сессии по таймлайну.

webhook

API и Webhook для интеграции

Подключайте к вашему стеку — получайте события об ошибках в свою систему, создавайте тикеты автоматически, стройте свои дашборды на основе данных Broux.

data_object

Кастомные события из кода

Одна строка кода — и событие появляется на таймлайне сессии. Отмечайте важные моменты: смену состояния, критичные действия, бизнес-события.

checkout.ts
// Отметьте бизнес-событие на таймлайне сессии
Broux.track('checkout_started', {
  cart_total: 2490,
  items: 3,
  currency: 'RUB'
});

Узнаёте эти ситуации?

Когда в логах есть ошибка но непонятно что к ней привело — я хочу увидеть что делал пользователь до этого, чтобы понять реальную причину а не симптомы

Senior Frontend Developer
SaaS

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

Full-stack Developer
e-commerce

Когда я работаю над исправлением — я хочу сразу видеть контекст и влияние проблемы, чтобы быстрее внести и проверить фикс

Tech Lead
финтех-стартап

Составлено на основе интервью с разработчиками

Всё что нужно разработчику — в одном инструменте

Следующий баг вы почините за минуты

Установите скрипт — и первая сессия с полными логами появится сразу. Никакой настройки, никаких агентов, никакой инфраструктуры.

Бесплатно до 1 000 сессий · Без карты · Работает с любым стеком