This 1.0 milestone comes almost six years after the first LiveView commit. I published a Phoenix blog highlighting our developments along the way, a few fun demos, and what we’re up to next.
Existing applications on 0.20.x should have a quick upgrade. We have one backwards compatible change that you can add back via a phx-feedback-for shim. Full changelog with shim notes:
Changelog
Backwards incompatible changes for 1.0
LiveView 1.0 removes the client-based phx-feedback-for annotation for showing and hiding input feedback, such as validation errors. This has been replaced by Phoenix.Component.used_input?/2, which handles showing and hiding feedback using standard server rendering.
A backwards-compatible shim can be used to maintain phx-feedback-for in your existing applications:
Add a new dom option to your LiveSocket constructor, or wrap the existing value:
import {Socket} from "phoenix";
import {LiveSocket} from "phoenix_live_view"
import phxFeedbackDom from "./phx_feedback_dom"
let csrfToken = document.querySelector("meta[name='csrf-token']").getAttribute("content");
let liveSocket = new LiveSocket("/live", Socket, {
params: {_csrf_token: csrfToken},
dom: phxFeedbackDom({})
})
1.0.0-rc.0 (2024-05-08)
Backwards incompatible changes
Remove phx-feedback-for in favor of Phoenix.Component.used_input?. See the changelog for a backwards compatible phx-feedback-for shim to add to existing applications.
Removal of previously deprecated functionality
live_component/2 and live_component/3 helpers (not the function component) have been removed
Bug fixes
Fix attributes of existing stream items not being updated on reset
Fix nested LiveView within streams becoming empty when reset
Fix phx-mounted firing twice, first on dead render, then on live render, leading to errors when a LiveComponent has not yet mounted
Fix JS.toggle_class error when used with a transition
Ooo exciting! Congratulations to Chris and the Phoenix team and everyone who has worked on it - it’s been fantastic seeing LV take shape over the years, it is yet another key killer feature that will help Elixir and Erlang stand out for years to come
Awesome news! I’ve been wondering, is :phoenix_live_view going to be merged into the :phoenix hex package? It seems like this has been the plan since :phoenix_live_view contains Phoenix.Component. I know for newbies it’s very confusing why they have to go to :phoenix_live_view on hexdocs to find the documentation for function components that they’re using in layouts and non-live views. Maybe a Phoenix 2.0 release that bundles it all together? Or at least moves Phoenix.Component into :phoenix?
Following the instructions, I get this error. Any idea why?
Failed to check for new Hex version
Entity not found (404)
Resolving Hex dependencies...
Resolution completed in 0.064s
Because your app depends on phoenix_live_view empty which doesn't match any versions, version solving failed.
(2024-05-08)
Excellent work has been done in the past 6 years. A game changer and inspiring.
