Rails 7 redirect error: An import map is added after module script load was triggered

user_1325849 0
Viewed 308

I have a Rails 7 app. One of my controller actions (logout action), redirects the user to the root_url.

For some reason, upon redirect, I see following error on Chrome's console and the one button (login button) on that page stops working.

turbo.es2017-esm.js:2407 An import map is added after module script load was triggered.

If I expand the error, following is the stack trace:

turbo.es2017-esm.js:2407 An import map is added after module script load was triggered.
assignNewBody @ turbo.es2017-esm.js:2407
(anonymous) @ turbo.es2017-esm.js:2369
preservingPermanentElements @ turbo.es2017-esm.js:961
preservingPermanentElements @ turbo.es2017-esm.js:1039
replaceBody @ turbo.es2017-esm.js:2367
render @ turbo.es2017-esm.js:2342
renderSnapshot @ turbo.es2017-esm.js:892
render @ turbo.es2017-esm.js:862
renderPage @ turbo.es2017-esm.js:2483
(anonymous) @ turbo.es2017-esm.js:1517
render @ turbo.es2017-esm.js:1682
await in render (async)
loadResponse @ turbo.es2017-esm.js:1512
visitRequestCompleted @ turbo.es2017-esm.js:1724
recordResponse @ turbo.es2017-esm.js:1498
simulateRequest @ turbo.es2017-esm.js:1485
issueRequest @ turbo.es2017-esm.js:1475
visitStarted @ turbo.es2017-esm.js:1710
start @ turbo.es2017-esm.js:1436
startVisit @ turbo.es2017-esm.js:2055
visitProposedToLocation @ turbo.es2017-esm.js:1706
visitProposedToLocation @ turbo.es2017-esm.js:2638
proposeVisit @ turbo.es2017-esm.js:2045
formSubmissionSucceededWithResponse @ turbo.es2017-esm.js:2096
await in formSubmissionSucceededWithResponse (async)
requestSucceededWithResponse @ turbo.es2017-esm.js:685
receive @ turbo.es2017-esm.js:450
perform @ turbo.es2017-esm.js:431
await in perform (async)
start @ turbo.es2017-esm.js:644
submitForm @ turbo.es2017-esm.js:2060
formSubmitted @ turbo.es2017-esm.js:2662
Q.submitBubbled @ turbo.es2017-esm.js:1826

document.body.replaceWith(this.newElement); is the line of code where the error happened:

 assignNewBody() {
        if (document.body && this.newElement instanceof HTMLBodyElement) {
            document.body.replaceWith(this.newElement);
        }
        else {
            document.documentElement.appendChild(this.newElement);
        }
    }

Controller action:

def destroy
    log_out

    respond_to do |format|
      format.html {redirect_to root_url, status: 303}
      format.json {render json: {} }
    end
  end

If I refresh the page, the error goes away and the button starts working again.

turbolinks import-maps ruby-on-rails-7
1 Answers

I had following line of code in my application.html.erb which subscribed to updates to the user model:

 <%= turbo_stream_from current_user, "counter" %>

I wrapped this under the condition that current_user is not nil (current_user is nil after logout action):

<% if logged_in? %>
  <%= turbo_stream_from current_user, "counter" %>
<% end %>

Now the error is gone and the login button does not break.

I still don't quite understand the root cause.

user_13258490
Related