From 5ba562cfa50de6dbddae4d7bce67cbfa92930010 Mon Sep 17 00:00:00 2001
From: adamjhf <git@freeth.dev>
Date: Sat, 18 Oct 2025 09:35:20 +1100
Subject: [PATCH] fix(loading-states): prevent triggering loading-states on
 preloaded requests

---
 src/loading-states/loading-states.js          |  3 ++-
 src/loading-states/test/ext/loading-states.js | 20 +++++++++++++++++++
 src/loading-states/test/index.html            |  1 +
 3 files changed, 23 insertions(+), 1 deletion(-)

diff --git a/src/loading-states/loading-states.js b/src/loading-states/loading-states.js
index f824b32..b1f49da 100644
--- a/src/loading-states/loading-states.js
+++ b/src/loading-states/loading-states.js
@@ -61,7 +61,8 @@
 
   htmx.defineExtension('loading-states', {
     onEvent: function(name, evt) {
-      if (name === 'htmx:beforeRequest') {
+      if (name === 'htmx:beforeRequest'
+          && evt.detail.requestConfig.headers["HX-Preloaded"] !== "true") {
         const container = loadingStateContainer(evt.target)
 
         const loadingStateTypes = [
diff --git a/src/loading-states/test/ext/loading-states.js b/src/loading-states/test/ext/loading-states.js
index 9755f29..c797e13 100644
--- a/src/loading-states/test/ext/loading-states.js
+++ b/src/loading-states/test/ext/loading-states.js
@@ -164,4 +164,24 @@ describe('loading states extension', function() {
     var el = byId('d2')
     el.disabled.should.be.false
   })
+
+  it('loading state should not trigger for preloaded request', function() {
+    this.server.respondWith('GET', '/test', 'Loaded!')
+    var container = make('<div hx-ext="loading-states,preload"><button hx-get="/test" preload="mouseover">Hover Me!</button><div data-loading style="display: none;">Loading...</div></div>')
+    var btn = container.querySelector('button')
+    var loader = container.querySelector('[data-loading]')
+    
+    loader.style.display.should.equal('none')
+    
+    htmx.trigger(btn, 'mouseover')
+    this.clock.tick(100)
+    
+    loader.style.display.should.equal('none')
+    
+    this.server.respond()
+    
+    loader.style.display.should.equal('none')
+  })
 })
+
+
diff --git a/src/loading-states/test/index.html b/src/loading-states/test/index.html
index c0cdbdc..d727bc9 100644
--- a/src/loading-states/test/index.html
+++ b/src/loading-states/test/index.html
@@ -53,6 +53,7 @@ <h2>Mocha Test Suite</h2>
 
 <script src="./util.js"></script>
 
+<script src="../../preload/preload.js"></script>
 <script src="../loading-states.js"></script>
 <script src="ext/loading-states.js"></script>