Remote debugging on Android with Chrome developer tools

-
One of the major and time consuming issue while developing and testing an application is its support on hand held devices. The major stake holders for such devices are iOS safari for Apple devices, stock browser and Chrome for Android devices. For developing cross platform applications these devices and browers plays a key important role. And we invest most of our time in testing, verification and specially resolving issues that occurs only in special cases like some element gets not aligned or get extra space when we run application on one of these device. Or in some cases client sided scripting code stops working.
To save developement time and to encounter such issues Google and Apple works and invest alot on devloping some handy tools that boost application development process. One of such tool is Chrome developer tool for Google Chrome and similar for desktop version of Apple Safari. Such tools are very popularly used for investigating CSS  issues,JavaScript debugging & performance profiling and validateing request - response cycle.
These tools works great on desktop and for emulating some devices. But on actual mobile devices we have lots of limitations for debugging and we genrally goes with some remote debugging tools like JsConsole, weinre or others which are difficult to configure and use. But now with the release of latest version of chrome things become easy. 
Remote debugging is equipted with great features that not investigate CSS, debuf and profile JavaScript and see request response but also replicate device screen on desktop. and even it will display Page Paint Time and GPU usage as : 

Now Steps to configure Chrome Remote Debugging,

I have configured that for Samsung mobile with Android 4.2. 
  • Install the USB driver for your device, which seems very difficult to find the exact supported version so, instead of that use device connectivity suit provided by the vender like KIES for Samsung, Or use developer edition of the devices.
  • Connect the device and Enable USB debugging on the phone.- Settings > Developer options > check USB Debugging
Add ADB extension in the Google Chrome on Desktop or just about:inspect in the address bar of the desktop chrome. 
type

Click the View Inspection Targets to view the connected target and list of tab you have opened in the the Android Chrome just as 


No on the Tab you want to debug just click "Inspect" for that and there you go. I opens a new chrome window for debugging the tab you have opened in chrome on your Android device. For further details and features you can refer this .


The same feature is provided by the Apple Safari but for that you need a Mac machine for debugging.

Location: Stockholm, Sweden

Comments

  1. Dora HunterAugust 17, 2021 at 1:44 PM

    There are also slide carousel design results for numerous queries which are positioned actually higher and produce a whole new degree of interaction. Onsite IT Support

    ReplyDelete

Post a Comment

Popular posts from this blog

How to Build Mobile Apps for Online Marketplaces

-
Image
  Introduction: In today's digital age, online marketplaces have revolutionized the way we buy and sell goods and services. With the increasing popularity of smartphones, mobile apps have become the go-to platform for accessing these marketplaces. If you are looking to venture into mobile app development for online marketplaces, you've come to the right place. In this comprehensive guide, we'll walk you through the essential steps and considerations for building mobile apps for online marketplaces.   Define Your App's Purpose and Features: Before diving into development, it's crucial to define the purpose and key features of your app. Consider the target audience, niche, and unique selling points that will set your marketplace app apart from the competition. Determine the core functionalities your app will offer, such as user registration, product listings, search and filtering options, secure payment gateways, ratings and reviews, and messaging capabilities...
Read more

The Growing Importance of Website Accessibility in the Digital Age

-
Image
  Introduction: In today's digital age, websites have become the primary means for individuals to access information, connect with businesses, and engage with various online services. As the online landscape continues to evolve, it is imperative that website owners and developers prioritize accessibility for all users. Website accessibility ensures that people with disabilities can navigate, understand, and interact with online content on an equal basis with others. In this blog post, we will explore the growing importance of website accessibility and its significant impact on user experience, inclusivity, legal obligations, and business success.   Enhancing User Experience: Website accessibility goes beyond compliance with legal requirements; it directly improves user experience for all visitors. By implementing accessible design principles, such as clear navigation, readable text, and properly labeled links, websites become more user-friendly for everyone. An accessi...
Read more

How to Choose the Right Software Development Company in 2023

-
Image
  In today's digital age, choosing the right software development company is crucial for the success of your business. Whether you are a startup looking to build a groundbreaking app or an established enterprise in need of custom software solutions, making the right choice can have a significant impact on your project's outcome. In this comprehensive guide, we will walk you through the key factors to consider when selecting a software development company in 2023.   Understanding Your Needs   Before you embark on the journey of finding the perfect software development partner, it's essential to have a clear understanding of your project's needs and goals. Take the time to define your project scope, objectives, and budget. Consider the following questions:   What is the purpose of your software?   What features and functionalities do you require?   What is your budget and timeline for the project?   Having a well-defined project plan will not only help y...
Read more