Skip to content

Persist visit options loads same page #224

@davekaro

Description

@davekaro

After upgrading our app from Turbo Native 7.0.2 to 7.1.0, I noticed some different behavior with forms that redirect to other URLs. What happens is if the new page has links on it, clicking those links just re-renders the current page. If you click again, then the new page is loaded. I tracked it down to this PR when it started happening.

I was able to replicate the issue using the turbo-native-demo fairly easily, you can see the commits or reference the diff below.

Reading the diff in #155, I can see why this new behavior is happening, but I don't understand why I would want this behavior. The PR references fixing some issue with flash alerts, and #186 is referenced too which also mentions issue with flash. In my debugging, I noticed that the code referenced in #186 is in fact still being hit, but on the second visit it picks up the "unprocessed visit options" from #155, so there is no actual second request, but it seems the problem stems from this quote in #186:

Session seems to think this request is the user navigating "backwards",

Is there some other way I should be structuring redirects or handle this issue?

Here are some videos showing the difference:

Before

before.mov

After

after.mov

Diff with my changes to turbo-native-demo that showcases the problem.

diff --git a/server.js b/server.js
index bd40580..8a76812 100644
--- a/server.js
+++ b/server.js
@@ -51,6 +51,14 @@ app.get("/", (request, response) => {
   response.render("index", { title: "Turbo Native Demo", page_class: "index" })
 })

+app.post("/submit_and_redirect", (request, response) => {
+  response.redirect("/submit_redirected");
+})
+
+app.get("/submit_redirected", (request, response) => {
+  response.render("submit_redirected", { title: "Submit redirected" });
+})
+
 app.get("/one", (request, response) => {
   response.render("one", { title: "How’d You Get Here?" })
 })
diff --git a/views/index.ejs b/views/index.ejs
index 6e46ce2..1a73573 100644
--- a/views/index.ejs
+++ b/views/index.ejs
@@ -10,6 +10,9 @@

 <h2 class="actions__header space --top-l">Basic Features</h2>
 <div class="actions grid__item --start-2 --span-10 space --bottom-s">
+  <form action="/submit_and_redirect" method="post">
+    <button type="submit">Submit and redirect to other URL</button>
+  </form>
   <a class="actions__item" href="/one">
     <div class="actions__icon --navigate" aria-hidden="true"></div>
     Navigate to another webpage
diff --git a/views/submit_redirected.ejs b/views/submit_redirected.ejs
new file mode 100644
index 0000000..f7f98d9
--- /dev/null
+++ b/views/submit_redirected.ejs
@@ -0,0 +1,8 @@
+<h1 class="page-title">Redirected</h1>
+<p>This page is the result of a redirect from the server, from a form submission.</p>
+
+<p class="space --bottom-s --top-m">This performs an <code>advance</code> visit:</p>
+<p><a href="/two" class="button@native">Advance to another webpage</a></p>
+
+<p class="space --bottom-s">This performs a <code>replace</code> visit:</p>
+<p><a href="/two?action=replace" class="button@native" data-turbo-action="replace">Replace with another webpage</a></p>

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions