JS Debugger on WSL issue

[StefanVinica]

Summary

The CLI is not able to recognize the google-chrome installed on my WSL this is the workaround

here
node_modules/@expo/cli/build/src/start/server/middleware/inspector/LaunchBrowserImplWindows.js

By setting IS_WSL to false, you force the logic to treat WSL as a Linux environment, allowing the browser to be launched correctly within WSL. If you still encounter issues, consider verifying the path to the Chrome executable and ensuring the BROWSER environment variable is set correctly.

This should allow the JavaScript inspector to open correctly in your WSL environment using Google Chrome. If you encounter further issues, please provide specific error messages or additional details for further assistance.

What platform(s) does this occur on?

Android, iOS

SDK Version

51.0.8

Environment

expo-env-info 1.2.0 environment info:
System:
OS: Linux 5.15 Ubuntu 22.04.4 LTS 22.04.4 LTS (Jammy Jellyfish)
Shell: 5.1.16 - /bin/bash
Binaries:
Node: 21.7.3 - ~/.nvm/versions/node/v21.7.3/bin/node
Yarn: 1.22.19 - /usr/local/bin/yarn
npm: 10.5.0 - ~/.nvm/versions/node/v21.7.3/bin/npm
npmPackages:
expo: ^~51.0.8 => 51.0.8
react: 18.2.0 => 18.2.0
react-dom: 18.2.0 => 18.2.0
react-native: 0.73.6 => 0.73.6
react-native-web: ^0.19.10 => 0.19.10
Expo Workflow: bare

Minimal reproducible example

Issue Title

Unable to Open JavaScript Inspector in WSL with Google Chrome

Issue Description

I am unable to open the JavaScript inspector in WSL when using Google Chrome. The error message indicates that the browser cannot be found, despite having Chrome installed and running in WSL. This issue prevents me from debugging my Expo application effectively.

Environment

• Operating System: Windows 11 with WSL2 (Ubuntu 22.04)
• Expo CLI Version: 5.4.1
• Node Version: 18.16.1
• Google Chrome Version: 113.0.5672.92

Steps to Reproduce

1. Install WSL2 and set up Ubuntu:

   • Follow the official WSL2 setup guide to install and configure WSL2 with Ubuntu 22.04.

2. Install Google Chrome in WSL:

   • Update package lists and install Chrome:

     sudo apt update
     sudo apt install google-chrome-stable

3. Set up Expo project:

   • Initialize a new Expo project:

     npx create-expo-app my-app
     cd my-app

4. Start Expo and open Developer Tools:

   • Start the Expo server:

     expo start

   • In the Expo Developer Tools, select "Debug Remote JS".

5. Error Occurrence:

   • An error message appears:

     Debug: Opening JavaScript inspector in the browser...
     Error launching JS inspector: [findSupportedBrowserTypeAsync] Unable to find a browser on the host to open the inspector. Supported browsers: Google Chrome, Microsoft Edge, Brave
     

Expected Behavior

The JavaScript inspector should open in Google Chrome running within WSL, allowing me to debug my application.

Actual Behavior

The inspector fails to open, displaying an error that it cannot find a supported browser.

Workaround Attempted

I attempted to modify the Expo CLI’s LaunchBrowser.js file to bypass the IS_WSL check, as follows:

const IS_WSL = require("is-wsl") && !require("is-docker")();
function createLaunchBrowser() {
    let launchBrowser;
    if (_os().default.platform() === "darwin") {
        launchBrowser = new _launchBrowserImplMacOS.default();
    } else if (_os().default.platform() === "win32" || IS_WSL) {
        launchBrowser = new _launchBrowserImplWindows.default();
    } else if (_os().default.platform() === "linux") {
        launchBrowser = new _launchBrowserImplLinux.default();
    } else {
        throw new Error("[createLaunchBrowser] Unsupported host platform");
    }
    return launchBrowser;
}

