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.
- Debugging workflow z Codex
- Jak formułować prompty debugowe
- MCP + przeglądarka: Codex widzi UI
- Weryfikacja poprawek
- Case study: Save nie zapisuje
Debugging workflow z Codex {#workflow}
Skuteczny debugging z AI wymaga struktury. Nie mów "coś nie działa" — podaj:
| Element | Przykład |
| Reprodukcja | Kliknij Save, poczekaj 3 sekundy, odśwież stronę |
| Oczekiwane | Dane powinny być zapisane w bazie |
| Faktyczne | Dane znikają po odświeżeniu |
| Kontekst | Dzieje się tylko dla użytkowników z rolą admin |
| Logi/błędy | Console pokazuje 403 Forbidden |
Im więcej kontekstu, tym szybciej Codex znajdzie problem.
Jak formułować prompty debugowe {#prompty}
Zły prompt: "Save nie działa, napraw"
Dobry prompt: "Przycisk Save w UserSettings.tsx wywołuje API, ale dane nie zapisują się do bazy. Console pokazuje 403. Sprawdź flow od onClick do endpointu /api/users/update"
Kluczowe elementy promptu debugowego:
- Lokalizacja — wskaż plik/komponent gdzie zaczyna się problem
- Symptom — co widzisz (błąd, brak reakcji, złe dane)
- Ślad — logi, stack trace, kody błędów
- Hipoteza — jeśli masz, powiedz ("myślę że to problem z auth")
Codex przeczyta wskazane pliki, prześledzi flow i znajdzie miejsce gdzie coś idzie nie tak.
MCP + przeglądarka: Codex widzi UI {#mcp-browser}
Dla bugów UI możesz podłączyć Codex do przeglądarki przez MCP:
> użyj playwright do otwarcia /settings i kliknięcia Save
> sprawdź network tab i console
Codex uruchomi przeglądarkę, wykona akcje i zobaczy błędy w real-time. To 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 {#weryfikacja}
Codex nie tylko proponuje fix — może go zweryfikować:
> zastosuj poprawkę i uruchom testy
> jeśli przejdą, pokaż diff
Workflow: Diagnoza → Propozycja → Test → Commit
Codex może przejść przez cały cykl, od znalezienia problemu do zcommitowania poprawki. Ty tylko zatwierdzasz każdy krok (lub włączasz tryb auto dla zaufanych operacji).
Możesz też poprosić o regresję:
> napisz test który by wykrył ten bug przed naprawą
> upewnij się że teraz przechodzi
Case study: Save nie zapisuje {#case-study}
Rzeczywisty debugging session:
Prompt:
Przycisk Save w UserSettings.tsx nie zapisuje zmian.
Steps to reproduce:
1. Zmień nazwę użytkownika
2. Kliknij Save
3. Odśwież stronę — nazwa wraca do starej
Console pokazuje: "PUT /api/users/123 403 Forbidden"
Backend logi: "Missing CSRF token"
Codex odpowiada:
- Sprawdza UserSettings.tsx — znajduje fetch() bez headers
- Sprawdza middleware auth — widzi wymagany CSRF token
- Proponuje: dodaj header
X-CSRF-Tokenz 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.
AI-assisted debugging