turbo_frame_tag with src and invalid response causing redirect to src

[duffyjp]

When a turbo_frame_tag has a src: attribute, if the response doesn't contain a matching turbo-frame id (or any turbo-frame) shouldn't I be getting the Response has no matching <turbo-frame id="some-frame"> error in the console? Instead I'm redirected to whatever the src: was.

rails new test704
rails g scaffold posts content

<!-- app/views/posts/index.html.erb -->
<h1>Posts</h1>

<%= turbo_frame_tag :post_show, src: post_path(1) do %>
    loading...
<% end %>

<%= link_to "New post", new_post_path %>

Started GET "/posts" for ::1 at 2022-11-22 16:40:14 -0600
Processing by PostsController#index as HTML
  Rendering layout layouts/application.html.erb
  Rendering posts/index.html.erb within layouts/application
  Rendered posts/index.html.erb within layouts/application (Duration: 0.5ms | Allocations: 113)
  Rendered layout layouts/application.html.erb (Duration: 6.1ms | Allocations: 2629)
Completed 200 OK in 8ms (Views: 6.9ms | ActiveRecord: 0.0ms | Allocations: 2961)


Started GET "/posts/1" for ::1 at 2022-11-22 16:40:14 -0600
Processing by PostsController#show as HTML
  Parameters: {"id"=>"1"}
  Post Load (0.1ms)  SELECT "posts".* FROM "posts" WHERE "posts"."id" = ? LIMIT ?  [["id", 1], ["LIMIT", 1]]
  ↳ app/controllers/posts_controller.rb:63:in `set_post'
  Rendering posts/show.html.erb
  Rendered posts/_post.html.erb (Duration: 0.0ms | Allocations: 17)
  Rendered posts/show.html.erb (Duration: 0.5ms | Allocations: 692)
Completed 200 OK in 1ms (Views: 0.6ms | ActiveRecord: 0.1ms | Allocations: 1448)


Started GET "/posts/1" for ::1 at 2022-11-22 16:40:14 -0600
Processing by PostsController#show as HTML
  Parameters: {"id"=>"1"}
  Post Load (0.1ms)  SELECT "posts".* FROM "posts" WHERE "posts"."id" = ? LIMIT ?  [["id", 1], ["LIMIT", 1]]
  ↳ app/controllers/posts_controller.rb:63:in `set_post'
  Rendering layout layouts/application.html.erb
  Rendering posts/show.html.erb within layouts/application
  Rendered posts/_post.html.erb (Duration: 0.0ms | Allocations: 17)
  Rendered posts/show.html.erb within layouts/application (Duration: 0.7ms | Allocations: 682)
  Rendered layout layouts/application.html.erb (Duration: 2.2ms | Allocations: 2895)
Completed 200 OK in 3ms (Views: 2.5ms | ActiveRecord: 0.1ms | Allocations: 3682)

[alexandreruban]

This behavior was changed in hotwired/turbo#445.

Now instead of logging Response has no matching <turbo-frame id="${id}"> element in the console, it triggers a turbo:frame-missing event. Unless this event is intercepted, Turbo Drive will visit the frame's URL as a full-page navigation.

[duffyjp]

@alexandreruban Thanks, I wasn't aware of that change. I think I see the rationale, but it's making development exponentially harder. Do you know of a way to get the old behavior back, at least in development?

I'm using turbo frames to append slides on a carousel, but if a requested slide was invalid for whatever reason it redirects to the invalid URL, which turbo loads the two adjacent slides. And if one of those is invalid... well...

For now I've added an event listener with preventDefault() so no more wild redirects, but no helpful error messages either.

[cabgfx]

I ran into the same issue! Decided to raise a discussion here: #407

I'm looking to fix a similar scenario as yours, @duffyjp, could I ask you to elaborate on this:

For now I've added an event listener with preventDefault() so no more wild redirects

Thanks in advance! 🙏

[duffyjp]

@cabgfx, At the bottom of my application.js I added this:

addEventListener("turbo:frame-missing", (event) => {
  event.preventDefault()
  console.log("TURBO FRAME MISSING");
})

[cabgfx]

@duffyjp thank you!