Bug: Inconsistent Webpacker watch behaviour

[Antoni Sobolewski]

Checks

• I have thoroughly read and understand The Odin Project Contributing Guide
• The title of this issue follows the Bug: brief description of bug format, e.g. Bug: Lesson complete button does not update on click
• Would you like to work on this issue?

Bug description

For some reason, webpack (?) doesn't always refresh the CSS files that are changed. You can observe this by both applying changes that should change the styling or changes that should rise syntax errors. The way to get it back running is running bin/rails assets:clobber and perhaps bin/rails css:clobber - on my fresh VM running those once got it working on the app start right after and another after that. It worked after a reboot as well.

How to reproduce

1. Set up the app and start it
2. Do some changes in CSS, for example pagy.css - save the file
3. Refresh the page that those CSS changes target
4. Don't see the changes applied

Alternatively:

1. Set up the app and start it
2. Introduce syntax errors (adding random asdasdasd is good enough) into a CSS file, for example pagy.css - save the file
3. Look into the terminal output and see no complaints as if it didn't watch the change

Expected behavior

1. Set up the app and start it
2. Do some changes in CSS, for example pagy.css - save the file
3. Refresh the page that those CSS changes target
4. See the changes applied

Alternatively:

1. Set up the app and start it
2. Introduce syntax errors (adding random asdasdasd is good enough) into a CSS file, for example pagy.css - save the file
3. The terminal output complains about the syntax error

What browsers are you seeing the problem on?

No response

What OS are you using?

Ubuntu

Discord Name

No response

Additional Comments

No response