Changes to Elm source code not reflected with HMR

[Henrik Feldt]

Is this a bug report?

Yes

Environment

1. node -v: v11.12.0
2. npm -v: 6.11.2
3. npm ls create-elm-app -g (if you haven’t ejected):

/Users/h/.nvm/versions/node/v11.12.0/lib
└── create-elm-app@3.2.2

Then, specify:

1. Operating system: macOS 10.14.6
2. Browser and version (if relevant): FF 69.0.3

Steps to Reproduce

git clone https://github.com/haf/music.git
cd music
git checkout 4e2f83e6169d6c8825b4a99f8b4fb6acf7df5177
npm i
npm i -g create-elm-app@3.2.2
elm-app start

Press play for 0. Mine, you should hear three notes.

Your browser should concurrently be connected to the elm-app websocket and thus refresh when;

you edit Mine.elm and remove two of the notes and then:

Press play for 0. Mine, you should hear one note. You hear three notes instead, despite the browser having refreshed.

Expected Behavior

When you update the Elm source code, the source code running in the browser should change. It does not, but it errenously tells you it's updated by refreshing.

Other repro

Change the Main.elm file and add another item in the dictionary that creates the playlist in the browser. Your change is not reflected.

[Eduard Kyvenko]

Hi Henrik!

Thanks for your feedback! 👍

That's a pretty cool app you're working on and I totally understand that it's a frustrating experience to not be able to play the music after it was updated.

To be honest, I'm not sure this issue can be solved by changing how HMR works in Elm at the moment, all it does is just restoring the state to what it was before the update. If code defining the state changes, it will not always reflect the update right away.

Here's a solution I'd like to propose:
To make the HMR pick-up the updates, I'd move the actual music with the notes out of state. If it does not change during the runtime, it's not a part of the app state.

There's probably a reason for storing the notes in the state, sorry if that's not helpful. I hope this clarifies the limitation of HMR a bit.

Please feel free to reopen the issue if you have further questions.

[Henrik Feldt]

Thanks for clarifying that. I'm used to React's HMR that just cleans out the state... Wouldn't it make more sense to start with the initial (new) state and then replay the Msg values onto it; or would that require the code to "know" not to send Cmds?

[Eduard Kyvenko]

I don't think Elm allows HMR to replay the messages, the development mode only allows importing the old state.

As of today, HMR in Elm will not reflect the changes if you change any code related to state management e.g. update, Msg, initialState.
Replay in Redux, for example disables all side-effects(AJAX) by default, it's hard to say what implications this would have on Cmds.

There's a discussion on this issue in the HMR repo: klazuka/elm-hot#19