Installation af Maestro og kørsel af det første flow
Installér Maestro CLI, skriv en YAML-flowfil, der starter appen og trykker på en knap, kør den mod en kørende simulator, og læs testrapporten.
Installation af Maestro og kørsel af det første flow er en gratis React Native Academy-lektion på CoddyKit. Dette er lektion 1 af 4. Du kan læse alle 3 lektioner i dette læringsspor gratis i deres fulde længde — derefter låser CoddyKit PRO alle lektioner op samt praktiske øvelser med en indbygget kodeeditor og en AI-underviser døgnet rundt. Den er en del af læringsforløbet i React Native Academy, og dine fremskridt synkroniseres på tværs af nettet og CoddyKit-appen. React Native Academy-kurset indeholder 4 lektioner i alt.
Hvad er Maestro?
Maestro er et open source-framework til test af mobile brugergrænseflader fra mobile.dev. Det styrer rigtige iOS-simulatorer og Android-emulatorer ved at simulere faktiske brugerbevægelser — tryk, stryg og indtastning — på den native brugergrænseflade. Fordi det tester den virkelige appbinærfil, finder det fejl, som enheds- og komponenttests ikke opdager, f.eks. forkert navigationsforbindelse eller platformsspecifikke problemer med gengivelsen.
Maestro-tests skrives i enkle YAML-filer, så de er tilgængelige for udviklere, der ikke er eksperter i testframeworks. Hver YAML-fil beskriver et flow: en række kommandoer, som Maestro CLI udfører mod en kørende app.
Installation af Maestro CLI
Installer Maestro via et shellscript på macOS og Linux. Det downloader CLI-binærfilen og føjer den til din PATH. På Windows kører Maestro i WSL2 med en Android-emulator. Bekræft installationen ved at køre maestro --version.
Maestro kræver Java 11 eller nyere på macOS (til den underliggende testrunner). Hvis du ikke har Java, foreslår Maestros installationsprogram at installere det via Homebrew. Test af iOS kræver Xcode og appen Simulator — standardkrav ved al iOS-udvikling.
# Install Maestro (macOS / Linux)
curl -Ls 'https://get.maestro.mobile.dev' | bash
# Reload your shell profile
source ~/.zshrc # or ~/.bashrc
# Verify installation
maestro --version
# Expected: Maestro CLI v1.x.x
# Optional: install the Maestro Studio (visual test recorder)
maestro studioSkriv din første flow-fil
Et Maestro-flow er en YAML-fil. appId på øverste niveau angiver, hvilken app der skal testes — brug bundle-id'et til iOS (f.eks. com.example.myapp) eller pakkenavnet til Android. Separatoren --- starter kommandolisten.
Start med kommandoen launchApp for at åbne appen fra en frisk tilstand. Tilføj derefter påstande og handlinger. Det enkleste første flow åbner appen og bekræfter, at velkomstskærmen vises.
# maestro/flows/welcome.yaml
appId: com.example.myapp
---
- launchApp
- assertVisible:
text: 'Welcome to MyApp'
- tapOn:
text: 'Get Started'
- assertVisible:
text: 'Sign In'Kørsel af et flow
Kør et Maestro-flow med maestro test path/to/flow.yaml. Sørg for, at en simulator eller emulator kører, og at appen er installeret på den, før du udfører kommandoen. Maestro opretter automatisk forbindelse til den kørende simulator — du behøver ikke vælge en enhed, når der kun er én.
Maestro udskriver hver kommando, efterhånden som den udføres. Ved succes vises et grønt flueben for hvert trin. Ved fejl vises den fejlslagne kommando, et skærmbillede af brugerfladen på fejlstedet og en fejlmeddelelse. Skærmbilledet er uvurderligt, når du skal fejlfinde, hvorfor en påstand mislykkedes.
# Run a single flow file
maestro test maestro/flows/welcome.yaml
# Run all flows in a directory
maestro test maestro/flows/
# Run with verbose output
maestro test --format junit maestro/flows/login.yaml
# Generate an HTML test report
maestro test --format html --output test-results.html maestro/flows/Kommandoen tapOn
Kommandoen tapOn simulerer et tryk med en finger. Du kan trykke ud fra tekst (den synlige etiket), ud fra id (elementets testID) eller på et procentbaseret punkt på skærmen. Det er mest læsbart og robust over for layoutændringer at trykke ud fra tekst.
Hvis flere elementer har den samme tekst, kan du tilføje et index for at angive hvilket der skal bruges (indekseret fra 0). Brug optional: true for at gøre trykket betinget — det springes over uden fejl, hvis elementet ikke findes. Det er nyttigt til at lukke valgfrie dialogbokse med tilladelser.
# Tap by visible text
- tapOn:
text: 'Next'
# Tap by testID
- tapOn:
id: 'submit-button'
# Tap by position (50% from left, 90% from top)
- tapOn:
point: '50%,90%'
# Tap second element with the same text
- tapOn:
text: 'Delete'
index: 1
# Optional tap (skips if not found)
- tapOn:
text: 'Allow'
optional: trueKommandoen inputText
Brug inputText til at skrive tekst i det inputfelt, der har fokus. Tryk først på TextInput for at give det fokus, og brug derefter inputText til at skrive. Maestro skriver hele strengen på én gang i stedet for tegn for tegn.
Hvis et felt først skal tømmes for eksisterende tekst, skal du bruge clearText før inputText. Brug hideKeyboard efter indtastningen for at skjule softwaretastaturet, som kan dække andre elementer, du skal interagere med.
# Type email address into the focused input
- tapOn:
id: 'email-input'
- inputText: 'user@example.com'
# Clear and retype
- tapOn:
id: 'search-input'
- clearText
- inputText: 'react native'
# Dismiss keyboard
- hideKeyboard
# Tap the search button after keyboard is hidden
- tapOn:
text: 'Search'Se testrapporten
Maestro genererer testresultater i flere formater: almindelig tekst i terminalen, JUnit XML (til CI-systemer som GitHub Actions) eller en interaktiv HTML-rapport. HTML-rapporten indeholder skærmbilleder for hvert trin, så du nemt visuelt kan gennemgå, hvad der skete på hvert tidspunkt i flowet.
Når en test mislykkes, gemmer Maestro et skærmbillede af skærmen på fejløjeblikket. Se efter fejlskærmbilledet i outputtet for at forstå, hvorfor en påstand mislykkedes — ofte viser skærmen en indlæsningsindikator i stedet for det forventede indhold, hvilket afslører et timingproblem.
# Run all tests and save a JUnit XML report
maestro test \
--format junit \
--output results/test-results.xml \
maestro/flows/
# The XML report contains:
# - Test suite name
# - Each test case with pass/fail status
# - Failure messages with screenshot paths
# - Total durationForstå rækkefølgen af flowets udførelse
Kommandoerne i et Maestro-flow udføres sekventielt. Maestro venter automatisk på, at hver kommando bliver færdig, før den går videre til den næste. Tryk venter på, at elementet bliver synligt og stabilt, før der interageres med det, og påstande gentages, indtil elementet vises (med en konfigurerbar timeout).
Standard-timeoutværdien for assertVisible er 5 sekunder. Hvis din app er længere tid om at indlæse en skærm (f.eks. fordi den henter data fra en langsom API), kan du øge timeoutværdien med indstillingen timeout eller tilføje kommandoen waitForAnimationToEnd.
# Increase timeout for a slow-loading screen
- assertVisible:
text: 'Your Dashboard'
timeout: 10000 # 10 seconds instead of default 5
# Wait for animations to finish before asserting
- waitForAnimationToEnd
- assertVisible:
text: 'Profile Loaded'
# Scroll down before asserting an element below the fold
- scroll:
direction: DOWN
- assertVisible:
text: 'Footer'Start appen fra en frisk tilstand med clearState
Som standard bringer launchApp appen i forgrunden, hvis den allerede kører (varm start). Til test, der skal begynde med en ren tilstand — ingen bruger er logget ind, og databasedata i cachen er tomme — skal du bruge clearState: true til at slette alle appdata, før appen startes.
Det svarer til at afinstallere og geninstallere appen. Brug det i dine vigtigste testflows for at sikre, at de starter fra et forudsigeligt udgangspunkt og ikke afhænger af data, som tidligere flows har efterladt.
# maestro/flows/fresh-login.yaml
appId: com.example.myapp
---
# Clear ALL app data (like a fresh install)
- launchApp:
clearState: true
- assertVisible:
text: 'Welcome to MyApp' # Onboarding screen appears
- tapOn:
text: 'Sign In'
- tapOn:
id: 'email-input'
- inputText: 'test@example.com'
- tapOn:
id: 'password-input'
- inputText: 'testpassword'
- tapOn:
text: 'Sign In'
- assertVisible:
text: 'Home'Organiser flows med underflows
Ved gentagne trin som login før hver test kan du udtrække trinnene til en underflow-YAML-fil og referere til den med runFlow. Det holder hvert testflow fokuseret på sit specifikke scenarie og gør loginopsætningen til et genanvendeligt trin på én linje.
Underflows fungerer som funktionskald i kode — de udføres på stedet som en del af det overordnede flow. Du kan sende parametre til underflows ved hjælp af sektionen env, så de kan genbruges med forskellige data (forskellige brugere eller inputværdier).
# maestro/flows/subflows/login.yaml
appId: com.example.myapp
---
- tapOn:
id: 'email-input'
- inputText: '${EMAIL}'
- tapOn:
id: 'password-input'
- inputText: '${PASSWORD}'
- tapOn:
text: 'Sign In'
- assertVisible:
text: 'Home'
# maestro/flows/profile.yaml
appId: com.example.myapp
env:
EMAIL: user@test.com
PASSWORD: testpass
---
- launchApp:
clearState: true
- runFlow: subflows/login.yaml
- tapOn:
text: 'Profile'
- assertVisible:
text: 'Edit Profile'Maestro Studio til visuel optagelse
Maestro Studio er en interaktiv webbaseret brugerflade, der viser din simulators skærm direkte og lader dig optage flows ved at klikke på elementer. Kør maestro studio, så åbner der en browser, hvor du kan klikke for automatisk at generere YAML-kommandoer.
Det er den hurtigste måde at oprette dine første flows på — optag den forventede brugerrejse interaktivt, og gennemgå og rediger derefter den genererede YAML for at tilføje påstande og håndtere særlige tilfælde. Studio viser også elementtræet for hver skærm, så du lettere kan finde det bedste testID eller den bedste tekst at målrette.
# Start Maestro Studio
maestro studio
# Opens browser at http://localhost:9999
# - Left panel: live simulator view
# - Click any element to generate a tapOn command
# - Type in input fields to generate inputText commands
# - Right panel: generated YAML that you can copyHurtigt tjek
Test din forståelse af begreberne inden for React Native Mobile Development fra denne lektion.
Opsummering af lektionen
I denne lektion har du lært: hvordan du installerer Maestro og skriver en YAML-flow-fil, der starter appen og kontrollerer synligt indhold, hvordan du bruger tapOn, inputText og assertVisible til at styre brugerinteraktioner i flows og hvordan du bruger underflows til at dele gentagne trin som login på tværs af flere testflows. Næste emne er at skrive mere avancerede Maestro-påstande og håndtere dynamiske tilstande i brugerfladen.
Lær JavaScript med en AI-underviser — gratis
Skriv og kør rigtig kode i din browser, få øjeblikkelig hjælp fra en AI-underviser døgnet rundt, og fortsæt, hvor du slap, på web eller i appen.
- Kurser
- 30
- Lektioner
- 120
Ofte stillede spørgsmål
Er lektionen “Installation af Maestro og kørsel af det første flow” gratis?
Ja — alle 3 lektioner i læringssporet React Native Academy, inklusive “Installation af Maestro og kørsel af det første flow”, kan læses gratis i deres fulde længde her på webstedet. Derefter låser CoddyKit PRO alle lektioner op samt interaktive øvelser med en indbygget kodeeditor og en AI-underviser døgnet rundt. React Native Academy-kurset indeholder 4 lektioner i alt.
Hvad lærer jeg i “Installation af Maestro og kørsel af det første flow”?
Installér Maestro CLI, skriv en YAML-flowfil, der starter appen og trykker på en knap, kør den mod en kørende simulator, og læs testrapporten. Du øver dig i React Native Academy med praktisk kode, som du kører direkte i browseren, og en AI-vejleder døgnet rundt besvarer dine spørgsmål, mens du arbejder dig gennem lektionen.
Skal jeg have erfaring for at begynde på React Native Academy?
Der kræves ingen tidligere erfaring. React Native Academy på CoddyKit er tilrettelagt for både begyndere og øvede, så du kan starte her eller fra begyndelsen og lære i dit eget tempo. Dette er lektion 1 af 4.
Hvor lang tid tager lektionen “Installation af Maestro og kørsel af det første flow”?
De fleste CoddyKit-lektioner tager cirka 5–10 minutter. Hver lektion er kort og interaktiv, så du gør løbende fremskridt og kan fortsætte, hvor du slap – på både web og app.
Kan jeg skrive og køre kode i denne React Native Academy-lektion?
Ja. Alle React Native Academy-lektioner har en indbygget kodeeditor, så du kan skrive og køre rigtig kode direkte i din browser og få øjeblikkelig feedback fra AI – uden lokal opsætning.
Alle lektioner i dette kursus
- Installation af Maestro og kørsel af det første flow
- Assertions og ventning på elementer
- Test af brugerrejser på flere skærme
- Maestro i CI med GitHub Actions