Debugowanie z OpenAI Codex: AI naprawia błędy

Bug w produkcji, deadline za godzinę, a ty nie wiesz nawet gdzie szukać. Codex może przejść przez kod, zidentyfikować problem i zaproponować fix — często szybciej niż ty sam.

Kluczem jest dać Codexowi właściwy kontekst. Im więcej informacji, tym szybciej trafi w sedno.

1. Debugging workflow z Codex
2. Jak formułować prompty debugowe
3. Debugowanie różnych typów błędów
4. Zaawansowane techniki
5. MCP: Sentry i przeglądarka
6. Weryfikacja poprawek
7. Case study: Save nie zapisuje

Debugging workflow z Codex

Skuteczny debugging z AI wymaga struktury. Nie mów "coś nie działa" — podaj:

Im więcej kontekstu, tym szybciej Codex znajdzie problem. Różnica między "napraw buga" a dobrze opisanym zgłoszeniem to 30 sekund vs 10 minut.

Jak formułować prompty debugowe

Kluczowe elementy promptu debugowego:

1. Lokalizacja — wskaż plik/komponent gdzie zaczyna się problem
2. Symptom — co widzisz (błąd, brak reakcji, złe dane)
3. Ślad — logi, stack trace, kody błędów
4. Hipoteza — jeśli masz, powiedz ("myślę że to problem z auth")

Template:

Bug w [komponent/plik].

Reprodukcja:
1. [krok 1]
2. [krok 2]
3. [krok 3]

Oczekiwane: [co powinno się stać]
Faktyczne: [co się dzieje]

Logi/błędy:
[wklej błąd]

Podejrzewam: [twoja hipoteza, opcjonalne]

Debugowanie różnych typów błędów

Async/await bugs:

Komponent UserList czasem pokazuje pustą listę mimo że API zwraca dane.
Podejrzewam race condition między fetch a render.
Sprawdź useEffect w UserList.tsx i jak handluje response.

State management bugs:

Po kliknięciu 'Add to cart' licznik w headerze nie aktualizuje się.
Dopiero po refresh strony pokazuje prawidłową wartość.
Sprawdź jak CartContext propaguje zmiany do Header.tsx.

Zaawansowane techniki

Binary search przez historię (git bisect):

Bug pojawił się w ostatnim tygodniu. Użyj git bisect żeby znaleźć
który commit wprowadził problem. Test: npm run test:e2e -- --grep "save"

Codex uruchomi git bisect, będzie testował commity i znajdzie winowajcę.

Porównanie działającej wersji:

Na branchu main funkcja działa poprawnie.
Porównaj implementację saveUser() między main a feature/new-auth.
Co się zmieniło?

Analiza stack trace:

Stack trace:
Error: SQLITE_CONSTRAINT: UNIQUE constraint failed
    at Database.run (database.js:42)
    at UserService.create (user-service.js:15)
    at UserController.register (user-controller.js:28)

Przejdź przez ten stack i znajdź gdzie powinna być walidacja unikalności.

MCP: Sentry i przeglądarka

Sentry MCP — debugowanie produkcyjnych błędów:

# ~/.codex/config.toml
[mcp_servers.sentry]
command = "npx"
args = ["-y", "@sentry/mcp"]

[mcp_servers.sentry.env]
SENTRY_AUTH_TOKEN = "sntrys_xxx"

Teraz możesz:

> pobierz ostatnie 5 błędów z Sentry dla projektu frontend
> przeanalizuj najczęstszy i zaproponuj fix

Codex zobaczy stack traces, breadcrumbs i kontekst z produkcji — bez ręcznego przeklejania.

Playwright MCP — debugowanie UI:

> użyj playwright do otwarcia /settings
> kliknij Save i sprawdź network tab
> pokaż mi request/response dla /api/users

Codex uruchomi przeglądarkę, wykona akcje i zobaczy błędy w real-time. Szczególnie przydatne dla:

• Bugów występujących tylko w określonych warunkach
• Problemów z timingiem (race conditions w UI)
• Błędów widocznych tylko w konsoli przeglądarki

Weryfikacja poprawek

Codex nie tylko proponuje fix — może go zweryfikować:

> zastosuj poprawkę i uruchom testy
> jeśli przejdą, pokaż diff do review

Regression test:

> napisz test który wykryłby ten bug przed naprawą
> upewnij się że teraz przechodzi
> dodaj go do test suite

To zapewnia że bug nie wróci w przyszłości.

Case study: Save nie zapisuje

Rzeczywisty debugging session:

Prompt:

Przycisk Save w UserSettings.tsx nie zapisuje zmian.

Reprodukcja:
1. Zmień nazwę użytkownika
2. Kliknij Save
3. Odśwież stronę — nazwa wraca do starej

Console: "PUT /api/users/123 403 Forbidden"
Backend logi: "Missing CSRF token"

Codex odpowiada:

1. Sprawdza UserSettings.tsx — znajduje fetch() bez headers
2. Sprawdza middleware auth — widzi wymagany CSRF token
3. Proponuje: dodaj header X-CSRF-Token z wartością z cookie

Fix:

// Przed
fetch(`/api/users/${id}`, { method: "PUT", body: data })

// Po
fetch(`/api/users/${id}`, {
  method: "PUT",
  body: data,
  headers: { "X-CSRF-Token": getCsrfToken() }
})

Od zgłoszenia do działającego fixa — 3 minuty.

Więcej o praktycznych workflow w artykule o debug, refactor i testy.