💾 Archived View for perso.pw › blog › articles › remote-firefox-debug.gmi captured on 2024-08-18 at 17:41:45. Gemini links have been rewritten to link to archived content
-=-=-=-=-=-=-
NIL# Introduction
Firefox has an interesting features for developers, its ability to connect a Firefox developers tools to a remote Firefox instance. This can really interesting in the case of a remote kiosk display for instance.
The remote debugging does not provide a display of the remote, but it gives you access to the developer tools for tabs opened on the remote.
The remote firefox you want to connect to must be started using the command line parameter `--start-debugger-server`. This will make it listen on the TCP port 6000 on 127.0.0.1. Be careful, there is another option named `remote-debugging-port` which is not what you want here, but the names can be confusing (trust me, I wasted too much time because of this).
Before starting Firefox, a few knobs must be modified in its configuration. Either search for the options in `about:config` or create a `user.js` file in the Firefox profile directory with the following content:
user_pref("devtools.chrome.enabled", true);
user_pref("devtools.debugger.remote-enabled", true);
user_pref("devtools.debugger.prompt-connection", false);
This enables the remote management and removes a prompt upon each connection, while this is a good safety measure, it is not practical for remote debugging.
When you start Firefox, the URL input bar should have a red background.
Now, you need to make a SSH tunnel to that remote host where Firefox is running in order to connect to the port. Depending on your use case, a local NAT could be done to expose the port to a network interface or VPN interface, but pay attention to security as this would allow anyone on the network to control the Firefox instance.
The SSH tunnel is quite standard: `ssh -L 6001:127.0.0.1:6000`, the remote port 6000 is exposed locally as 6001, this is important because your own Firefox may be using the port 6000 for some reasons.
In your own local Firefox instance, visit the page `about:debugging`, add the remote instance `localhost:6001` and then click on Connect on its name on the left panel. Congratulations, you have access to the remote instance for debugging or profiling websites.
Input the remote address localhost:6001 and click on Add
Enjoy your remote debugging session
While it can be tricky to debug a system you can directly see, especially if it is a kiosk in production that you can see / use in case of a problem.
