Support for Vivaldi & Brave browsers for "openChrome.applescript"

[favna]

Is your proposal related to a problem?

No, it is a new feature that is currently non-existing.

Currently there react-dev-utils package has an applescript "openChrome" which tries to reload a pre-existing webpack dev server tab in Chrome rather than opening a new tab. However in fairly recent times the Vivaldi and Brave browsers have gained a lot of popularity in the dev communities, at least those that I frequent. As a user of Vivaldi myself I would really appreciate it if the React dev server would also check for Vivaldi / Brave for the similar behaviour.

Describe the solution you'd like

The script should be modified or any such other modification made so that Vivaldi and Brave browsers are also supported

Describe alternatives you've considered

There are no alternatives to this problem, other than forcibly using Chrome exclusively for Dev but this would mean having to change default browser every time I and my peers would work on a React app which is extremely unreasonable.

Additional context

N.A.

[heyimalex]

There are no alternatives to this problem

Have you tried the BROWSER environment variable?

[favna]

@heyimalex, I have and this does not work.

This being because the BROWSER env arg is not being used in the references applescript (see here: https://github.com/facebook/create-react-app/blob/master/packages/react-dev-utils/openChrome.applescript). Furthermore, simply changing all occurrences of "chrome" / "google chrome" in the applescript and the openBrowser.js files with their respective vivaldi versions also doesn't seem to work. Whether that is because Vivaldi simply doesn't support this behaviour and my changes are valid, or because my changes are not valid I do not know and so that would require further investigation.

[heyimalex]

Ok, I think I misunderstood. So you can absolutely get create-react-app to launch Vivaldi and Brave, it'll just open a new tab every time you run start? And you want it to open in the same tab.

[favna]

That's correct, that's the behaviour it has for Chrome and since Vivaldi and Brave are Chromium based browsers I would assumed that it should be possible.

[handeyeco]

I came across this looking for a different issue and it sounded fun, so I got it to work.

Basically it would require:

• A list of compatible Chromium browsers (probably in order of popularity)
• Adjust openChrome.applescript so it takes a browser name
• The user would have to have Google Chrome installed (we need one known Chromium script library for the script)

I would be happy to submit a PR if it would be beneficial.

[favna]

I think that would be great @handeyeco. It sounds like a good solution. As for the chromium browsers, how are we going to detect which to target? For example I personally have both Chrome and Vivaldi installed but I never use Chrome - it's only really there just in case something misbehaves in Vivaldi for one reason or another. And I would of course want it to not just open Chrome suddenly.

As for a list of them, what comes to mind is the following list, in no particular order:

• Chrome
• Chrome Canary
• Chromium
• Opera
• Vivaldi
• Brave
• Microsoft Edge (beta, specifically, for now)

It also looks like Wikipedia has a list of Chromium based browsers: https://en.wikipedia.org/wiki/Chromium_(web_browser)#Browsers_based_on_Chromium

[handeyeco]

@favna, my current solution goes down the list looking for open browsers and if there are none in that list, it opens your default browser. So:

1. Starting with no browser open, you run npm start
2. The script opens Vivaldi in your case (default browser)
3. You stop/start the dev server
4. The script finds Vivaldi (not Chrome because it's not a running process) and does its thing

Tested and works:

✅ Google Chrome
✅ Google Chrome Canary
✅ Chromium
✅ Brave Browser
✅ Vivaldi
✅ Microsoft Edge

Tested and doesn't work:

❌ Opera
❌ Safari
❌ Firefox

I'll test again, clean up my code, and submit a PR. Hopefully they'll let it in! Not that it will affect me, I'm on Firefox.

[handeyeco]

@favna #8367 will hopefully help you. Unfortunately it's not passing tests, if you or anyone could give me a tip on fixing the issue it would be greatly appreciated.