Testa på mobil
Använd den responsiva viewportväxlaren i builder för en snabb kontroll, publicera sedan och testa på en riktig enhet för allt som rör mobilspecifikt beteende.
Det finns två nivåer av mobiltestning i Proyecta: den inbyggda responsiva förhandsgranskningen i builder, och testning på en riktig enhet via en publicerad URL.
Responsiv förhandsgranskning i builder
Section titled “Responsiv förhandsgranskning i builder”Förhandsgranskningspanelen innehåller en viewportväxlare i adressfältet:
| Läge | Dimensioner |
|---|---|
| Desktop | Full fönsterbredd |
| Tablet | 768 × 1024 |
| Mobile | 375 × 667 |
Växla mellan dem medan du redigerar för att upptäcka layoutproblem tidigt. Det här är det snabbaste sättet att fånga uppenbara responsiva buggar (overflow, trasiga grid, knappar som är svåra att trycka på).
Testa på en riktig enhet
Section titled “Testa på en riktig enhet”Viewportväxlaren simulerar bara dimensioner — den simulerar inte touch-input, verklig nätverksfördröjning, mobilwebbläsarens egenheter eller plattformsspecifikt beteende. För allt du verkligen bryr dig om (touch-interaktioner, installationspromptar, push-notiser, kamera, GPS) bör du testa på en riktig enhet:
- Publicera din app till dess
*.proyecta.live-subdomän - Öppna URL:en i telefonens webbläsare
- Om du har lagt till PWA-stöd, välj Add to Home Screen och testa den installerade upplevelsen
- Gå igenom de flöden du bryr dig om
Saker du bara kan upptäcka på en riktig enhet
Section titled “Saker du bara kan upptäcka på en riktig enhet”- Storlek på tryckytor — fingrar är större än muspekare
- Klibbiga element — viewport-enheter beter sig annorlunda med mobilwebbläsarens chrome
- Formulärinmatning — autofyll, tangentbordstyper, autocompletions
- iOS Safari-egenheter —
100vh-problem, scroll-studsning, fast positionering - Flödet för push-notisbehörighet — fungerar bara på ett publicerat ursprung via HTTPS i en webbläsarflik på toppnivå; det aktiveras inte inuti builder:ns förhandsgranskningspanel (även när förhandsgranskningen redan serveras över HTTPS).
- Prestanda på riktig (långsammare) hårdvara
Testtips
Section titled “Testtips”- Använd telefonens utvecklarverktyg. Safari på macOS kan ansluta till mobil Safari för live-felsökning; Chrome kan ansluta till Android Chrome.
- Testa i liggande läge också. De flesta utvecklare testar bara stående läge och missar buggar i liggande.
- Testa med energisparläge aktiverat. Animationer och timers beter sig annorlunda.
- Testa på en riktig iPhone för PWA-push. Push-notiser på iOS fungerar bara från en PWA installerad via Safari.