Appium Inspector Tutorial – Partea 1

Appium Inspector este următorul set de articole din seria noastră Appium Tutorial. Aceasta este o serie de 4-5 articole care v-ar ajuta să învățați procesul de identificare a elementelor din aplicația dvs. mobilă. Să începem acest lucru prin a înțelege ce este de fapt procesul de inspecție Appium.

Ce este procesul de inspecție Appium?

În cuvinte foarte simple, inspecția Appium este procesul cu ajutorul căruia puteți identifica sau găsi elemente în aplicația dvs. mobilă. Dacă doriți să automatizați orice scenariu în aplicația dvs. mobilă, atunci ar trebui să urmați acești 2 pași –

• Pasul 1: Identificați elementul în mod unic
• Pasul 2: Efectuați o acțiune asupra elementului identificat

Procesul de inspecție Appium vă ajută să rezolvați primul pas menționat mai sus. De exemplu, să presupunem că aveți o aplicație cu un ecran de autentificare. Acum sarcina dvs. este de a introduce numele de utilizator și parola în acest ecran. Aici, procesul de inspecție Appium v-ar ajuta să „inspectați” ecranul și apoi vă va permite să identificați în mod unic câmpurile de text. În acest fel, veți putea scrie codul care introduce id-ul de logare și parola în câmpurile corecte.

Să aruncăm acum o privire la instrumentele pe care le puteți utiliza pentru a inspecta aceste elemente.

Diferiți inspectori Appium care vă ajută să identificați elementele din aplicația mobilă

Există multe instrumente diferite care vă ajută să inspectați elementele din aplicațiile mobile. Dar, pentru seria noastră de tutoriale Appium, vom aborda cele mai populare și mai utilizate instrumente (și acceptate de Android sau Appium). Aceste instrumente sunt: –

• UIAutomatorViewer: Acesta este un instrument furnizat de Android Studio care vă permite să inspectați elementele din aplicația dvs. mobilă
• Appium Desktop Inspector: Cea mai recentă versiune a Appium GUI (Appium Desktop) vine cu un inspector. Puteți utiliza acest inspector atât pentru aplicațiile Android, cât și pentru cele iOS (pentru aplicațiile iOS, veți avea nevoie de un Mac)

În acest articol, vom începe cu elementele de bază ale UIAutomatorViewer. Următoarele câteva articole din această serie vor acoperi în detaliu, diferitele moduri prin care puteți inspecta aplicația dvs. mobilă folosind atât UIAutomatorViewer, cât și Appium Desktop Inspector.

Cum se deschide UIAutomatorViewer

UIAutomatorViewer vine cu pachetul de instalare Android Studio. Deci, atunci când instalați Android Studio, UIAutomatorViewer va fi instalat automat împreună cu acesta. Există 2 moduri în care puteți deschide UIAutomatorViewer. Puteți urma oricare dintre aceste metode pentru a-l deschide –

Nota importantă: Asigurați-vă că ați urmat ghidul nostru Appium Tutorial și că ați instalat cea mai recentă versiune de Android Studio și că ați configurat corect variabilele de mediu Android.

Metoda 1: Deschideți UIAutomatorViewer din Command Prompt Acesta este cel mai simplu mod de a deschide UIAutomatorViewer. Urmați doar pașii de mai jos pentru a-l deschide –

Etapa 1.1: Deschideți promptul de comandă

Pasul 1.2: Tastați uiautomatorviewer și apoi apăsați Enter

Așteptați câteva secunde. Fereastra UIAutomatorViewer se va deschide așa cum se arată mai jos

Metoda 2: Deschideți UIAutomatorViewer din locația folderului său UIAutomatorViewer este instalat pe mașina dvs. ca un fișier .bat. Folosind această metodă, veți naviga la locația folderului în care este instalat și apoi îl veți deschide. Urmați pașii indicați mai jos pentru a utiliza această metodă –

Pasul 2.1: Deschideți locația folderului în care este instalat UIAutomatorViewer. În general, această locație este – C:\Users\Anish\AppData\Local\Android\sdk\tools\bin (Înlocuiți „Anish” cu numele de utilizator pe care îl aveți pe mașina dvs.)

Etapa 2.2.: Încearcă să deschizi folderul: Verificați dacă acest dosar bin conține uiautomatorviewer

Etapa 2.3: Faceți dublu clic pe uiautomatorviewer. Acesta va deschide fereastra UI Automator Viewer în câteva secunde

După cum am menționat mai sus, puteți folosi oricare dintre aceste metode pentru a deschide UI Automator Viewer.

Conectați telefonul mobil la mașină prin USB

Înainte de a începe să inspectați elementele aplicației mobile, trebuie mai întâi să conectați dispozitivul mobil la mașină prin USB. Urmați pașii de mai jos pentru a face acest lucru –

Pasul 1: Conectați telefonul mobil la mașina dvs. prin USB

Pasul 2: Pentru a vă asigura că telefonul este conectat corect, deschideți promptul de comandă și rulați comanda adb devices.

Când executați această comandă, se va afișa ID-ul dispozitivului telefonului mobil. Acest lucru înseamnă că telefonul mobil este conectat în mod corespunzător la mașina dumneavoastră.

