Kaip ištaisyti DI sukurtą programą: praktinis metodas

Norėdami ištaisyti DI sukurtą programą, pirmiausia klaidą priverskite pasikartoti tyčia, tada surinkite įrodymus — tikslius veiksmus, klaidos pranešimą ir tai, ką rodo naršyklės konsolė bei tinklo skirtukas — ir pateikite DI kaip „Aš padariau X, tikėjausi Y, gavau Z“. Jei pataisymas tik pablogino dalykus, grąžinkite paskutinę veikusią versiją, o ne kraukite pataisymus ant pataisymų. Kad tai gerai padarytumėte, kodo skaityti nereikia.

Šiame vadove aprašomas visas ciklas, įskaitant trumpą naršyklės kūrėjo įrankių apžvalgą nespecialistams.

Derinimo ciklas

Kiekvienas klaidos taisymas, nepriklausomai nuo to, ar jį atlieka žmogus, ar DI, seka tą patį ciklą:

1. Atkurti — priversti klaidą pasikartoti patikimai.
2. Stebėti — surinkti klaidos pranešimą ir tai, ką programa darė.
3. Aprašyti — pateikti DI tikslius žingsnius, numatomą rezultatą ir faktinį rezultatą.
4. Taisyti — leisti DI pakeisti vieną dalyką.
5. Patikrinti — pakartoti tuos pačius veiksmus ir įsitikinti, kad problema išspręsta ir kas nors šalia nesugedo.
6. Grąžinti, jei reikia — jei tapo blogiau, atšaukti ir bandyti iš naujo su geresne informacija.

Daugiausia laiko DI sukurtose programose sugaištama praleidžiant 1, 2 ir 5 žingsnius: sakant „tai sugedo“, priimant pakeitimą nepatikrinus, o paskui prašant dar vieno pataisymo ant sugedusio.

1 žingsnis: atkurkite klaidą

Klaida, kurią galite sukelti pagal pageidavimą, jau pusiau ištaisyta. Stenkitės rasti trumpiausią veiksmų seką, kuri ją sukelia.

Pasiklauskite savęs:

• Ar tai vyksta kiekvieną kartą? Jei tik kartais, kas kitaip, kai taip nutinka — konkretus įrašas, lėtas ryšys, atsijungimas?
• Ar tai vyksta visiems naudotojams? Prisijunkite kaip kita paskyra. Daugelis klaidų pasireiškia tik naujiems naudotojams be duomenų arba naudotojui su kitu vaidmeniu.
• Ar tai vyksta visuose įrenginiuose? Išbandykite telefono pločio ekraną ir kitą naršyklę.
• Ar tai prasidėjo po konkretaus pakeitimo? Jei veikė vakar, paskutiniai pakeitimai yra pagrindiniai įtariamieji.

Užsirašykite žingsnius trumpu sunumeruotu sąrašu. Vėliau įklijuosite jį į užklausą.

2 žingsnis: perskaitykite klaidos pranešimą

Klaidų pranešimai atrodo bauginantys, bet jums reikia tik kelių jų dalių.

Nereikia jo suprasti; reikia nukopijuoti tiksliai. „Cannot read properties of undefined (reading 'name')“ sako DI, kad kodas tikėjosi tam tikrų duomenų (tikriausiai rezervacijos ar naudotojo), kurių nebuvo. Perfrazavimas „kažkokia undefined klaida“ tą informaciją prarastų.

Keletas dažnų, apytiksliai išverstų:

• undefined / null klaidos — kodas tikėjosi duomenų, kurie neatėjo. Dažnai tai įkėlimo būsena ar tuščias sąrašas, kurio kodas netvarkė.
• 404 Not Found — puslapis ar API adresas neegzistuoja. Dažnai tai klaida maršrute ar nuorodoje į puslapį, kuris buvo pervadintas.
• 401 Unauthorized / 403 Forbidden — užklausa buvo neprisijungusi arba naudotojas neturi teisės to daryti.
• 500 Internal Server Error — serverio kodas nulūžo. Tikroji priežastis yra serverio žurnaluose, ne naršyklėje.
• CORS klaidos — naršyklė blokavo užklausą į kitą domeną. Dažniausiai tai serverio konfigūracijos problema.

