Setting HTTPS=true breaks HMR

[royledford]

When instructing CRA apps to use https for dev server hot module reloading stops working.

To reproduce:

1. Clone this repo
2. Switch to repo folder
3. run yarn in folder to install dependencies
4. update ./packages/apps/app-multi-comps/package.json start script to "start": "HTTPS=true react-scripts start"
5. Once app is running in browser, change any file in that app

expected results:
App would update and show changes

actual results:
App does not update until manually refreshed

I also tried

• Adding HTTPS=true in a .env file
• Adding HTTPS=true as an os level environment variable

[royledford]

In case anyone else is looking for this, I've solved it with a temporary workaround.

The issue is the websocket connect for reloading is not using wss protocol.

Update line 62 in node_modules/@react-workspaces/react-scripts/node_modules/react-dev-utils/webpackHotDevClient.js to the following:

protocol: window.location.protocol === 'https:' ? 'wss' : 'ws',

This was updated in the create-react-app repo but it doesn't seem react-workspaces has been updated to use it. See And this CRA update https://github.com/facebook/create-react-app/pull/8079/files#diff-5166b8ed2c51bdab6a247a95b14ff595R62