testování a ladění webových stránek a webových aplikací na mobilních zařízeních může být náročné. Prohlížeče na telefonech a tabletech často nemají vestavěné debuggery a emulování mobilních zařízení není nikdy tak přesné, jak byste chtěli. Pro ladění mobilních webových stránek v systému Android poskytuje stolní verze prohlížeče Chrome řešení se vzdáleným laděním.,
tento článek vám ukáže, jak používat vzdálené ladění s Chrome z počítače. Můžete použít jeden z běžných stolních operačních systémů, jako jsou Windows, macOS nebo Linux.
Jak k ladění Android Chrome
Pokud si myslíte, že možná mají chybu v mobilní webové stránky nebo nativní aplikace na Android, ale nemůže zcela pin to dolů, paprskovou zbraní podporuje JavaScript hlášení havárie, stejně jako Android crash reporting. Zde si můžete vzít bezplatnou 14denní zkušební verzi.
nastavení
než budete moci provést jakékoli vzdálené ladění, musíte nastavit počítač, abyste mohli rozpoznat zařízení Android., To znamená umožnit debuggeru Chrome rozpoznat a připojit k telefonu. Začnete nastavením některých možností v telefonu.
Nastavení telefonu
otevřete aplikaci Nastavení v telefonu. Budete muset povolit možnosti vývojáře, pokud jste tak již neučinili. Chcete-li to provést, přejděte do nabídky „O telefonu“, která je umístěna uvnitř systémové nabídky na moderních zařízeních Android. Jakmile jste tam, přejděte dolů a klepněte na“ číslo sestavení “ sedmkrát. Nyní se vraťte na předchozí obrazovku nebo do nabídky „Systém“ v aplikaci Nastavení., Tam nyní najdete v dolní části novou položku nabídky s názvem „Možnosti vývojáře“.
jakmile jste uvnitř možností vývojáře, povolte je v telefonu kliknutím na přepínač v horní části stránky. Když přepínač říká „Zapnuto“, přejděte trochu dolů a povolte také“ ladění USB“. To vám umožní ladit zařízení pomocí připojení kabelu USB.
nastavení Počítače (pomocí Android ladění USB)
instalace Ovladače
to je vše, co můžeme udělat na telefonu, pro teď, tak se náš počítač připraven., Kroky, které je třeba podniknout, se na každém z velkých operačních systémů mírně liší.
Pokud používáte Windows, první věc, kterou musíte udělat, je nainstalovat ovladače USB pro vaše zařízení. Web Android Studio obsahuje seznam míst, kde najdete ovladače spolu s některými pokyny, jak nainstalovat ovladače do počítače. Někteří výrobci poskytují odkazy na soubor ovladače. Jiní vás jen vedou na webovou stránku podpory, v takovém případě budete muset udělat trochu hledání, abyste našli ovladače pro vaše zařízení.,
v případě, že počítač běží macOS nebo Linux, nebudete muset instalovat ovladače. Uživatelé Mac jsou ve skutečnosti připraveni jít. Pokud váš počítač běží Linux, je třeba provést další kroky Nastavení. Musíte se ujistit, že váš uživatelský účet patří do určité skupiny a budete muset nainstalovat balíček s tzv. Jsou konfigurace, které se některými zařízeními USB je známo, že váš počítač Linux. Pokud máte zájem o další podrobnosti, napsal jsem před časem vyhrazený článek o nastavení Linuxu pro ADB.,
Instalaci Android Debug Bridge (ADB)
Jakmile máte ovladače nebo udev pravidel nainstalován, budete také potřebovat ADB, který poskytuje rozhraní mluvit do vašeho mobilního zařízení. ADB a další nástroje platformy Android jsou dodávány s Android Studio, ale můžete je také stáhnout samostatně.
buď pomocí Android Studio Vložené Android SDK nebo oficiální platformy tools balíček od Google jsou preferované způsoby, jak jít. Balíčky nástrojů platformy jsou spravedlivé .zip-soubory obsahující složku platform-tools., Po extrahování souborů najdete binární soubory jako například adb.exe (Windows) nebo adb (macOS a Linux). Poté je můžete podle potřeby provést z okna shellu nebo terminálu podle vašeho výběru.
Pokud jste ve Windows a chcete nejmenší verzi ADB bez chmýří, podívejte se na fóra XDA; přejděte dolů na záhlaví stahování a klikněte na první odkaz v této sekci.
po stažení spusťte instalaci ADB., Po instalaci budete muset přejít do složky, kde byla nainstalována (C:\Program Files(x86)\Minimal ADB and Fastboot ve výchozím nastavení)a dvakrát kliknout cmd-here.exe. Otevře se okno příkazového řádku v této složce.
pomocí jedné z technik zadejte v okně shellu adb start-server pro spuštění serveru ADB.
Poznámka: ADB server bude muset být spuštěn kdykoli budete chtít ladit. Pokud restartujete počítač, server nebude spuštěn automaticky. Nedoporučuje se spouštět ADB jako trvalou službu na pozadí.,
poslední věc, kterou musíme udělat pro nastavení počítače, je povolit vzdálené ladění v nástrojích pro vývojáře Chrome. Chcete-li to provést, otevřete Chrome v počítači a přejděte do Nastavení DevTools na chrome://inspect/#devices
pro ladění webových stránek v systému Android odtud se ujistěte, že je zaškrtnuto „Discover USB devices“. Navrhoval bych také, aby byla tato část vývojářských nástrojů otevřena na kartě, protože ji brzy budeme potřebovat znovu.
spojení
to je tak daleko, jak se můžete dostat buď s přístroji na jeho vlastní., Chcete-li ladit webové stránky v systému Android v zařízení, budeme je muset připojit dohromady. Pokud jste tak ještě neučinili, připojte telefon k počítači přes USB. Pokud jsi to neudělal jako součást instalace ovladače, můžete vidět oznámení na hlavním panelu, takže můžete vědět, váš počítač je zřízení nového zařízení. Ujistěte se, že je telefon zapnutý a odemčený. Pokud ano a server ADB běží, měli byste vidět vyskakovací okno s názvem „Povolit ladění USB?”.
Pokud se nezobrazí, podívejte se do oznamovací oblasti v zařízení Android., Pokud se říká „připojeno jako mediální zařízení“, něco takového nebo něco o“ MTP“, klikněte na něj. To by vás mělo přivést na obrazovku, která vám umožní vybrat jiný typ připojení. Pro náš účel je „kamera (PTP)“ vhodným typem připojení. Jakmile vyberete PTP, “ Povolit ladění USB?“vyskakovací okno by mělo přijít.
abyste se nemuseli vypořádat s tímto vyskakovacím oknem při každém připojení zařízení, zkontrolujte možnost“ Vždy povolit z tohoto počítače“. V každém případě budete chtít kliknout na „OK“, což umožní, aby vaše mobilní zařízení bylo viditelné pro váš počítač pro ladění., V tomto okamžiku se vraťte na kartu DevTools, na kterou jsme se podívali dříve. Pokud všechno šlo dobře, měli byste vidět svůj telefon a všechny jeho karty Chrome, které jsou zde uvedeny.
ladicí webové stránky spuštěné v prohlížeči Chrome na vašem zařízení
nyní je čas přestat se nastavovat a začít ladit! Konečně! Chrome v počítači by vám měl zobrazit seznam karet otevřených v prohlížeči Chrome na vzdáleném zařízení. Pokud karta, kterou chcete ladit, není aktivní karta, můžete kliknout na „focus tab“ a vytvořit z ní aktivní kartu v zařízení. Poté klikněte na odkaz“ zkontrolovat“.,
to vyvolá Inspektor pro tuto kartu. Odtud můžete používat nástroje pro vývojáře Chrome, stejně jako byste to udělali, kdybyste ladili webovou stránku ve stolním prohlížeči. Jste dokonce schopni vidět obrazovku vašeho zařízení v rámci vývojářských nástrojů. Pokud se již nezobrazuje nebo pokud jej chcete přepnout, klikněte na ikonu hned vedle ikony inspektora v levém horním rohu nástrojů pro vývojáře.
Tipy pro ladění
zařízení můžete také ovládat z nástrojů pro vývojáře., Použijte kurzor myši na obrazovce obsazení, jako by váš kurzor byl prst na samotném zařízení.
- Klepněte na tlačítko, aby klepněte na
- Kliknutím a tažením švihem
- Použití rolovací kolečko pro posouvání
- Podržte
Shiftzatímco přetažením nahoru pro zvětšení - Podržte
Shiftzatímco tažením dolů jej oddálíte
můžete Si všimnout, že tam jsou některé průhledné skvrny na obrazovce obsazení. Jedná se o prvky uživatelského rozhraní z aplikace Chrome nebo ze systémového uživatelského rozhraní vašeho zařízení., Jsou skryty, protože protokol vzdáleného ladění umožňuje pouze interakci se samotnou webovou stránkou.
na starších a méně výkonných zařízeních využívá screen cast mnoho výpočetního výkonu vašeho mobilního zařízení. Můžete si všimnout, že výkon se zdá být pomalý, když jste odlévání obrazovky. Pokud se tedy snažíte měřit výkon, deaktivujte obsazení obrazovky a komunikujte přímo s mobilním zařízením.
konečně, pokud narazíte na problémy, kde se při interakci se zařízením nic nestane, zkuste zavřít aplikaci Chrome a znovu ji otevřít., Budete se muset znovu připojit ke vzdálenému zařízení prostřednictvím obrazovky DevTools v nástrojích pro vývojáře. Pokud to nepomůže, projděte tento rychlý kontrolní seznam:
- Odpojte zařízení a zapojte jej zpět do
- zamkněte telefon a probudit jej zpět
- zavřete okno nástroje pro vývojáře a znovu jej otevřete.
závěr
ladění mobilních webových stránek v prohlížeči Android Chrome nemusí být obtížné. Může to trvat trochu více nastavení, než by většina z nás chtěla. Ale jakmile je to postaráno, ladění mobilní webové stránky v zařízení je mnohem jednodušší., Nyní můžete ladit mobilní webové stránky Android na skutečném fyzickém zařízení.
strávili jste příliš mnoho času objevováním své chyby na prvním místě? Raygun vám pomůže odhalit, diagnostikovat a zničit chyby v kódu JavaScript nebo Android. Inteligentní upozornění a seskupení chyb znamená, že už nikdy nezmeškáte chybu v aplikaci. Přečtěte si více o Android crash reporting a JavaScript crash reporting.
více o ladění Android
jak Architekt své chyby pro lepší hlášení chyb
Začínáme s dálkovým ladění v Android