itsscb/htmx
1
0
Fork 0
mirror of https://github.com/bigskysoftware/htmx.git synced 2025-09-27 13:01:03 +00:00
Code Issues Packages Projects Releases Wiki Activity

SSE Ext #2225: reinstantiate EventSource listeners upon reconnection logic (#2272)

Browse Source 
* fix(sse): reinstantiate EventSource listeners
upon reconnection logic

refs #2225

* improve initialization logic of SSE on nested elements

---------

Co-authored-by: Denis Palashevskii <palash.denis@outlook.com>
This commit is contained in:
Vladyslav Tkachenko 2024-02-26 00:25:03 +02:00 committed by GitHub
parent 1a8afc3502
commit 21cdfcf17c
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 24 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
src/ext/sse.js
View File

@ -51,7 +51,6 @@ This extension adds support for Server Sent Events to htmx. See /www/extensions
// Try to create EventSources when elements are processed
case "htmx:afterProcessNode":
ensureEventSourceOnElement(evt.target);
registerSSE(evt.target);
}
}
});
@ -112,8 +111,10 @@ This extension adds support for Server Sent Events to htmx. See /www/extensions
* @param {HTMLElement} elt
*/
function registerSSE(elt) {
// Add message handlers for every `sse-swap` attribute
queryAttributeOnThisOrChildren(elt, "sse-swap").forEach(function (child) {
// Find closest existing event source
var sourceElement = api.getClosestMatch(elt, hasEventSource);
var sourceElement = api.getClosestMatch(child, hasEventSource);
if (sourceElement == null) {
// api.triggerErrorEvent(elt, "htmx:noSSESourceError")
return null; // no eventsource in parentage, orphaned element
@ -123,9 +124,6 @@ This extension adds support for Server Sent Events to htmx. See /www/extensions
var internalData = api.getInternalData(sourceElement);
var source = internalData.sseEventSource;
// Add message handlers for every `sse-swap` attribute
queryAttributeOnThisOrChildren(elt, "sse-swap").forEach(function(child) {
var sseSwapAttr = api.getAttributeValue(child, "sse-swap");
if (sseSwapAttr) {
var sseEventNames = sseSwapAttr.split(",");
@ -164,6 +162,16 @@ This extension adds support for Server Sent Events to htmx. See /www/extensions
// Add message handlers for every `hx-trigger="sse:*"` attribute
queryAttributeOnThisOrChildren(elt, "hx-trigger").forEach(function(child) {
// Find closest existing event source
var sourceElement = api.getClosestMatch(child, hasEventSource);
if (sourceElement == null) {
// api.triggerErrorEvent(elt, "htmx:noSSESourceError")
return null; // no eventsource in parentage, orphaned element
}
// Set internalData and source
var internalData = api.getInternalData(sourceElement);
var source = internalData.sseEventSource;
var sseEventName = api.getAttributeValue(child, "hx-trigger");
if (sseEventName == null) {
@ -224,6 +232,7 @@ This extension adds support for Server Sent Events to htmx. See /www/extensions
ensureEventSource(child, sseURL, retryCount);
});
registerSSE(elt);
}
function ensureEventSource(elt, url, retryCount) {

3
test/ext/sse.js
View File

@ -201,7 +201,8 @@ describe("sse extension", function() {
'<div id="d1" sse-connect="/event_stream" sse-swap="e1">div1</div>\n' +
'</div>\n'
)
this.eventSource.url = "/event_stream"
this.eventSource.sendEvent("e1", "Event 1")
byId("d1").innerText.should.equal("Event 1")
})
it('only adds sseEventSource to elements with sse-connect', function() {