Buggy behaviour in launchDebugger.js on macOS

[StasD]

Environment

System:
    OS: macOS Mojave 10.14.6
    CPU: (8) x64 Intel(R) Core(TM) i7-6820HQ CPU @ 2.70GHz
    Memory: 1.77 GB / 16.00 GB
    Shell: 3.2.57 - /bin/bash
  Binaries:
    Node: 10.16.3 - /usr/local/bin/node
    Yarn: 1.19.0 - /usr/local/bin/yarn
    npm: 6.11.3 - /usr/local/bin/npm
    Watchman: 4.9.0 - /usr/local/bin/watchman
  SDKs:
    iOS SDK:
      Platforms: iOS 13.0, DriverKit 19.0, macOS 10.15, tvOS 13.0, watchOS 6.0
    Android SDK:
      API Levels: 27, 28, 29
      Build Tools: 27.0.3, 28.0.3, 29.0.2
      System Images: android-28 | Google APIs Intel x86 Atom, android-29 | Google APIs Intel x86 Atom
      Android NDK: 20.0.5594570
  IDEs:
    Android Studio: 3.5 AI-191.8026.42.35.5791312
    Xcode: 11.0/11A420a - /usr/bin/xcodebuild
  npmPackages:
    react: 16.9.0 => 16.9.0 
    react-native: 0.61.1 => 0.61.1

Description

I was wondering why do I still get the message "For a better debugging experience please install Google Chrome" while I do have it installed, and the debugger was opening in Safari before I changed the default browser to Chrome...

So I found that the file
node_modules/@react-native-community/cli/build/commands/server/launchDebugger.js
was responsible for that message and I did some debugging.

I found out that you use open package to open urls in Chrome, and you correctly have 'google chrome' as the app name parameter for that package (on a mac). BUT! You check for the existence of command with such name before actually launching Chrome. And such a command ('google chrome') obviously does not exist, that's why please install Google Chrome message is displayed no matter what . So I suggest dropping the check for command existence altogether and rewriting the code similar to this:

  try {
    launchChrome(url);
  } catch {
    _cliTools().logger.info(`For a better debugging experience please install Google Chrome from: ${_chalk().default.underline.dim('https://www.google.com/chrome/')}`);
    (0, _launchDefaultBrowser.default)(url);
  } 

P.S.: Looks like nothing happens if I pass a wrong app name to 'open', it just suppresses any errors, so the fix might be not that easy.

P.P.S.: Changing from 'google chrome' to '/Applications/Google Chrome.app/Contents/MacOS/Google Chrome' in getChromeAppName function and also adding double quotes around ${commandName} in commandExistsUnixSync function seem to be enough to fix this bug.

[thymikee]

'google chrome' shuold work according to official usage: https://www.npmjs.com/package/open#usage maybe it's 'Google Chrome' now? Feel free to play with it and send a PR, would love to have this resolved :)

[StasD]

'google chrome' does indeed work with open, but there is also a check (in launchDebugger.js) that whatever is sent to open also works as a general (bash) command. 'google chrome' does not work as a command, so the debugger gets open in a default browser (whatever it is, could be Chrome too), and there is a message that Chrome is not installed ...

[thymikee]

We need to fix this logic then

[Taym95]

I was debugging this issue and I found that replacing google chrome by /Applications/Google Chrome.app/Contents/MacOS/Google Chrome will not work because the right command is /Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome where the namespaces are replaced by \ , even if we change the command to /Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome the output of execSync will be /Applications/Google Chrome.app/Contents/MacOS/Google Chrome with spaces which is not correct command in mac and it will give error command not found!
Any suggestions?

[Taym95]

I have found a solution I will submit a PR soon.