LambdaTest Community

Find answers, support, and inspiration from other users

Questions
LambdaTest Community
Answered

How can Firefox be helpful to debug web issues in Android?

Can anyone please tell me how can Firefox be helpful to debug web issues in Android.

Up Vote Down Vote 0 Votes
Posted 3 months ago

Answers


Let’s take a look at how Mozilla Firefox makes remote debugging easier for developers.

What Will You Need?

The prerequisites are readily available with any developers and those which are not, can be downloaded or obtained without any cost. For your PC you will need

  • Chrome version 15 or above installed and properly working on your workstation.

  • If you are using Windows, USB drivers are required.

  • A USB cable to connect your Android device with the desktop or laptop.

For the Android device, the following things are required.

  • Latest version of Firefox, preferably version 35 or above.

  • Android version 4 or above.

  • USB debugging enabled in the developer options for Android.

How to Connect Your Workstation and the Android Device?

Your workstation can communicate with the mobile device with the help of Android Debug Bridge (ADB). It is a client-server program that allows you to execute commands to the device. Let’s deep dive into the process

  • Enable USB debugging in your mobile and attach it to the desktop via USB

  • Make sure you have installed the correct version of Android SDK.

  • ADB will be installed in the “platform-tools” directory.

  • Test whether it is working or not by executing adb devices command in the command shell. If the output contains the name of the device attached to your workstation, this means ADB is working fine.

  • The desktop browser also needs to have the adb helper add-on installed. If you find it missing, go to the Projects menu and navigate to “Manage Extra Components”. The “Extra components” window will appear, containing an entry for adb helper. Click on the install button and it will be added to your desktop browser.

Getting Started with Remote Debugging

The basics being covered, you will now need to enable remote debugging for both your desktop as well as mobile. In the mobile device

  • Open Firefox and go to the Menu

  • At the settings, you will find the Developer Tools option. Navigate there and enable the “Remote Debugging” checkbox.

On the dekstop

  • Open Firefox

  • Open the Toolbox and go to Settings

  • Just like mobile, Enable remote debugging checkbox will be found under the settings tab. Check it and close the Toolbox.

  • After executing the command, at your desktop, go to the Web Developer option in Firefox and click on “Connect”. A page will appear containing the hostname and port number.

  • Click on the connect button and a pop up will appear on the mobile device asking permission to confirm. Press Ok and your mobile device will be connected to the desktop.

  • A notification will appear in the desktop window prompting that connection is successful and the default tabs in mobile browser are now available at desktop.

Limitations of the Debugger and How to Overcome Them

From version 52, Firefox has introduced a new debugger that is by default enabled in the developer edition. Although it is more reliable and much faster, there are certain limitations as well. Let’s list them down.

DOM event breakpoints are not supported by the new debugger. When you are trying to debug your JavaScript, breakpoints are important since it can command the debugger to stop event execution. This limitation of the new debugger will make it difficult for developers to debug script related issues in Android.

Up Vote Down Vote 0 Votes
Posted 2 months ago