3 žingsnis: naudokite naršyklės kūrėjo įrankius

Kiekviena darbalaukio naršyklė turi įmontuotus kūrėjo įrankius („devtools“). Jie rodo, ką puslapis daro už kulisų. Chrome, Edge ir Firefox naršyklėse dešiniuoju pelės klavišu spustelėkite bet kur puslapyje ir pasirinkite Inspect (Tikrinti), arba paspauskite F12 (Mac kompiuteryje Cmd+Option+I). Safari naršyklėje pirmiausia įjunkite meniu Develop nustatymuose.

Pakanka trijų skirtukų.

Console (konsolė)

Skirtukas Console rodo puslapio kodo klaidas ir pranešimus. Klaidos rodomos raudonai. Jei mygtukas nieko nedaro, kai jį spustelite, konsolė labai dažnai parodys raudoną klaidą tą akimirką, kai spustelite. Nukopijuokite visą klaidos tekstą (daugumoje naršyklių dešiniuoju pelės klavišu galima pasirinkti kopijavimo parinktį).

Network (tinklas)

Skirtukas Network rodo kiekvieną puslapio užklausą — duomenų įkėlimą, formos išsaugojimą, prisijungimą. Atidarykite jį, tada pakartokite veiksmus, kurie sukelia klaidą.

• Ieškokite eilučių raudonai ar su statusu 400 arba aukštesniu.
• Spustelėkite nesėkmingą eilutę, kad pamatytumėte jos Response (atsakymą). Serverio klaidoje dažnai yra pranešimas, kuris naudingesnis nei viskas ekrane.
• Užsirašykite užklausos URL ir statuso kodą — sakinys „POST į /api/bookings grąžino 500“ yra labai naudingas DI.

Pažymėkite Preserve log (Išsaugoti žurnalą), jei klaida susijusi su puslapio perkrovimu ar nukreipimu, kad užklausos nedingtų.

Elements (elementai)

Skirtukas Elements (arba Inspector) rodo puslapio struktūrą ir stilius. Jis naudingiausias maketo klaidoms: užvedus pelę ant elemento, matote jo dydį ir tarpus paryškintus. Čia nieko redaguoti nereikia; pakanka pasakyti „poraštė mobiliajame yra 2000 pikselių pločio ir stumia puslapį į šoną“.

4 žingsnis: patikrinkite serverio žurnalus

Kai kurios klaidos vyksta serveryje, kurio naršyklė nemato. Klasikinis ženklas — 500 klaida tinklo skirtuke. Serverio žurnalai — tai jūsų backend teksto išvestis jam veikiant — dažniausiai turi tikrąją klaidą su stack trace (funkcijų, kurios veikė tos akimirkos, sąrašą).

Kur jų ieškoti, priklauso nuo įrankio. Daugumoje DI programų kūrimo įrankių galite atidaryti projekto terminalą ar žurnalų vaizdą arba tiesiog paklausti DI: „Patikrink serverio žurnalus, ar nėra klaidų nuo paskutinės užklausos, ir pasakyk, kas nepavyko.“

5 žingsnis: aprašykite klaidą DI

Surinktą informaciją sudėkite į tokią formą:

Puslapyje Bookings, prisijungęs kaip narys: paspaudžiau Cancel rytojaus 9:00 pamokai. Tikėtasi: rezervacija dingsta, o pamokoje atsiranda viena laisva vieta. Faktiškai: ekrane nieko nepasikeičia. Konsolėje matau TypeError: Cannot read properties of undefined (reading 'id') faile BookingCard.tsx:31, o tinklo skirtuke DELETE /api/bookings/123 grąžino 500. Raskite priežastį, ištaisykite ir patikrinkite, ar atšaukimas veikia nariui su viena rezervacija ir su keliomis.

Kodėl svarbi kiekviena dalis:

