proxy window.location for testing and extension overrides (#3283)

* proxy window.location for testing and extension overrides

* when not whe in test name

Author: MichaelWest22

src/htmx.js

@@ -275,6 +275,11 @@ var htmx = (function() {
     },
     /** @type {typeof parseInterval} */
     parseInterval: null,
+    /**
+     * proxy of window.location used for page reload functions
+     * @type location
+     */
+    location,
     /** @type {typeof internalEval} */
     _: null,
     version: '2.0.4'
@@ -2359,7 +2364,7 @@ var htmx = (function() {
         if (path == null || path === '') {
           // if there is no action attribute on the form set path to current href before the
           // following logic to properly clear parameters on a GET (not on a POST!)
-          path = getDocument().location.href
+          path = location.href
         }
         if (verb === 'get' && path.includes('?')) {
           path = path.replace(/\?[^#]+/, '')
@@ -3186,7 +3191,7 @@ var htmx = (function() {
       saveToHistoryCache(path, elt)
     }
 
-    if (htmx.config.historyEnabled) history.replaceState({ htmx: true }, getDocument().title, window.location.href)
+    if (htmx.config.historyEnabled) history.replaceState({ htmx: true }, getDocument().title, location.href)
   }
 
   /**
@@ -3233,7 +3238,7 @@ var htmx = (function() {
     request.open('GET', path, true)
     request.setRequestHeader('HX-Request', 'true')
     request.setRequestHeader('HX-History-Restore-Request', 'true')
-    request.setRequestHeader('HX-Current-URL', getDocument().location.href)
+    request.setRequestHeader('HX-Current-URL', location.href)
     request.onload = function() {
       if (this.status >= 200 && this.status < 400) {
         triggerEvent(getDocument().body, 'htmx:historyCacheMissLoad', details)
@@ -3282,7 +3287,7 @@ var htmx = (function() {
       if (htmx.config.refreshOnHistoryMiss) {
         // @ts-ignore: optional parameter in reload() function throws error
         // noinspection JSUnresolvedReference
-        window.location.reload(true)
+        htmx.location.reload(true)
       } else {
         loadHistoryFromServer(path)
       }
@@ -3614,7 +3619,7 @@ var htmx = (function() {
       'HX-Trigger': getRawAttribute(elt, 'id'),
       'HX-Trigger-Name': getRawAttribute(elt, 'name'),
       'HX-Target': getAttributeValue(target, 'id'),
-      'HX-Current-URL': getDocument().location.href
+      'HX-Current-URL': location.href
     }
     getValuesForElement(elt, 'hx-headers', false, headers)
     if (prompt !== undefined) {
@@ -4359,7 +4364,7 @@ var htmx = (function() {
 
     // behavior of anchors w/ empty href is to use the current URL
     if (path == null || path === '') {
-      path = getDocument().location.href
+      path = location.href
     }
 
     /**
@@ -4723,14 +4728,14 @@ var htmx = (function() {
 
     if (hasHeader(xhr, /HX-Redirect:/i)) {
       responseInfo.keepIndicators = true
-      location.href = xhr.getResponseHeader('HX-Redirect')
-      shouldRefresh && location.reload()
+      htmx.location.href = xhr.getResponseHeader('HX-Redirect')
+      shouldRefresh && htmx.location.reload()
       return
     }
 
     if (shouldRefresh) {
       responseInfo.keepIndicators = true
-      location.reload()
+      htmx.location.reload()
       return
     }
 

test/attributes/hx-push-url.js

@@ -136,6 +136,17 @@ describe('hx-push-url attribute', function() {
     getWorkArea().textContent.should.equal('test1')
   })
 
+  it('cache miss should refresh when refreshOnHistoryMiss true', function() {
+    htmx.config.refreshOnHistoryMiss = true
+    var refresh = false
+    htmx.location = { reload: function() { refresh = true } }
+    localStorage.removeItem(HTMX_HISTORY_CACHE_NAME) // clear cache
+    htmx._('restoreHistory')('/test3')
+    refresh.should.equal(true)
+    htmx.location = window.location
+    htmx.config.refreshOnHistoryMiss = false
+  })
+
   it('navigation should push an element into the cache  w/ data-* prefix', function() {
     this.server.respondWith('GET', '/test', 'second')
     getWorkArea().innerHTML.should.be.equal('')

test/core/headers.js

@@ -380,6 +380,27 @@ describe('Core htmx AJAX headers', function() {
     }, 30)
   })
 
+  it('should refresh page on HX-Refresh', function() {
+    var refresh = false
+    htmx.location = { reload: function() { refresh = true } }
+    this.server.respondWith('GET', '/test', [200, { 'HX-Refresh': 'true' }, ''])
+    var div = make('<div id="testdiv" hx-trigger="click" hx-get="/test"></div>')
+    div.click()
+    this.server.respond()
+    refresh.should.equal(true)
+    htmx.location = window.location
+  })
+
+  it('should update location.href on HX-Redirect', function() {
+    htmx.location = { href: window.location.href }
+    this.server.respondWith('GET', '/test', [200, { 'HX-Redirect': 'https://htmx.org/headers/hx-redirect/' }, ''])
+    var div = make('<div id="testdiv" hx-trigger="click" hx-get="/test"></div>')
+    div.click()
+    this.server.respond()
+    htmx.location.href.should.equal('https://htmx.org/headers/hx-redirect/')
+    htmx.location = window.location
+  })
+
   it('request to restore history should include the HX-Request header', function() {
     this.server.respondWith('GET', '/test', function(xhr) {
       xhr.requestHeaders['HX-Request'].should.be.equal('true')