10

THIS IS A COMPANION TO https://github.com/hotwired/turbo-rails/issues/122

REPRODUCTION APP CODE: https://github.com/jasonfb/TR001

Using Rails 6.1.3

Devise 4.7.3

Turbo Rails 0.5.9


Symptom 1:
-- using Turbo-Rails + Devise

When I click "Log In", the form submits but the page does not reload.

Step 1: go to

/users/sign_in

Enter a good username & password (you can sign up or make one on the command line)

enter image description here

Click "Sign In"

enter image description here

on the back end the request WAS processed and even redirected, but the redirect did not happen on the front end. You (the user) ARE actually logged in even though your page is hanging and did not redirect.

enter image description here

Result: Page hangs. Expected result: Turbo Rails redirect correctly


Symptom 2

When I click "Log Out", the page does nothing. on the backend I am actually logged out, but the page does not change. If I reload, I see that I am now logged out

Step 1: be logged in

Step 2: Click to "log out" enter image description here

Notice that the button stays 'grey' (clicked), the request is processed on the back end:

enter image description here

Result: Page hangs

Expected result: Page directs after the user is logged out

The user IS ACTUALLY logged out, but the page hangs and does not redirect.

Jason FB
  • 4,752
  • 3
  • 38
  • 69

1 Answers1

17

This has been fixed on the Devise main branch, but as of 2021-12-29 there is not a released version of Devise for Rails 7. If you want to use the latest main branch of Devise from Github, this problem should not affect you.

TEMPORARY WORKAROUND:

override the devise form (use rails generate devise:views generating your own custom views

then you will edit the registrations/new and sessions/new modifying both like so:

form_for(resource, as: resource_name, url: session_path(resource_name) ) do |f|

change it to

form_for(resource, as: resource_name, html: {'data-turbo' => "false"}, url: session_path(resource_name) ) do |f|

this tells Devise to fall back to non-Turbo interaction for the log-in and registration.

For your Logout links use Rails button_to instead of link_to and the symptom goes away. note: recommend as a temporary fix until the root cause is addressed

Again, button_to for LOGGING OUT must be like so:

, method: :delete, 'data-turbo': false

alternatively, a nested syntax like data: { turbo: false } should also work for either form_for or button_to

Jason FB
  • 4,752
  • 3
  • 38
  • 69
  • button_to didn't work in my case. – DinhNgocHien Nov 23 '21 at 14:57
  • maybe the button_to wasn't producing a form with a POST method? it's because logout should be treated as non-idempotent, which means it must be a POST and not a GET, or else you see the symptom. – Jason FB Nov 24 '21 at 14:53
  • fixed by adding this to button: `form: { "data-turbo" => "false" }`, issue may come from tubo rails. – DinhNgocHien Nov 24 '21 at 15:21
  • I see the PR hasn't been merged yet so I'm trying to disable Turbo on my Devise forms like you have in the above answer but even that doesn't seem to stop them from `Processing by Devise::RegistrationsController#create as TURBO_STREAM`. Was there something else that you changed in addition to adding `html: {'data-turbo' => "false"}` to the `form_for` tags? – mg87 Nov 26 '21 at 13:52
  • @mg87 I did it today and it works correctly, you need to make sure that the position of HTML key is correctly, this is mine: `<%= form_for(resource, as: resource_name, url: session_path(resource_name), html: { class: 'space-y-6', data: { turbo: false } }) do |f| %>` – alexventuraio Dec 28 '21 at 03:15
  • button_to has a really funky 4-parameters input. Read the docs of the 4 parameters carefully. Parameters 2 and 3 are optional, but parameter 2 cannot be omitted without parameter 3. it's rather confusing so I always have to check my HTML output to confirm I've done it right. – Jason FB Dec 29 '21 at 15:25