1

I rebuilt this Cookie Consent Tutorial with Turbo Frame and it has some weird behaviour to it that I can't understand.

On the home & sign in page (therefore pages, where the user is not logged in) "Content Missing" is rendered even though I can see the turbo-frame-tag (<turbo-frame id="cookie_consent") being present in the DOM. The source attribute is set to the sign_in route though, why is that the case?

<turbo-frame id="cookie_consent" src="http://localhost:3000/users/sign_in" complete="">
  <strong class="turbo-frame-error">Content missing</strong>
</turbo-frame>

The console prints this error:

Uncaught (in promise) Error: The response (200) did not contain the expected <turbo-frame id="cookie_consent"> and will be ignored. To perform a full page visit instead, set turbo-visit-control to reload.

Instead, I want the cookie banner to be displayed. Then, when the user logs in successfully, they are being redirected to the /cookies route (index action) and the banner is shown twice. Whats going on here?

application.html.erb

<body>
    <%= render 'shared/flashes' %>
    <%= render 'shared/header' %>

    <%= yield %>
    <%= turbo_frame_tag :cookie_consent, src: cookies_path if session[:cookies_consent].nil? %>

    <%= render 'shared/footer' %>
  </body>

routes.rb

 get 'cookies', to: 'cookies#index'
 post 'cookies/consent', to: 'cookies#consent', as: 'cookie_consent'

cookies/index.html.erb

<%= turbo_frame_tag :cookie_consent do %>
    <% if session[:cookie_consent].nil? %>
        <div class="cookies" data-controller="cookies" data-cookies-target="banner">
            <p>We use essential cookies to make our site work. By clicking 'Ok', you agree to our website's cookie use as described in our <%= link_to 'Cookie Policy', privacy_path %>.
            <%= button_to 'OK',
                    cookie_consent_path(consent: true),
                    method: :post,
                    class: 'cookies__button',
                    data: { action: 'click->cookies#closeBanner' } %>
        </div>
    <% end %>
<% end %>

cookies_controller.rb

class CookiesController < ApplicationController
  def index
    session[:cookie_consent] = nil
  end

  def consent
    session[:cookie_consent] = params[:consent].presence
    render turbo_stream: turbo_stream.remove(:cookie_consent)
  end
end
Lisbeth Purrucker
  • 27
  • 7
  • Following this article [link](https://www.colby.so/posts/turbo-frames-on-rails), my src attribute should not be populated the way it is. Frames can also receive an src attribute. When src is supplied (in my case cookies_path), the frame will be populated after the initial page load via a separate HTTP request to the frame’s src (the DOM falsely shows the route '/users/sign_in'). The page will initially load the frame with the placeholder div and then immediately a request to cookies_path endpoint is made and the content of the Turbo Frame is replaced with the response from the server. – Lisbeth Purrucker Mar 21 '23 at 14:49
  • if you have `before_action :authenticate_user!` in *ApplicationController* that would redirect `/cookies` request to `/users/sign_in`. also should be singular `:cookie_consent`: `session[:cookies_consent].nil?` – Alex Mar 22 '23 at 02:08
  • hey alex, thanks! i fixed my typo.. but commenting out authenticate_user! didn't change the value of the src attribute, unfortunately. I am still confronted with the same errors. – Lisbeth Purrucker Mar 22 '23 at 12:39
  • can you show the logs from where `/cookies` request begins. it should show a redirect or another request. – Alex Mar 22 '23 at 15:29

0 Answers0