Refresh not working on entries using a layer

[richterb]

On my current setup, the entire HMR + refresh works fine on an entry such as:

myentry: {
    import: './src/entries/myentry.tsx',
},

But if I configured it to use a layer such as:

myentry: {
    import: './src/entries/myentry.tsx',
    layer: 'mylayer',
},

The entire HMR system works, detects the right file, but refresh doesn't happen.

I don't know if this is relevant or not, but the main difference may be in the way the updated module is identified:

[HMR] Updated modules:
[HMR] - (mylayer)/./src/applications/myapp/myfile.tsx

When a layer is configured, (mylayer)/ is appended at the start of the path in the log, and I can see this as well at the start of the JS file sent to the browser:

self["webpackHotUpdatereactjs"]("myentry", {

    /***/
    "(mylayer)/./src/applications/myapp/myfile.tsx": /*!**************************************************************************!*\

I'm not familiar enough with the mechanisms, but maybe it's messing with path comparison somewhere down the road.

I can reproduce this on a fresh app created using create-react-app, ejected so that the webpack config uses a layer on its entry (+ latest versions of webpack, webpack-dev-server, and react-refresh-webpack-plugin).

Layers are a Webpack experiment so this may be a bit of an edge case. Thanks!

[moonlitusun]

+1