hotwire-livereload
hotwire-livereload copied to clipboard
3 reload modes: hard, soft, css-only. Reload on error pages.
This PR introduce 2 major changes:
- 3 different reload modes (css, soft, hard)
- Auto-reload on error pages.
Reload modes: Depending on what changed we can do different reload types.
- When css files are changed we can inject new CSS into current page. This is especially cool when you do some actions on page (open dropdown, collapses, some ajax request etc), which will be reset after a page reload. This requires external css build tools like dart-sass, which will automatically rebuild css files.
- When non-js files are changed we can do fast reload using Turbo.visit()
- When js files are changed we must do a full page reload. If we do Turbolinks.visit(), it will detect that js files are changed and do a full reload anyway, but this will result in double page load.
Auto-reload on error pages: I have added a middleware which injects livereload code into error pages.
To be honest, i did this couple of month ago and did not have time to submit a PR, and now looking at the code it looks like an alien wrote it. But if you think i need to improve something in this PR, i'll try to do this.
@elik-ru thanks for the PR 🙌 I will review and test on the weekend
Nice PR. Tested at my end, the only thing that didnt work out was the default :css mode, my setup is jsbundling + cssbundling + talwindcss.
It fails silently here because my stylesheet tag do not contain a stylesheet data attribute, as your code is expecting. My link is:
<link rel="stylesheet" href="/assets/application-{{big-hash-here}}.css" data-turbo-track="reload">
I could fix it adding the data attribute manually, like this:
# application.html.erb
<%= stylesheet_link_tag "application", "data-turbo-track": "reload", "data-stylesheet": "application.css" %>
Is this expected?
@LEstradioto Thanks for your feedback! Yes, this is kinda expected, because actual filename differs form digested url, and digested url changes when file changes, there is no easy way to match actual filename and corresponding
Hi @kirillplatonov! How is it going? Can i help you in somehow to make it easier to review?
@elik-ru could you please extract reloading on error pages into separate PR? It would be easier to review and merge this way
@kirillplatonov There 2 commits for 2 features, but seems some improvements leaked from one to the other. Ok, i'll prepare 2 separate PRs
Continuation: https://github.com/kirillplatonov/hotwire-livereload/pull/46