If sockHost is not specified, overlay will try to connect to 3rd party server hosting other scripts on the page

Using the latest version of the plugin (0.5.4)

I’m initializing like:

new ReactRefreshWebpackPlugin({
          overlay: {
            sockPort: 1887
          }
});

The url of the page: http://localhost:3000/

Webpack dev server is on localhost:1887.

The console will show an error opening a web socket to a third party server (e.g., wss://googleads.g.doubleclick.net:1887/ws, but the host of other third party scripts used on the page is seen frequently as well) instead of localhost. According to the docs, the default should be window.location.hostname. This error seems to be related to usage of this plugin (changing settings as described below resolves the issue).

While not happening every time I load a page, the error happens very frequently. Manually setting sockHost to ‘localhost’ makes it so the connection always goes to localhost, however it uses wss instead of ws (which I think is related to the third party scripts being loaded with https instead of http like the main page). So I also need to hardcode sockProtocol to ‘ws’. Once I do this it works 100% (but I shouldn’t need to according to the docs, and I don’t want to hardcode these values).

The web socket established by webpack-dev-server (4.7.2) always establishes correctly – only the socket established by this plugin has intermittent issues.

[pmmmwh]

It should probably have the same behaviour as WDS, I’ll take a look at why this was breaking.

[pmmmwh]

This will be fixed in #630 and should be released soon.