search

bigskysoftware / htmx

</> htmx - high power tools for HTML
https://htmx.org
Other
38.19k stars 1.3k forks source link

`hx-boost` duplicates htmx-supplied `<style>` in the head in v1.8.6 and above #1751

Open ALJ opened 1 year ago

ALJ commented 1 year ago

I'm trying out htmx locally on a simple flat-file site. Everything works well, except I've noticed the htmx-supplied <style> tag seem to get duplicated in the <head> on every hx-boosted link. This problem only occurs for me on versions 1.8.6 and above, including the latest 1.9.5.

Here's what my head element looks like after clicking boosted links about ten times. Notice the duplicated style tags that have built up:

image

👉 Thank you so much for making htmx available. It's been great to try a different take on web apps!

lksnmnn commented 1 year ago

I have the same issue. Were you able to resolve it?

andryyy commented 1 year ago

Can you post a minimal example to replicate the issue?

Are you swapping the body? Any OOB swaps?

lksnmnn commented 1 year ago

So for me this was happening using hx-boost and swapping the full body, no oob swaps. I guess it might had to do with me not moving all scripts in the head, which I have read only later about. It over and over added the aos styles there and the aos script was in the body.

However, I now changed it to use the multi-swap extension instead for a more granular swapping experience and everything works like a charm.

ALJ commented 1 year ago

Apologies, as it's a bit time-consuming to disentangle it to see when it does and does not occur. I was able to solve my issue locally by moving my <script src="/dist/index.js"></script> line into the <head> element; it was previously at the bottom of the <body> element.

The original problem seems to appear for me when these two are both true:

The problem goes away for me when either: