Update for multiple event names

+ tests

3 files changed, 43 insertions, 20 deletions

diff --git a/src/ext/sse.js b/src/ext/sse.js
index 24416ec2..cb2a3d25 100644
--- a/src/ext/sse.js
+++ b/src/ext/sse.js
@@ -80,6 +80,10 @@ This extension adds support for Server Sent Events to htmx.  See /www/extensions
 	 */
 	function createEventSourceOnElement(parent, retryCount) {
 
+		if (parent == null) {
+			return;
+		}
+
 		var internalData = api.getInternalData(parent);
 
 		// get URL from element's attribute
@@ -117,24 +121,27 @@ This extension adds support for Server Sent Events to htmx.  See /www/extensions
 		// Add message handlers for every `sse-swap` attribute
 		queryAttributeOnThisOrChildren(parent, "sse-swap").forEach(function(child) {
 
-			var sseEventName = api.getAttributeValue(child, "sse-swap");
-
-			var listener = function(event) {
-
-				// If the parent is missing then close SSE and remove listener
-				if (maybeCloseSSESource(parent)) {
-					source.removeEventListener(sseEventName, listener);
-					return;
-				}
-				
-				// swap the response into the DOM and trigger a notification
-				swap(child, event.data);
-				api.triggerEvent(parent, "htmx:sseMessage", event);
-			};
-	
-			// Register the new listener
-			api.getInternalData(parent).sseEventListener = listener;
-			source.addEventListener(sseEventName, listener);
+			var sseEventNames = api.getAttributeValue(child, "sse-swap").split(",");
+
+			for (var i = 0 ; i < sseEventNames.length ; i++) {
+				var sseEventName = sseEventNames[i].trim();
+				var listener = function(event) {
+
+					// If the parent is missing then close SSE and remove listener
+					if (maybeCloseSSESource(parent)) {
+						source.removeEventListener(sseEventName, listener);
+						return;
+					}
+					
+					// swap the response into the DOM and trigger a notification
+					swap(child, event.data);
+					api.triggerEvent(parent, "htmx:sseMessage", event);
+				};
+		
+				// Register the new listener
+				api.getInternalData(parent).sseEventListener = listener;
+				source.addEventListener(sseEventName, listener);
+			}
 		});
 
 		// Add message handlers for every `hx-trigger="sse:*"` attribute
@@ -254,11 +261,10 @@ This extension adds support for Server Sent Events to htmx.  See /www/extensions
 			});
 
 			settleInfo.elts.forEach(function (elt) {
-				console.log(elt.classList);
 				if (elt.classList) {
 					elt.classList.remove(htmx.config.settlingClass);
 				}
-				triggerEvent(elt, 'htmx:afterSettle', responseInfo);
+				api.triggerEvent(elt, 'htmx:afterSettle');
 			});
 		}
 	}
diff --git a/test/servers/sse/static/index.html b/test/servers/sse/static/index.html
index 18853421..996bd220 100644
--- a/test/servers/sse/static/index.html
+++ b/test/servers/sse/static/index.html
@@ -17,6 +17,7 @@
 	<div id="navigation" hx-target="#page" hx-push-url="false">
 		<a href="index.html" class="selected" hx-boost="false">About</a>
 		<a href="" hx-get="sse-simple.html">Simple</a>
+		<a href="" hx-get="sse-multiple.html">Multiple</a>
 		<a href="" hx-get="sse-multichannel.html">Multi-Channel</a>
 		<a href="" hx-get="sse-triggers.html">Event Trigger</a>
 		<a href="" hx-get="sse-target.html">Event Target</a>
diff --git a/test/servers/sse/static/sse-multiple.html b/test/servers/sse/static/sse-multiple.html
new file mode 100644
index 00000000..b583e2cc
--- /dev/null
+++ b/test/servers/sse/static/sse-multiple.html
@@ -0,0 +1,16 @@
+<h1>Multiple Events Test</h1>
+<h3>Description</h3>
+<p>
+	This page connects to a single Server Sent Event (SSE) streams, but listens to multiple events.  
+</p>
+<h3>Example HTML</h3>
+<pre class="code">
+&lt;div hx-ext="sse" sse-connect="http://localhost/posts.html?types=Event1,Event2" sse-swap="Event1,Event2"&gt;Waiting for Posts...&lt;/div&gt;
+</pre>
+
+<h3>Test Cases</h3>
+
+<div>
+	<div class="container" hx-ext="sse" sse-connect="http://localhost/posts.html?types=Event1,Event2" sse-swap="Event1,Event2">Waiting for Posts...</div>
+</div>
+</div>
\ No newline at end of file