Turbo Frame + Nginx Cache + data-action-advance

[eduardolagares]

Ola

I'm trying to use the http/nginx cache in my application and I came across the following problem.
I noticed that when loading a Frame, turbo adds the Turbo-Frame header: frame-name. This makes sense because I need to check in rails whether I am in a request called by a Frame or not. So far so good, the problem is that now I have 2 responses for the same request.

Ex:

passwords/new -> (directly called) is rendered by layouts/application
passwords/new -> (called by a turbo frame) is rendered by layouts/turbo_rails/frame

The problem here is that for nginx the path is always passwords/new and it is impossible to cache this route because at times nginx will deliver the same content to both.

In the same way that turbo adds the Turbo-Frame, I would like to add an extra parameter to this url. To do this I used the code below:

document.addEventListener("turbo:before-fetch-request", (event) => {
  event.detail.url.searchParams.append('turbo', 'frame')
})

This caused the Frame request to be sent with an extra parameter, temporarily solving the cache problem.

Now my main problem is that in links with data-action="advance" the url that is applied in the browser is passwords/new?turbo=frame, completely breaking the cache because this route is a partial render and not a complete render

Has anyone here used Turbo Frame with nginx cache and found a solution to this problem? I tried to intercept the url change in the browser in several ways but without success.

In summary, I need:

Browser load sessions/new
User click in a link frame link to passwords/new 
Frame is load with passwords/new?turbo=frame
Browser url is changed to passwords/new (without turbo=frame)