don't shutdown sticky LiveViews on push_navigate (#3748)

* don't shutdown sticky LiveViews on push_navigate

Fixes #3612.
Actually fixes #3424.

* adjust test

Author: SteffenDE

assets/js/phoenix_live_view/view.js

@@ -24,6 +24,7 @@ import {
   PHX_ROOT_ID,
   PHX_SESSION,
   PHX_STATIC,
+  PHX_STICKY,
   PHX_TRACK_STATIC,
   PHX_TRACK_UPLOADS,
   PHX_UPDATE,
@@ -181,6 +182,7 @@ export default class View {
         session: this.getSession(),
         static: this.getStatic(),
         flash: this.flash,
+        sticky: this.el.hasAttribute(PHX_STICKY)
       }
     })
   }

assets/test/view_test.js

@@ -841,8 +841,8 @@ describe("View", function(){
     stubChannel(view)
 
     expect(view.channel.params()).toEqual({
-      "flash": undefined, "params": {"_mounts": 0, "_mount_attempts": 0, "_live_referrer": undefined},
-      "session": "abc123", "static": null, "url": undefined, "redirect": undefined}
+      "flash": undefined, "params": {"_mounts": 0, "_mount_attempts": 0, "_live_referer": undefined},
+      "session": "abc123", "static": null, "url": undefined, "redirect": undefined, "sticky": false}
     )
 
     el.innerHTML += "<link rel=\"stylesheet\" href=\"/css/app-123.css?vsn=d\" phx-track-static=\"\">"
@@ -856,12 +856,13 @@ describe("View", function(){
       "params": {
         "_mounts": 0,
         "_mount_attempts": 1,
-        "_live_referrer": undefined,
+        "_live_referer": undefined,
         "_track_static": [
           "http://localhost/css/app-123.css?vsn=d",
           "http://localhost/img/tracked.png",
         ]
-      }
+      },
+      "sticky": false
     })
   })
 })

lib/phoenix_live_view/channel.ex

@@ -877,7 +877,13 @@ defmodule Phoenix.LiveView.Channel do
         new_state
         |> push_pending_events_on_redirect(new_socket)
         |> push_live_redirect(opts, ref)
-        |> stop_shutdown_redirect(:live_redirect, opts)
+        |> then(fn state ->
+          if new_socket.sticky? do
+            {:noreply, drop_redirect(state)}
+          else
+            stop_shutdown_redirect(state, :live_redirect, opts)
+          end
+        end)
 
       {:live, :patch, %{to: _to, kind: _kind} = opts} when root_pid == self() ->
         {params, action} = patch_params_and_action!(new_socket, opts)
@@ -1178,7 +1184,8 @@ defmodule Phoenix.LiveView.Channel do
       parent_pid: parent,
       root_pid: root_pid || self(),
       id: id,
-      router: router
+      router: router,
+      sticky?: params["sticky"]
     }
 
     {params, host_uri, action} =

lib/phoenix_live_view/socket.ex

@@ -56,7 +56,8 @@ defmodule Phoenix.LiveView.Socket do
              :parent_pid,
              :root_pid,
              :assigns,
-             :transport_pid
+             :transport_pid,
+             :sticky?
            ]}
 
   defstruct id: nil,
@@ -69,7 +70,8 @@ defmodule Phoenix.LiveView.Socket do
             private: %{live_temp: %{}},
             redirected: nil,
             host_uri: nil,
-            transport_pid: nil
+            transport_pid: nil,
+            sticky?: false
 
   @typedoc "Struct returned when `assigns` is not in the socket."
   @opaque assigns_not_in_socket :: Phoenix.LiveView.Socket.AssignsNotInSocket.t()

lib/phoenix_live_view/static.ex

@@ -210,6 +210,7 @@ defmodule Phoenix.LiveView.Static do
           endpoint: endpoint,
           root_pid: if(sticky?, do: nil, else: parent.root_pid),
           parent_pid: if(sticky?, do: nil, else: self()),
+          sticky?: sticky?,
           router: parent.router
         },
         %{

test/e2e/support/issues/issue_3612.ex

@@ -0,0 +1,64 @@
+defmodule Phoenix.LiveViewTest.E2E.Issue3612.ALive do
+  # https://github.com/phoenixframework/phoenix_live_view/issues/3612
+
+  use Phoenix.LiveView
+
+  def mount(_params, _session, socket) do
+    {:ok, socket}
+  end
+
+  def render(assigns) do
+    ~H"""
+    {live_render(@socket, Phoenix.LiveViewTest.E2E.Issue3612.StickyLive,
+      id: "sticky",
+      sticky: true
+    )}
+
+    <h1>Page A</h1>
+    """
+  end
+end
+
+defmodule Phoenix.LiveViewTest.E2E.Issue3612.BLive do
+  use Phoenix.LiveView
+
+  def mount(_params, _session, socket) do
+    {:ok, socket}
+  end
+
+  def render(assigns) do
+    ~H"""
+    {live_render(@socket, Phoenix.LiveViewTest.E2E.Issue3612.StickyLive,
+      id: "sticky",
+      sticky: true
+    )}
+
+    <h1>Page B</h1>
+    """
+  end
+end
+
+defmodule Phoenix.LiveViewTest.E2E.Issue3612.StickyLive do
+  use Phoenix.LiveView
+
+  def mount(:not_mounted_at_router, _session, socket) do
+    {:ok, socket, layout: false}
+  end
+
+  def render(assigns) do
+    ~H"""
+    <div>
+      <.link phx-click="navigate_to_a">Go to page A</.link>
+      <.link phx-click="navigate_to_b">Go to page B</.link>
+    </div>
+    """
+  end
+
+  def handle_event("navigate_to_a", _params, socket) do
+    {:noreply, push_navigate(socket, to: "/issues/3612/a")}
+  end
+
+  def handle_event("navigate_to_b", _params, socket) do
+    {:noreply, push_navigate(socket, to: "/issues/3612/b")}
+  end
+end

test/e2e/test_helper.exs

@@ -160,6 +160,8 @@ defmodule Phoenix.LiveViewTest.E2E.Router do
       live "/3496/a", Issue3496.ALive
       live "/3496/b", Issue3496.BLive
       live "/3529", Issue3529Live
+      live "/3612/a", Issue3612.ALive
+      live "/3612/b", Issue3612.BLive
       live "/3651", Issue3651Live
       live "/3656", Issue3656Live
       live "/3658", Issue3658Live

test/e2e/tests/issues/3612.spec.js

@@ -0,0 +1,15 @@
+const {test, expect} = require("../../test-fixtures")
+const {syncLV} = require("../../utils")
+
+// https://github.com/phoenixframework/phoenix_live_view/issues/3612
+test("sticky LiveView stays connected when using push_navigate", async ({page}) => {
+  await page.goto("/issues/3612/a")
+  await syncLV(page)
+  await expect(page.locator("h1")).toHaveText("Page A")
+  await page.getByRole("link", {name: "Go to page B"}).click()
+  await syncLV(page)
+  await expect(page.locator("h1")).toHaveText("Page B")
+  await page.getByRole("link", {name: "Go to page A"}).click()
+  await syncLV(page)
+  await expect(page.locator("h1")).toHaveText("Page A")
+})