Skip to content

Commit 3d04f5d

Browse files
MichaelWest22MichaelWest22
committed
Add event testing for updated events
1 parent 95a981b commit 3d04f5d

1 file changed

Lines changed: 147 additions & 0 deletions

File tree

‎test/core/events.js‎

Lines changed: 147 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
describe('Core htmx Events', function() {
2+
var HTMX_HISTORY_CACHE_NAME = 'htmx-history-cache'
23
beforeEach(function() {
34
this.server = makeServer()
45
clearWorkArea()
@@ -738,4 +739,150 @@ describe('Core htmx Events', function() {
738739
htmx.off('htmx:afterSwap', afterSwapHandler)
739740
}
740741
})
742+
743+
it('preventDefault() in htmx:historyCacheMiss stops the history request', function() {
744+
localStorage.removeItem(HTMX_HISTORY_CACHE_NAME)
745+
var handler = htmx.on('htmx:historyCacheMiss', function(evt) {
746+
evt.preventDefault()
747+
})
748+
this.server.respondWith('GET', '/test1', '<div id="d2" hx-push-url="true" hx-get="/test2" hx-swap="outerHTML settle:0">test1</div>')
749+
this.server.respondWith('GET', '/test2', '<div id="d3" hx-push-url="true" hx-get="/test3" hx-swap="outerHTML settle:0">test2</div>')
750+
751+
make('<div id="d1" hx-push-url="true" hx-get="/test1" hx-swap="outerHTML settle:0">init</div>')
752+
753+
try {
754+
byId('d1').click()
755+
this.server.respond()
756+
var workArea = getWorkArea()
757+
workArea.textContent.should.equal('test1')
758+
759+
byId('d2').click()
760+
this.server.respond()
761+
workArea.textContent.should.equal('test2')
762+
763+
localStorage.removeItem(HTMX_HISTORY_CACHE_NAME) // clear cache
764+
htmx._('restoreHistory')('/test1')
765+
this.server.respond()
766+
getWorkArea().textContent.should.equal('test2')
767+
} finally {
768+
htmx.off('htmx:historyCacheMiss', handler)
769+
}
770+
})
771+
772+
it('htmx:historyCacheMissLoad event can update history swap', function() {
773+
localStorage.removeItem(HTMX_HISTORY_CACHE_NAME)
774+
var handler = htmx.on('htmx:historyCacheMissLoad', function(evt) {
775+
evt.detail.historyElement = byId('hist-re-target')
776+
evt.detail.swapSpec.swapStyle = 'outerHTML'
777+
evt.detail.response = '<div id="hist-re-target">Updated<div>'
778+
evt.detail.path = '/test3'
779+
})
780+
this.server.respondWith('GET', '/test1', '<div id="d2" hx-push-url="true" hx-get="/test2" hx-swap="outerHTML settle:0">test1</div>')
781+
this.server.respondWith('GET', '/test2', '<div id="d3" hx-push-url="true" hx-get="/test3" hx-swap="outerHTML settle:0">test2</div>')
782+
783+
make('<div id="d1" hx-push-url="true" hx-get="/test1" hx-swap="outerHTML settle:0">init</div>')
784+
make('<div id="hist-re-target"></div>')
785+
786+
try {
787+
byId('d1').click()
788+
this.server.respond()
789+
var workArea = getWorkArea()
790+
workArea.textContent.should.equal('test1')
791+
792+
byId('d2').click()
793+
this.server.respond()
794+
workArea.textContent.should.equal('test2')
795+
796+
localStorage.removeItem(HTMX_HISTORY_CACHE_NAME) // clear cache
797+
htmx._('restoreHistory')('/test1')
798+
this.server.respond()
799+
getWorkArea().textContent.should.equal('test2Updated')
800+
byId('hist-re-target').textContent.should.equal('Updated')
801+
htmx._('currentPathForHistory').should.equal('/test3')
802+
} finally {
803+
htmx.off('htmx:historyCacheMissLoad', handler)
804+
}
805+
})
806+
807+
it('htmx:historyCacheMiss event can set custom request headers', function() {
808+
localStorage.removeItem(HTMX_HISTORY_CACHE_NAME)
809+
var handler = htmx.on('htmx:historyCacheMiss', function(evt) {
810+
evt.detail.xhr.setRequestHeader('CustomHeader', 'true')
811+
})
812+
this.server.respondWith('GET', '/test1', function(xhr) {
813+
should.equal(xhr.requestHeaders.CustomHeader, 'true')
814+
xhr.respond(200, {}, '<div id="d2" hx-push-url="true" hx-get="/test2" hx-swap="outerHTML settle:0">test1</div>')
815+
})
816+
make('<div id="d1" hx-push-url="true" hx-get="/test1" hx-swap="outerHTML settle:0">init</div>')
817+
818+
try {
819+
localStorage.removeItem(HTMX_HISTORY_CACHE_NAME) // clear cache
820+
htmx._('restoreHistory')('/test1')
821+
this.server.respond()
822+
getWorkArea().textContent.should.equal('test1')
823+
} finally {
824+
htmx.off('htmx:historyCacheMiss', handler)
825+
}
826+
})
827+
828+
it('preventDefault() in htmx:historyCacheHit stops the history action', function() {
829+
localStorage.removeItem(HTMX_HISTORY_CACHE_NAME)
830+
var handler = htmx.on('htmx:historyCacheHit', function(evt) {
831+
evt.preventDefault()
832+
})
833+
this.server.respondWith('GET', '/test1', '<div id="d2" hx-push-url="true" hx-get="/test2" hx-swap="outerHTML settle:0">test1</div>')
834+
this.server.respondWith('GET', '/test2', '<div id="d3" hx-push-url="true" hx-get="/test3" hx-swap="outerHTML settle:0">test2</div>')
835+
836+
make('<div id="d1" hx-push-url="true" hx-get="/test1" hx-swap="outerHTML settle:0">init</div>')
837+
838+
try {
839+
byId('d1').click()
840+
this.server.respond()
841+
var workArea = getWorkArea()
842+
workArea.textContent.should.equal('test1')
843+
844+
byId('d2').click()
845+
this.server.respond()
846+
workArea.textContent.should.equal('test2')
847+
848+
htmx._('restoreHistory')('/test1')
849+
getWorkArea().textContent.should.equal('test2')
850+
} finally {
851+
htmx.off('htmx:historyCacheHit', handler)
852+
}
853+
})
854+
855+
it('htmx:historyCacheHit event can update history swap', function() {
856+
localStorage.removeItem(HTMX_HISTORY_CACHE_NAME)
857+
var handler = htmx.on('htmx:historyCacheHit', function(evt) {
858+
evt.detail.historyElement = byId('hist-re-target')
859+
evt.detail.swapSpec.swapStyle = 'outerHTML'
860+
evt.detail.item.content = '<div id="hist-re-target">Updated<div>'
861+
evt.detail.path = '/test3'
862+
})
863+
this.server.respondWith('GET', '/test1', '<div id="d2" hx-push-url="true" hx-get="/test2" hx-swap="outerHTML settle:0">test1</div>')
864+
this.server.respondWith('GET', '/test2', '<div id="d3" hx-push-url="true" hx-get="/test3" hx-swap="outerHTML settle:0">test2</div>')
865+
866+
make('<div id="d1" hx-push-url="true" hx-get="/test1" hx-swap="outerHTML settle:0">init</div>')
867+
make('<div id="hist-re-target"></div>')
868+
869+
try {
870+
byId('d1').click()
871+
this.server.respond()
872+
var workArea = getWorkArea()
873+
workArea.textContent.should.equal('test1')
874+
875+
byId('d2').click()
876+
this.server.respond()
877+
workArea.textContent.should.equal('test2')
878+
879+
htmx._('restoreHistory')('/test1')
880+
this.server.respond()
881+
getWorkArea().textContent.should.equal('test2Updated')
882+
byId('hist-re-target').textContent.should.equal('Updated')
883+
htmx._('currentPathForHistory').should.equal('/test3')
884+
} finally {
885+
htmx.off('htmx:historyCacheHit', handler)
886+
}
887+
})
741888
})

0 commit comments

Comments
 (0)