Changing const IS_WSL = false allows the logic to treat WSL as a Linux environment, but the issue persists.

Additional Information

• Expo DevTools Log:

  Debug: Opening JavaScript inspector in the browser...
  Error launching JS inspector: [findSupportedBrowserTypeAsync] Unable to find a browser on the host to open the inspector. Supported browsers: Google Chrome, Microsoft Edge, Brave
  

References

• GitHub Issue Can't use JS debugger with Metro hosted from docker container #24693: Unable to find a browser on the host to open the inspector
• GitHub Issue Unable to launch Microsoft Edge debugger #21910: Unable to launch Microsoft Edge debugger

Submission Template

### Unable to Open JavaScript Inspector in WSL with Google Chrome

**Issue Description:**
I am unable to open the JavaScript inspector in WSL when using Google Chrome. The error message indicates that the browser cannot be found, despite having Chrome installed and running in WSL. This issue prevents me from debugging my Expo application effectively.

**Environment:**
- Operating System: Windows 11 with WSL2 (Ubuntu 22.04)
- Expo CLI Version: 5.4.1
- Node Version: 18.16.1
- Google Chrome Version: 113.0.5672.92

**Steps to Reproduce:**
1. Install WSL2 and set up Ubuntu:
   - Follow the [official WSL2 setup guide](https://docs.microsoft.com/en-us/windows/wsl/install) to install and configure WSL2 with Ubuntu 22.04.

2. Install Google Chrome in WSL:
   ```sh
   sudo apt update
   sudo apt install google-chrome-stable

3. Set up Expo project:

   npx create-expo-app my-app
   cd my-app

4. Start Expo and open Developer Tools:

   expo start

   • In the Expo Developer Tools, select "Debug Remote JS".

5. Error Occurrence:

   Debug: Opening JavaScript inspector in the browser...
   Error launching JS inspector: [findSupportedBrowserTypeAsync] Unable to find a browser on the host to open the inspector. Supported browsers: Google Chrome, Microsoft Edge, Brave
   

Expected Behavior:
The JavaScript inspector should open in Google Chrome running within WSL, allowing me to debug my application.

Actual Behavior:
The inspector fails to open, displaying an error that it cannot find a supported browser.

Workaround Attempted:
I attempted to modify the Expo CLI’s LaunchBrowser.js file to bypass the IS_WSL check, as follows:

const IS_WSL = require("is-wsl") && !require("is-docker")();
function createLaunchBrowser() {
    let launchBrowser;
    if (_os().default.platform() === "darwin") {
        launchBrowser = new _launchBrowserImplMacOS.default();
    } else if (_os().default.platform() === "win32" || IS_WSL) {
        launchBrowser = new _launchBrowserImplWindows.default();
    } else if (_os().default.platform() === "linux") {
        launchBrowser = new _launchBrowserImplLinux.default();
    } else {
        throw new Error("[createLaunchBrowser] Unsupported host platform");
    }
    return launchBrowser;
}

Changing const IS_WSL = false allows the logic to treat WSL as a Linux environment, but the issue persists.

Additional Information:

• Expo DevTools Log:

  Debug: Opening JavaScript inspector in the browser...
  Error launching JS inspector: [findSupportedBrowserTypeAsync] Unable to find a browser on the host to open the inspector. Supported browsers: Google Chrome, Microsoft Edge, Brave
  

References:

• GitHub Issue Can't use JS debugger with Metro hosted from docker container #24693: Unable to find a browser on the host to open the inspector
• GitHub Issue Unable to launch Microsoft Edge debugger #21910: Unable to launch Microsoft Edge debugger

You can use this template to submit an issue on the [Expo GitHub repository](https://github.com/expo/expo/issues). This will help the maintainers understand and potentially resolve the problem.

[ludersGabriel]

Had the same problem. Putting IS_WSL to false in both LaunchBrowser.js and LaunchBrowserImplWindows.js fixed it.