phoenix_live_view changelog

Here's a delightful update on the latest changes and improvements made to the Phoenix LiveView framework. We've been busy enhancing features, fixing bugs, and polishing the overall experience to make your development journey smoother and more enjoyable. 🎉

  • New feature: The liveSocket.js() has been supercharged with the addition of navigate, patch, and push commands. This gives developers more control over client-side interactions, making it easier than ever to manage navigation and updates within your LiveView applications. Plus, we've added tests to ensure everything works like a charm. 🚀

  • Improvement: The used_input? method in Phoenix.Component now plays nicely with structs, treating them correctly and ensuring robust input handling. This update enhances the flexibility and reliability of component parameter evaluations. 💪

  • Improvement: We've polished the handling of flash messages during fallback redirects. Now, when an unauthorized or stale response triggers a redirect, your flash messages will be safely preserved, ensuring a seamless user experience. New end-to-end tests have been added to guarantee everything stays in tip-top shape. ✨

  • Bugfix: Sticky LiveViews are here to stay! No more shutting down during push_navigate events. This fix ensures that your sticky LiveViews remain active, preserving user interactions and state during navigation. 🧲

  • Improvement: We've spruced up the phoenix_live_view JavaScript files, focusing on better handling of locked references and form element updates. This includes the introduction of an ElementRef class for cleaner, more maintainable code. 🔧

  • Bugfix: A little tweak to the documentation for the :for attribute in EEx templates. We've removed an unnecessary trailing character to make sure everything looks just right. Because even the smallest details matter! 📚

These updates are designed to enhance your development experience, making it more intuitive, efficient, and fun. Keep building awesome apps with Phoenix LiveView! 🌟

Included Commits

2025-04-11T09:13:41 See commit

This commit addresses a minor formatting issue in the documentation for the :for attribute used in EEx (Embedded Elixir) templates. Specifically, it modifies the examples in the guides/server/assigns-eex.md file to correct the syntax by removing an unnecessary trailing character in the :for attribute syntax.

The changes involve updating two instances of the code examples to ensure clarity and correctness for users referencing the documentation. The corrected examples demonstrate how to properly utilize the :for attribute in a heex template when iterating over a collection of posts, ultimately enhancing the readability and accuracy of the documentation.

Files changed

  • guides/server/assigns-eex.md
2025-04-16T15:35:46 See commit

The commit addresses an issue related to the handling of flash messages when a fallback redirect occurs in the Phoenix LiveView framework. Specifically, it ensures that the flash message is preserved and copied during a redirect situation when the system encounters an unauthorized or stale response. This change is implemented by modifying the onRedirect method to include the flash message in the redirect parameters. Additionally, the commit introduces an end-to-end (e2e) test to verify that the flash messages persist correctly across multiple navigation events, ensuring a seamless user experience.

Alongside the functional changes, new modules for the e2e tests are created, which simulate navigating between different LiveView components while maintaining the flash message state. The test cases validate that the flash messages display correctly as users navigate through the application, reinforcing the robustness of the implementation. Overall, these changes enhance the reliability of flash messaging in the application and provide a comprehensive testing framework to catch potential regressions in future updates.

Files changed

  • assets/js/phoenix_live_view/view.js
  • test/e2e/support/issues/issue_3686.ex
  • test/e2e/test_helper.exs
  • test/e2e/tests/issues/3686.spec.js
2025-04-16T15:37:31 See commit

This commit involves updates to the phoenix_live_view JavaScript files, specifically modifying the behavior of elements with the PHX_REF_SRC attribute. The changes primarily focus on handling locked references and ensuring that updates to form elements, particularly upload inputs, are managed correctly. The logic has been streamlined by introducing an ElementRef class to better encapsulate the reference handling, which enhances clarity and maintainability.

In addition to the main logic changes, the commit includes modifications to the associated source maps and minified versions of the JavaScript files. Overall, the updates aim to improve the robustness of the DOM patching process within the Phoenix LiveView framework, ensuring that element updates are performed accurately while respecting the locking mechanism. The commit reflects a net addition of 16 lines and a reduction of 13 lines across several files, indicating a refinement of the existing code.

Files changed

  • priv/static/phoenix_live_view.cjs.js
  • priv/static/phoenix_live_view.cjs.js.map
  • priv/static/phoenix_live_view.esm.js
  • priv/static/phoenix_live_view.esm.js.map
  • priv/static/phoenix_live_view.js
  • priv/static/phoenix_live_view.min.js
2025-04-16T15:38:02 See commit

This commit enhances the functionality of the used_input? method in the Phoenix.Component module by allowing structs to be accepted as parameter values. The logic within the method was modified to ensure that when a parameter is a struct, it is correctly evaluated without being treated as a map. Specifically, the changes include adding a guard clause that checks if the nested parameter is not a struct, which enables the method to handle both maps and structs effectively.

Additionally, the commit includes updates to the test suite in phoenix_component_test.exs to verify the new behavior. New assertions were added to confirm that the used_input? method correctly identifies when a struct is present among the parameters. This change addresses issue #3757, improving the robustness of the component's input handling.

Files changed

  • lib/phoenix_component.ex
  • test/phoenix_component_test.exs
2025-04-16T16:57:34 See commit

This commit enhances the functionality of the liveSocket.js() in the Phoenix LiveView framework by exposing JavaScript commands, specifically adding the navigate, patch, and push commands. The modifications include updates to several files, such as hooks.js, live_socket.js, and view_hook.js, to integrate these new commands into the existing architecture.

Additionally, the commit includes the introduction of tests for the liveSocket.js() functionality to ensure the reliability of the new commands. The testing framework has been updated to utilize runAllTimers where applicable, improving the testing process. Overall, this commit aims to expand the capabilities of LiveView by providing developers with more control over client-side interactions.

Files changed

  • assets/js/phoenix_live_view/hooks.js
  • assets/js/phoenix_live_view/js_commands.js
  • assets/js/phoenix_live_view/live_socket.js
  • assets/js/phoenix_live_view/view_hook.js
  • assets/test/js_test.js
  • assets/test/live_socket_test.js
2025-04-17T08:40:59 See commit

This commit addresses an issue in the Phoenix LiveView framework by ensuring that "sticky" LiveViews remain active during navigation events triggered by the push_navigate function. Previously, these LiveViews would shut down, disrupting user interactions. The changes made in the code allow the framework to identify when a LiveView is marked as sticky and prevents it from being shut down during navigation, thereby improving the user experience. This fix resolves issues #3612 and #3424, both related to the behavior of sticky LiveViews.

In addition to the main code modifications, which include updates to various files such as view.js, channel.ex, and socket.ex, the commit also introduces new tests to validate the expected behavior of sticky LiveViews during navigation. The tests ensure that users can navigate between pages without losing the state of the sticky LiveView, confirming that the implementation behaves as intended. Overall, this commit enhances the robustness of the LiveView framework by addressing specific navigation-related issues.

Files changed

  • assets/js/phoenix_live_view/view.js
  • assets/test/view_test.js
  • lib/phoenix_live_view/channel.ex
  • lib/phoenix_live_view/socket.ex
  • lib/phoenix_live_view/static.ex
  • test/e2e/support/issues/issue_3612.ex
  • test/e2e/test_helper.exs
  • test/e2e/tests/issues/3612.spec.js