Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Persist visit options loads same page #224

Open
davekaro opened this issue Aug 13, 2024 · 1 comment
Open

Persist visit options loads same page #224

davekaro opened this issue Aug 13, 2024 · 1 comment

Comments

@davekaro
Copy link

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>
@davekaro
Copy link
Author

#225 fixes this

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Development

No branches or pull requests

1 participant