• Kur ir kaip kas susiaurina problemą iki vieno ekrano ir vieno vaidmens.
• Tikslūs žingsniai leidžia DI atkurti klaidą.
• Numatyta ir faktiška apibrėžia, ką reiškia „ištaisyta“.
• Klaidos tekstas ir nesėkmingas užklausimas nukreipia tiesiai į priežastį.
• „Patikrink, ar…“ prašo DI patikrinti, o ne tik redaguoti.

Jei DI du kartus bandė pataisyti ir nepavyko, paprašykite jo paaiškinti prieš bet kokį keitimą:

Kol kas nekeisk kodo. Ką, tavo manymu, sukelia šią problemą ir kokie įrodymai tai patvirtina?

Klaidingą prielaidą parašytą žodžiais lengva pastebėti, ir ją daug pigiau ištaisyti nei klaidingą pataisymą.

6 žingsnis: patikrinkite ir apžiūrėkite aplinką

Kai DI sako, kad pataisė, pakartokite tiksliai 1 žingsnio veiksmus. Tada patikrinkite aplinkinius dalykus:

• Tą patį veiksmą kitam naudotojo vaidmeniui
• Tą patį veiksmą be duomenų ir su dideliu duomenų kiekiu
• Puslapius, kurie dalijasi komponentais su tuo, kurį taisėte
• Telpo į telefono pločio ekraną, jei pataisymas palietė maketą

DI pakeitimai kartais ištaiso vieną kelią ir tyliai sugadina kitą. Dviejų minučių patikra dabar sutaupo sumišimo valandą vėliau.

7 žingsnis: grąžinkite versiją, o ne kraukite ant viršaus

Jei pataisymas pablogino dalykus arba jau tris kartus pabandėte be pažangos, grįžkite atgal. Grąžinti paskutinę veikusią versiją ir iš naujo suformuluoti užklausą su geresniais įrodymais beveik visada geriau nei prašyti ketvirto pataisymo ant trijų klaidingų. Kiekvienas nepavykęs bandymas palieka kodą, o tas kodas painioja kitą bandymą.

Geri įpročiai, kurie palengvina grąžinimą:

• Testuokite po kiekvieno pakeitimo, kad žinotumėte, kuris pakeitimas sugadino.
• Laikykite pakeitimus mažus — viena funkcija ar pataisymas vienoje žinutėje.
• Prieš rizikingą darbą pažymėkite paskutinę gerą versiją.
• Jei kodas yra Git, įrašykite veikiančias versijas, kad galėtumėte grįžti.

Dažni klaidų modeliai DI sukurtose programose

Kai problema ne klaida

Kai kurios „klaidos“ yra tai, kad DI padarė tiksliai tai, ko buvo paprašyta, o aprašymas buvo dviprasmiškas. Jei prašomas pataisymas iš tikrųjų yra elgsenos pakeitimas, pasakykite tai aiškiai: „Pakeisk taip, kad…“. Jei jūs patys nesate tikri, koks yra teisingas elgesys, pirmiausia nuspręskite tai. Mūsų vadove kaip rašyti užklausas DI programų kūrimo įrankiams aprašoma, kaip aiškiai nurodyti taisykles. O jei ruošiate programą tikriems naudotojams, kaip AI prototipą perkelti į produkciją aprašo patikras prieš paleidimą.

Derinimas Mythex platformoje

Mythex turi įrankius kiekvienam ciklo žingsniui:

• Peržiūra, kad atkurtumėte klaidą, įskaitant telefono dydžio rėmelį.
• /test — agentas paspaudinėja jūsų gyvą peržiūrą kaip naudotojas ir praneša apie sugedusius srautus.
• /fix nukreipia agentą konkrečiai į gedimus.
• Plan (planavimo) režimas leidžia agentui ištirti ir paaiškinti, prieš keisdamas ką nors.
• Code → terminal rodo jūsų programos serverio žurnalus.
• Revert to this point bet kuriame atsakyme grąžina projektą į tą kontrolinį tašką.

Jei publikavimas nepavyksta, publikavimo dialoge dažniausiai siūloma Fix with AI — jis perskaito kūrimo išvestį ar programos žurnalus. Dokumentacijoje žr. Debug your app ir Publish troubleshooting.

Klausimai