Sparround

Debugging texnikaları: trace viewer, UI mode, inspector

Playwright-ın ən güclü tərəfi debugging alətləridir. Middle səviyyədə gözlənti: console.log ilə deyil, alətlə araşdırmaq.

Trace viewer (npx playwright show-trace trace.zip) — testin "qara qutusu". İçində:

  • Addım-addım timeline; hər addımın müddəti
  • Hər addım üçün DOM snapshot — geri qayıdıb səhifəni həmin andakı vəziyyətdə həqiqətən yoxlaya bilirsən (elementlərə hover, DOM-a baxış)
  • Network sekmesi — bütün sorğular, statuslar, body-lər
  • Console log-lar, source kod, action-un locator-u

Ən böyük dəyəri: CI-da sınan, lokalda təkrarlanmayan fail-i araşdırmaq. Trace artefakt kimi yüklənir, sən onu öz maşınında açırsan və faktiki vəziyyəti görürsən — təxmin etmirsən.

UI mode (npx playwright test --ui) — gündəlik iş üçün ən rahat rejim: testləri seç, işlət, watch rejimində saxla; hər addımda time-travel; locator-u canlı seçmə (pick locator); filtr və annotasiyalar. Test yazarkən default rejim kimi istifadə et.

Digər alətlər və nə vaxt lazım olduqları:

  • Inspector (--debug və ya PWDEBUG=1) — testi addım-addım icra edir, brauzeri açıq saxlayır, locator-ları canlı yoxlamağa imkan verir. page.pause() çağırışı testi məhz istədiyin nöqtədə dayandırır — uzun axının ortasını araşdırmaq üçün ideal.
  • VS Code extension (Playwright Test for VSCode) — testi redaktordan işlətmək, breakpoint qoymaq, "Pick locator" və "Record new test" düymələri. Praktikada ən sürətli iş axını: breakpoint + Debug Test.
  • `--headed` — brauzeri gözlə görmək; --workers=1 ilə birlikdə istifadə et, yoxsa 4 pəncərə açılır.
  • `--repeat-each=20`--retries=0 — flaky düzəlişini SÜBUT etmək üçün. "Düzəltdim" demək azdır; 20 dəfə keçdiyini göstərmək arqumentdir.
  • `--last-failed` — yalnız sonuncu run-da sınanları təkrar işlədir; böyük suite-də vaxt qazandırır.
  • `--trace on` — lokalda trace-i məcburi yazdırır (default on-first-retry yalnız retry-da yazır).

CI konfiqurasiyası üçün qızıl dəst: trace: 'on-first-retry', screenshot: 'only-on-failure', video: 'retain-on-failure' — normal run-da artefakt yığılmır, fail olanda hər şey əldədir.

Simptomİlk alətNə axtarırsan
CI-da sınır, lokalda keçirTrace viewer (CI artefaktı)Fail anındakı DOM snapshot-u, network statusları, timing
Locator elementi tapmırUI mode / Inspector "Pick locator"Elementin real role/name-i, iframe içində olub-olmaması
Uzun axının ortasında problempage.pause() + --debugHəmin anda səhifənin canlı vəziyyəti
Test bəzən keçir, bəzən sınır--repeat-each=20 --retries=0Təkrarlanma faizi; düzəlişin həqiqətən işlədiyinin sübutu
Test gözləniləndən çox uzun çəkirTrace viewer timelineHansı addım vaxtı yeyir — adətən gizli gözləmə və ya yavaş sorğu

İnterview-da bu sual demək olar ki, həmişə gəlir: "Test CI-da sınır, lokalda keçir — nə edirsən?" Cavabına "birinci addım: CI artefaktından trace-i yükləyib açıram" ilə başla. Bu bir cümlə səni dərhal "alətləri bilən" kateqoriyasına salır; təxminlərlə ("yəqin timing-dir") başlayan cavab isə zəif görünür. Təxminlər ikinci addımda, trace-də gördüklərinlə birlikdə gəlməlidir.

📚 Mənbələr və sənədlər