Створення розширень Трейсі
Tracy – чудовий інструмент для налагодження вашої програми. Однак іноді вам потрібно більше інформації, ніж пропонує Tracy. Ви дізнаєтеся про:
- Створення власних панелей Tracy Bar
- Створення власних розширень Bluescreen
Ви можете знайти корисні розширення для Tracy на Componette.
Розширення для бару Tracy
Створити нове розширення для Tracy Bar дуже просто. Вам необхідно
реалізувати інтерфейс Tracy\IBarPanel
з методами getTab()
і
getPanel()
. Ці методи повинні повертати HTML-код вкладки (невеликий
ярлик на панелі Tracy Bar) і панелі (спливаюче вікно, що відображається
після клацання на вкладці). Якщо getPanel()
не повертає нічого, буде
відображатися тільки вкладка. Якщо getTab()
нічого не повертає, то
нічого не відображається і getPanel()
не буде викликано.
class ExamplePanel implements Tracy\IBarPanel
{
public function getTab()
{
return /* ... */;
}
public function getPanel()
{
return /* ... */;
}
}
Реєстрація
Реєстрація здійснюється за телефоном Tracy\Bar::addPanel()
:
Tracy\Debugger::getBar()->addPanel(new ExamplePanel);
або ви можете просто зареєструвати свою панель у конфігурації програми:
tracy:
bar:
- ExamplePanel
HTML-код вкладки
Має виглядати приблизно так:
<span title="Explaining tooltip">
<svg>...</svg>
<span class="tracy-label">Title</span>
</span>
Зображення має бути у форматі SVG. Якщо вам не потрібна спливаюча
підказка, ви можете залишити <span>
виключити.
HTML код панелі
Має виглядати приблизно так:
<h1>Title</h1>
<div class="tracy-inner">
<div class="tracy-inner-container">
... content ...
</div>
</div>
Заголовок має бути або таким самим, як на вкладці, або містити додаткову інформацію.
Одне розширення може бути зареєстровано кілька разів, тому
рекомендується не використовувати атрибут id
для стилізації. Ви
можете використовувати класи, переважно в
tracy-addons-<class-name>[-<optional>]
форматі. При створенні CSS краще
використовувати #tracy-debug .class
, оскільки таке правило має вищий
пріоритет, ніж reset.
Стилі за замовчуванням
На панелі елементи <a>
, <table>
, <pre>
,
<code>
мають стилі за замовчуванням. Для створення посилання
для приховування або відображення іншого елемента з'єднайте їх
атрибутами href
і id
і класом tracy-toggle
.
<a href="#tracy-addons-className-{$counter}" class="tracy-toggle">Detail</a>
<div id="tracy-addons-className-{$counter}">...</div>
Якщо стан за замовчуванням – згорнутий, додайте клас tracy-collapsed
до обох елементів.
Використовуйте статичний лічильник для запобігання дублювання ідентифікаторів на одній сторінці.
Розширення для синього екрана
Ви можете додати свої власні візуалізації винятків або панелі, які відображатимуться на блюскрині.
Розширення робиться таким чином:
Tracy\Debugger::getBlueScreen()->addPanel(function (?Throwable $e) { // перехоплене виключення
return [
'tab' => '...Title...',
'panel' => '...content...',
];
});
Функція викликається двічі, спочатку сам виняток передається в
параметрі $e
, а панель, що повертається, виводиться на початку
сторінки. Якщо нічого не повертається, то панель не відтворюється.
Потім вона викликається з параметром null
, і панель, що
повертається, рендериться нижче стека викликів. Якщо функція повертає
'bottom' => true
у масиві, то панель відтворюється в самому низу.