Test localhost on Oculus Quest with Remote Debugging in Firefox

cassiebreviu

Cassie Breviu

Posted on May 17, 2020

Test localhost on Oculus Quest with Remote Debugging in Firefox

Here are some quick steps to help with debugging for WebXR. These things are LIFE CHANGING for WebXR development! Note: the steps are specific to Windows OS.

Install Firefox and Android Debug Bridge (adb)

Add Android Debug Bridge (adb) to Path

  • Type path in the windows search and hit enter on Edit the system environment variables
  • Click Environment Variables
  • Select Path and click Edit
  • Select New
  • Paste the location of adb.exe. The location should be something like this C:\Users\USERNAME\AppData\Local\Android\sdk\platform-tools
  • Restart your computer

Run the project locally and connect to remote debugging

  • Open your WebXR Project (Starter Template for BabylonJS Here)
  • Run the project npm start
  • Open Firefox on PC
  • Connect to Oculus Quest to PC with USB
  • Click the menu on the right of the Firefox browser
  • Then select Web Developer -> Remote Debugging
  • Click Connect on device

Reverse the Ports to make localhost available

  • Open cmd or windows terminal
  • List connected devices: adb devices
  • Set the reverse device id: adb reverse -s <ID from device attached above>
  • Reverse the port and update to the port you are using: adb reverse tcp:8080 tcp:8080
  • If it gets disconnected (sometimes it does) just rerun the last cmd to reconnect.
  • On the Oculus headset go to localhost:8080 (update 8080 to your port)

That's it! You are now running localhost on your VR headset and the debug output on your PC.

💖 💪 🙅 🚩
cassiebreviu
Cassie Breviu

Posted on May 17, 2020

Join Our Newsletter. No Spam, Only the good stuff.

Sign up to receive the latest update from our blog.

Related