Bug 1909928 - [devtools] Tweak about:debugging docs about remote debugging. r=jdescottes,fluent-reviewers,devtools-reviewers,bolsson

Differential Revision: https://phabricator.services.mozilla.com/D217743

devtools/client/aboutdebugging/src/components/connect/ConnectPage.js

@@ -178,6 +178,10 @@ class ConnectPage extends PureComponent {
               {
                 localizationId: "about-debugging-setup-usb-step-enable-debug2",
               },
+              {
+                localizationId:
+                  "about-debugging-setup-usb-step-enable-file-transfer",
+              },
               {
                 localizationId:
                   "about-debugging-setup-usb-step-enable-debug-firefox2",

devtools/client/locales/en-US/aboutdebugging.ftl

@@ -139,6 +139,9 @@ about-debugging-setup-usb-step-enable-dev-menu2 = Enable Developer menu on your
 # USB section step by step guide
 about-debugging-setup-usb-step-enable-debug2 = Enable USB Debugging in the Android Developer Menu.
 
+# USB section step by step guide
+about-debugging-setup-usb-step-enable-file-transfer = Enable file transfer and ensure that your device is not in charging-only mode.
+
 # USB section step by step guide
 about-debugging-setup-usb-step-enable-debug-firefox2 = Enable USB Debugging in Firefox on the Android device.
 

devtools/docs/user/about_colon_debugging/index.rst

@@ -42,9 +42,24 @@ Firefox supports debugging over USB with Android devices, using the about:debugg
 
 Before you connect:
 
+0. Ensure clicking once on "Enable USB Devices" in about:debugging homepage.
+
+.. image:: about_debugging_home.png
+  :class: border
+
 1. Enable Developer settings on your Android device.
-2. Enable USB debugging in the Android Developer settings.
+   Press 7 times on "Build Number" from your "About your phone" in the device settings app.
+2. Enable "USB debugging" in the Android Developer settings.
+   `Detailed guide for 1. and 2. <https://developer.android.com/studio/debug/dev-options>`_
+
+.. image:: android_usb_debugging.png
+  :class: border
+
 3. Enable **Remote Debugging via USB** in the Advanced Settings in Firefox on the Android device.
+
+.. image:: android_firefox_debugging_option.png
+  :class: border
+
 4. Connect the Android device to your computer using a USB cable.
    If a USB cable is not available, :ref:`connect to Android over Wi-Fi <about-colon-debugging-connecting-to-android-over-wi-fi>`.