AITM nie tylko czyta pliki źródłowe — buduje ustrukturyzowany, przeszukiwalny model tego, co kod faktycznie robi, dzięki czemu AI przestaje zgadywać i zaczyna sprawdzać.

Jak AITM rozumie projekt

Behavioral Contracts

Każdą istotną funkcję w bazie kodu można ująć jako Behavioral Contract: maszynowo czytelną specyfikację z identyfikatorem, modułem, do którego należy, jednozdaniowym opisem zachowania, dokładną listą plików, których dotyczy, ostrzeżeniem o strefie ryzyka (danger zone) i oceną pewności. Contracts są przechowywane dla każdego projektu w lokalnej bazie SQLite, a AI odpytuje je przez GraphQL zanim dotknie choćby jednej linii kodu. To największy pojedynczy powód, dla którego znikają zmyślone ścieżki plików i wymyślone metody — AI sprawdza Contract zamiast zgadywać.

Contracts się także nie starzeją: po każdym scaleniu krok Docs w Pipeline automatycznie ponownie skanuje zmianę i aktualizuje każdy dotknięty nią Contract.

Danger zones

Każdy Contract może zawierać danger zone — ostrzeżenie w prostym języku o zasięgu skutków dotknięcia danego kodu (na przykład „nigdy nie wywoływać tego bez wcześniejszego sprawdzenia flagi skip"). AI czyta danger zones na samym początku, więc wie, czego NIE psuć, zanim zacznie edycję, a nie dopiero po nieudanym teście.

Knowledge graph

Za jednym punktem końcowym GraphQL stoi dziesięć powiązanych źródeł prawdy o projekcie:

• Drzewo zmiennych (kody logiki biznesowej BL.*, kody interfejsu UI.*)
• Behavioral Contracts
• Mapa elementów DOM
• Hint Dictionary
• Indeks dokumentacji
• Mapa kodu — importy/eksporty, silnie sprzężone „god nodes" i społeczności modułów
• Mapa testów — element UI do lokatora Playwright
• Zrzuty ekranu
• Błędy
• Krawędzie między modułami łączące wszystkie powyższe

Jedno zapytanie może pobrać powiązany kontekst ze wszystkich dziesięciu źródeł naraz, zamiast ślepego przeszukiwania całego repozytorium przez AI.

Onboarding projektu

Przy pierwszym imporcie projektu AITM uruchamia deterministyczny statyczny pre-scan, zanim AI cokolwiek dotknie: wykrywanie języka i stosu, pełna mapa kodu, wyodrębnianie DOM przez atrybuty data-aitm, uzupełnianie zmiennych i wskaźniki do dokumentacji. Dopiero potem AITM opcjonalnie uruchamia przebiegi AI — odkrywanie architektury, analizę historii git pod kątem sprzężeń modułów oraz głęboki przebieg dla każdego modułu. Krótko: wystarczy zaimportować repozytorium, a AITM zmapuje je, zanim uruchomi się pierwszy Task.

Mapa DOM + Dev Panel

Rzeczywiste elementy UI w aplikacji są oznaczane atrybutami data-aitm, z których każdy niesie krawędzie efektów typu trigger i triggered-by oraz mapę prostokątów w pikselach pokazującą, gdzie element leży na ekranie. Ta mapa zasila niezawodne, samonaprawiające się selektory testów E2E zamiast kruchych lokatorów CSS.

Co robi Dev Panel

Dev Panel to samodzielny, wstrzykiwany pasek narzędzi JS (aitm-dev-panel.js), który może załadować podczas rozwoju każdy projekt zarządzany przez AITM. Jest to pływający, dokowalny pasek, który nakłada plakietkę na każdy element oznaczony data-aitm w działającej aplikacji: podpowiedź po najechaniu pokazuje kod elementu, tag, akcję i handler, działa licznik zdarzeń na żywo, małe pole chat/brainstorm pozwala wysyłać wiadomości do instancji AITM bezpośrednio z działającej aplikacji, a do tego są kontrolki rozmiaru czcionki i wskaźnik stanu online/offline samego AITM. Panel śledzi rzeczywiste interakcje użytkownika (click/change/input/mount/unmount) na bieżąco i co 2 sekundy przesyła je do AITM — w ten sposób AITM utrzymuje aktualną mapę UI.

Panel ma cztery zakładki: Elements (elementy kliknięte lub przypięte, z kodem zmiennej, Contracts, plikami i ostrzeżeniami danger zone; przyciski Overlay, Pin / One Pin i Clear Pins), Records (zarejestrowane elementy UI), Errors (przechwycone błędy JavaScript i konsoli, które można zamienić w Taski naprawy błędów w AITM) oraz Settings. Pełna dokumentacja otwiera się w AITM z menu nagłówka: Help → AITM Dev Panel.

Jeśli AITM działa na innym komputerze niż ta strona, należy ustawić w konfiguracji AitmServer:PublicBaseUrl (np. http://192.168.1.50:3333) — adres, z którego przeglądarka ładuje aitm-dev-panel.js. Puste oznacza http://<page host>:<Port>. Adres AITM można też później zmienić w zakładce Settings panelu.

Guide & Flow — przepływ logiki biznesowej elementu

Z wiersza elementu w Dev Panel otwiera się jego szczegóły z zakładkami Graph, Guide & Flow i App Flow. Guide & Flow wyjaśnia wybrany element od ogółu do szczegółu prostymi krokami — najpierw sam element UI, a potem Contracts biznesowe opisujące jego zachowanie (każdy ze zmiennymi, których dotyczy). Copy as Markdown kopiuje całe wyjaśnienie do schowka, gotowe do wklejenia w prompt Taska. Więcej w Contract Explorer & App Flow.

Włączanie i wyłączanie dla projektu

To pojedynczy warunkowy znacznik <script> dodawany do wspólnej powłoki HTML projektu, wyświetlany tylko poza Production, z atrybutem data-project="<your-project-id>", dzięki któremu panel automatycznie celuje we właściwy projekt.

Blazor Server (.NET 8+)

W App.razor należy wstrzyknąć IWebHostEnvironment i zabezpieczyć znacznik script przez IsProduction():

@inject IWebHostEnvironment env

@if (!env.IsProduction())
{
    <script src="http://localhost:3333/aitm-dev-panel.js" data-project="your-project-id"></script>
}

ASP.NET Core Razor Pages

Ten sam wzorzec — @inject IWebHostEnvironment env plus ta sama osłona IsProduction() — umieszczony we wspólnym _Layout.cshtml, z tym samym blokiem kodu co powyżej.

Node / Express / TypeScript

Należy zabezpieczyć go przez process.env.NODE_ENV w szablonie renderującym powłokę HTML:

{process.env.NODE_ENV !== 'production' &&
  '<script src="http://localhost:3333/aitm-dev-panel.js" data-project="your-project-id"></script>'}

Aby go wyłączyć, wystarczy usunąć warunkowy znacznik script albo po prostu uruchomić aplikację w Production — osłona automatycznie go ukryje, bez ruszania znacznika.