मोबाइल पर टेस्ट करें
त्वरित जांच के लिए builder में responsive viewport switcher का उपयोग करें, फिर mobile-only behavior से जुड़ी किसी भी चीज़ के लिए publish करें और किसी real device पर टेस्ट करें।
Proyecta में मोबाइल टेस्टिंग के दो स्तर हैं: in-builder responsive preview, और published URL पर real-device testing।
Builder में Responsive Preview
Section titled “Builder में Responsive Preview”Preview panel में address bar पर एक viewport switcher शामिल है:
| Mode | Dimensions |
|---|---|
| Desktop | Full window width |
| Tablet | 768 × 1024 |
| Mobile | 375 × 667 |
layout की समस्याओं को जल्दी पकड़ने के लिए editing करते समय इनके बीच switch करें। यह obvious responsive bugs (overflow, broken grids, untappable buttons) को पकड़ने का सबसे तेज़ तरीका है।
Real Device पर टेस्ट करें
Section titled “Real Device पर टेस्ट करें”Viewport switcher केवल dimensions simulate करता है — यह touch input, real-world latency, mobile browser quirks, या platform-specific behavior simulate नहीं करता। जो चीज़ें वास्तव में मायने रखती हैं (touch interactions, install prompts, push notifications, camera, GPS), उनके लिए किसी real device पर टेस्ट करें:
- अपने
*.proyecta.livesubdomain पर अपना app Publish करें - अपने फ़ोन के browser पर URL खोलें
- अगर आपने PWA support जोड़ी है, तो Add to Home Screen चुनें और installed experience को टेस्ट करें
- जो flows आपके लिए ज़रूरी हैं, उन्हें पूरा करके देखें
वो चीज़ें जो केवल Real Device पर पकड़ी जा सकती हैं
Section titled “वो चीज़ें जो केवल Real Device पर पकड़ी जा सकती हैं”- Tap target sizes — उंगलियां mouse pointers से बड़ी होती हैं
- Sticky elements — mobile browser chrome के साथ viewport units अलग तरह से behave करते हैं
- Form input — autofill, keyboard types, autocomplete
- iOS Safari quirks —
100vhissues, scroll-bouncing, fixed positioning - Push notification permission flow — यह केवल top-level browser tab में HTTPS पर किसी published origin पर काम करता है; यह builder के preview panel के अंदर fire नहीं होगा (भले ही preview पहले से HTTPS पर serve हो रहा हो)।
- Performance real (धीमे) hardware पर
टेस्टिंग टिप्स
Section titled “टेस्टिंग टिप्स”- अपने फ़ोन के developer tools का उपयोग करें। macOS पर Safari, live debugging के लिए mobile Safari से connect हो सकता है; Chrome, Android Chrome से connect हो सकता है।
- Landscape में भी टेस्ट करें। अधिकतर developers केवल portrait में टेस्ट करते हैं और landscape bugs से चूक जाते हैं।
- Low-power mode के साथ टेस्ट करें। Animations और timers अलग तरह से behave करते हैं।
- PWA push के लिए real iPhone पर टेस्ट करें। iOS पर push notifications केवल Safari के ज़रिए install किए गए PWA से ही काम करते हैं।