Etapa 3: Acum va trebui să deschideți aplicația pe care doriți să o inspectați. Ca și în cazul articolelor anterioare din seria Appium Tutorial, și în acest caz vom folosi ca exemplu aplicația Google Play Store. Așadar, deschideți aplicația Play Store pe telefon

Inspectați aplicația mobilă folosind UI Automator Viewer

Să urmați pașii de mai jos pentru a inspecta aplicația mobilă cu UI Automator Viewer –

Pasul 1: Asigurați-vă că telefonul dvs. mobil este conectat corect cu USB. De asemenea, asigurați-vă că este deblocat și că aplicația Play Store este deschisă

Pasul 2: Acum faceți clic pe pictograma Device Screenshot din UI Automator Viewer (aceasta este cea de-a doua pictogramă, așa cum se arată în imaginea de mai jos)

Nota: Ați fi observat că există și alte pictograme lângă pictograma Device Screenshot pe care tocmai ați făcut clic. În acest articol, nu vom explica funcționalitatea acestor pictograme. Le vom aborda în articolele noastre viitoare despre Appium Inspector.

Pasul 3: Veți vedea un mesaj pop-up care afișează informațiile privind progresul, așa cum se arată mai jos

Pasul 4: Așteptați câteva secunde pentru ca UI Automator Viewer să proceseze toate informațiile de pe ecran. Odată ce acest lucru este făcut, UI AUtomator Viewer va încărca captura de ecran a telefonului dvs. așa cum se arată în imaginea de mai jos

Pasul 5: Acum, plimbați indicatorul mouse-ului oriunde pe captura de ecran a dispozitivului. Veți vedea că unele informații se afișează pe panourile din partea dreaptă

Să înțelegem ce se întâmplă aici

Să ne oprim acum pentru un moment și să încercăm să înțelegem ce s-a întâmplat aici. Atunci când faceți clic pe pictograma Device Screenshot, atunci UI Automator Viewer face următoarele trei lucruri –

• În primul rând, captează detaliile tuturor obiectelor vizibile pe ecran în format XML.
• Apoi capturează captura de ecran a ecranului mobil în format PNG
• După ce detaliile de mai sus sunt capturate, UI Automator Viewer afișează ambele lucruri în UI

Nota importantă: Din punct de vedere tehnic, UI Automator Viewer doar capturează ecranul mobilului dvs. Așadar, orice este afișat pe dispozitiv, UI Automator Viewer ar captura acel lucru. Fie că este vorba de orice aplicație, fie că este vorba de ecranul de pornire sau chiar de ecranul de blocare.

3 secțiuni principale în UI Automator Viewer

Din imaginea de mai jos, puteți vedea că UI Automator Viewer are 3 secțiuni principale –

1. Panoul din partea stângă: Acest panou afișează captura de ecran a dispozitivului. Aceasta este o imagine interactivă, în care puteți face clic sau trece indicatorul mouse-ului peste orice element de pe captura de ecran.

2. Right Side Top Pane (Fereastra superioară din partea dreaptă): Acest panou arată întreaga structură XML a ecranului. Această structură XML arată detalii foarte de bază despre fiecare control – numele controlului, textul său (dacă este disponibil și coordonatele sale.

3. Right Side Bottom Pane (Fereastra inferioară din partea dreaptă): Acesta este un panou important care arată toate detaliile unui control. Indiferent de elementul pe care îl selectați din captura de ecran, acest panou va afișa toate detaliile sale, cum ar fi textul său, numele clasei, numele pachetului etc. Acesta este panoul din care veți obține informații despre cum să identificați un element în mod unic.

Până acum, am vorbit despre elementele de bază ale UI Automator Viewer, despre cum se deschide și despre cum puteți încărca captura de ecran a aplicației mobile în el. Vom opri acest articol aici și vom aborda partea rămasă în următorul articol. Există mai multe moduri în care puteți identifica un element cu Appium. Vom discuta despre toate acestea și multe altele în următoarele noastre articole despre Appium Inspector.

Try it Yourself Activity: Într-una dintre secțiunile de mai sus, am menționat că trebuie să vă conectați dispozitivul mobil la computer cu ajutorul unui cablu USB. Știați că puteți face acest lucru și în modul wireless? Consultați acest articol care arată cum puteți rula scripturile de testare Appium prin WiFi. Folosind acest articol ca referință, încercați să vă conectați dispozitivul mobil prin WiFi și apoi vedeți dacă puteți inspecta vreun element.

Nu ezitați să ne contactați dacă v-ați confruntat cu probleme cu oricare dintre secțiunile de mai sus sau dacă aveți orice feedback pentru noi. Ne-ar plăcea să auzim feedback-ul dumneavoastră, deoarece ne ajută să ne îmbunătățim articolele și să le facem mai utile pentru toți cititorii noștri.

Următorul set de articole despre Appium Inspector

• Învățați cum să inspectați elementele folosind UIAutomatorViewer
• Învățați mai multe despre UI Automator Viewer, inclusiv unele limitări ale automatizării mobile
• Învățați despre elementele de bază ale Appium Desktop Inspector
• Inspectați elementele mobile folosind Appium Desktop Inspector

.