hx-get with hx-target causes Duplicate Tab in browser to only load last fetched content when no cache headers are emitted by backend

[fearofcode]

I have the beginning of a small app with a few links. They have hx-get annotations to insert their responses into a content section like:

<ul>
<li><a hx-get="/register" hx-target=".content">Register</a></li>
<li><a hx-get="/login" hx-target=".content">Log in</a></li>
</ul>

...

<section class="content">
</section>

My backend detects HTMX requests by looking for the HX-Request header and, when it's detected, only returns the content that needs to be swapped out. If it's not an HTMX request, however, it returns a full template. That way, going to /register loads the whole page fine, and clicking the /register link swaps out the content with the backend response as intended. If the header is present, the backend adds a HX-Push response header with the correct respective URL to push to history.

The problem is that if I do the following:

• Open the app
• Click the Register or Login links in my app
• Right click the browser tab and click Duplicate Tab

Then only the part that is being swapped out in the content section is being loaded. I.e., you only get a template fragment saying <h2>Hello from the register.html template</h2> rather than the full registration page the way I was expecting.

I can provide a repo URL if would help. Other operations, like refreshing, back, forward, etc. work.

I'm probably doing something wrong since I'm new to HTMX so sorry if that's the case.

[fearofcode]

I tried this with both latest Firefox and latest Chrome on Windows 10.

[fearofcode]

If I add headers to the backend to not cache the response, this stops happening.

Is it expected practice not to cache server-side responses in order to stop such issues from occurring?

[fearofcode]

This looks like it's a duplicate of #421. Closing so I don't waste anyone's time.

[fearofcode]

So, I think the main options are:

• Don't cache HTMX request responses
• Use separate URLs for full responses and partial responses

I guess I didn't understand that Duplicate Tab duplicates the current tab from cache where possible and that a cached HTMX response of a URL /foo would cause duplicating the tab when at the URL /foo to just load the HTMX fragment rather than the whole page. I feel kind of silly now.